Three HTML5 animation tools: Adobe Edge, Sencha Animator, Tumult Hype

Web interaction via HTML5 can be promising but difficult to learn. These three applications can make a developer's job simpler.

1 2 3 4 Page 3
Page 3 of 4

Sencha Animator

Of the three standalone applications reviewed here, Sencha Animator has the distinction of being the oldest -- the first developer pre-release was announced in October 2010. It's a small distinction, given the rapid releases of many tools in early 2011, but it at least gives it the status of being first.

Sencha Animator
The Sencha Animator interface is fairly standard for multimedia content-creation software.

The Animator interface is fairly standard for multimedia content-creation software. The Center Stage area dominates the tool in the lower left corner, with the ubiquitous timeline and object tree on the upper left. The Properties panel comprises the right third of the window.

Creating an animation is pretty easy with Animator. Objects can be created using the included shape tools or by manipulating existing images or video content. Veterans to animation will find few surprises, with standard transforms, gradient and transition tools. All objects in the object tree can be dealt with individually or connected together by nesting them within the tree.

Interactivity is handled by assigning a click action to any given object. For click actions, Animator provides a few pre-built scene-navigation functions, such as the opening of another Web page on click or the capability to run a custom JavaScript app. The choices of available actions are limited when compared to Adobe Edge, but given the capability to connect to any existing JavaScript, you're not really going to miss it.

Beginners to animation should find Animator not too difficult to learn. Sencha's website has several examples and tutorials to get new animators started. The application's similarity in form and function to most video editing tools will also make the transition easier.

Where Animator really differs from its competitors is the output it produces when it creates dynamic web pages. Animator, unlike Edge and Hype, uses CSS3 code in the pages it produces. Since CSS3 animations are the only technology that consistently work across iOS, Android and BlackBerry OS6, this gives Animator projects a big step-up for use on mobile platforms.

Bottom line

If you are planning to build HTML5 pages and apps for mobile users, Animator is a very good tool to use. The CSS3 output works well in that arena and the capability to plug in JavaScript to handle more complex operations affords the application a lot of flexibility.

1 2 3 4 Page 3
Page 3 of 4
It’s time to break the ChatGPT habit
Shop Tech Products at Amazon