CSS Animation Imports

A) CSS Animation Imports

CSS animations (and the GPU) are really good at animating position, rotation, or
scale, this combined with beautiful bezier curve transitions and if you're
creative you can come up with some pretty amazing animations. However if you've
ever worked on any large or more complex web animations, especially if you're
porting them over from after effects you're bond to run into some limit of the
web and pretty quickly and have to resort to expensive hacks.
 
The main walls I ran into with CSS can be solved by this; If CSS has the ability
to compose animations into a hierarchy of groups. After effects calls these
compositions. (http://helpx.adobe.com/after-effects/using/composition-
basics.html) The short of it is the ability to create an animation in a
sandboxed environment and then include that animation into other compositions,
creating a hierarchy. With this my vision would give the developer the ability to
position, rotate and scale the imported animation one or multiple times, or even
use compositions as masks for other compositions. Editing the origin would then
propogate changes to every copy of the animation you have in the project.
(TODO: Explain how sibling compositions have the ability to reference other
composition's origin, position, scale, rotation etc..)
 
This fits into the ideology of the new world of Web Components where everything
is a module that is self contained unit than can be shipped and imported into
other projects. My idea would apply the same concepts to animations.
 
To be continued...