Hybrid View

Naming and Reuse of Animations

Naming and Reuse of Animations

In looking at the CSS Exported from Sencha Animator I'm noticing most objects are named along the lines of 'AN-sObj-val-18' rather than the name specified in the object panel. Animations are also named in a similar manner 'AN-ani-1', and don't appear to be reused throughout the animation/document. For example I should be able to apply a 2 second animation that moves an object from 0 to 50% (200px, 20ems, etc) to more than one object using only one declaration - this idea a fundamental to CSS in the way that class and element definitions can (and are) reused. As it stands Sencha does not provide me a means to apply existing animations to other objects/elements.

Ideally, I'd love to have a 'library' of animations (either defined within my current document and/or from a larger library that ships with the application) that allows me to quickly apply animations to objects (similar to Apple's Keynote, Motion, Final Cut, etc) AND more importantly reuse defined animations resulting in a smaller exported file size.

Also, being able to name objects and animations (and have the names exported intact as #ids and .classes) will allow for easier customisation outside of Sencha Animator where designers/developers may decide to use jQuery or some other tools/libraries to further continue creating their page/site/app/animation/art/etc.

You can add your own CSS-IDs right now with the CSS-ID field below the text entry box in the object panel. Canned/library animations are definitely on our feature list - they will save a huge amount of time, particularly for any animation that involves physics.