Animating HTML5

April 18th, 2012 by admin | Filed under Software Applications.

HTML is the language of the Internet. HTML is a great tool, but it has some drawbacks. One limitation of HTML is in the area of animation. In order to have animations in a web page, a separate program must be used. It is a common experience for web surfers to come across a message telling them that a plug-in such as Flash Player needs to be installed to view part of a page. The user must then find and install the program if he or she wants to view all of the page. The other option is for the server that contains the web page to also have software installed to add these elements to the web page as it is downloaded. This adds to the download time experienced by the user.


With the advent of the latest iteration of HTML, designated HTML5, things are changing. HTML5 has the ability to integrate animation. This means that the web server doesn’t have to process the animation, and the user doesn’t need a plug-in to view it. Instead, the user’s browser can process and display the animation using HTML5 instructions. It didn’t take long for programs to be produced to offer easy use of this feature. Three of these new programs are Adobe Edge, Sencha Animator, and Tumult Hype.

Sencha Animator

First available in late 2010, it is the oldest of the three programs. Animation software has evolved over the years so that most programs have some standard features in common, and Animator is no exception. Timeline, properties, and object tree features are all present. This program is suitable for beginning animators, as it is easy to learn and there are tutorials available on Sencha’s website.

One area where Animator stands out is in the use of CSS3. CSS3 is a program that provides underlying code to achieve animation. This format is used in mobile applications such as Android. This gives Animator one advantage over Hype and Edge.

Tumult Hype

For the Mac users out there, this animation tool may be the way to go. It has a customizable interface that will be familiar to Mac OS users. It also has extra features such as a Record button and drag-and-drop screen elements. These features will help make this program easy for beginners to use.

In its effort to keep things simple, though, Hype goes a little too far. It is missing some features that experienced animators would expect, such as being able to apply properties or actions to multiple objects at once.

Adobe Edge

Adobe is the company that produces Flash, and it wants to stay relevant as HTML5 becomes more prevalent. Thus, it isn’t surprising that Adobe has offered a quality product in Edge.

Edge has an easy-to-use interface that has all of the expected features, such as timeline, object tree and properties. Like Hype, it has an interface that is customizable. Panes can be moved around and resized, and preferred configurations can be saved for use with future projects. Edge also has the ability to perform actions on multiple objects simultaneously. Actions can be copied to various location in the timeline, and even copied as a mirror image of the original. Another feature that Edge alone has is a provision for group editing. Files can be changed by multiple animators and the program will incorporate the changes into the finished animation.

Edge definitely has features that will appeal to more advanced users; a drawback may be that the program will be less accessible to beginning animators than Hype or Tumult.

These are all good programs that will find their places in the world of web animation. Mac users may enjoy the familiarity of Tumult Hype. Beginning animators should find an easy way to get started with Sencha Animator. Experienced animators may find that the feature-driven capabilities of Adobe Edge give them the tools they need. All of these programs will allow animators to take advantage of the benefits of HTML5.

Web Hosting Tools Curator

You can find Juliana @InMotionHosting based in Los Angeles sharing all her tech knowledge base on Twitter @JulianaP16.  She is a webmaster gathering cool tools for all your webhosting needs.

Related Posts Plugin for WordPress, Blogger...


Leave a Reply

Get Adobe Flash player