Pretty much since it was announced HTML5 has been touted by many pundits as signaling the death of Adobe’s Flash. Whether or not that eventuates, only time will tell but a tool being developed by Adobe codenamed Edge is only likely to fan the flames for those predicting Flash’s demise. Still only in prototype form, Edge is an HTML5 animation tool that makes it easy for web developers and designers to create animations and transitions without having to slug through line after line of HTML5 code.
Edge was demoed during the Adobe MAX 2010 keynote address by Adobe CTO Kevin Lynch and is described by Adobe Fellow Mark Anders in a video on Adobe TV (see below) as an example of some of the concepts Adobe is looking at bringing into an actual tool sometime in the future. While it is relatively simple to create an animation with HTML5, it can be difficult to choreograph the movement and transformation of various elements of an animation so everything moves where you want it when you want it. It is the choreographing these various elements that Edge focuses on.
The Edge user interface will be familiar to Flash developers with a Stage window displaying the layout of the HTML5 page and a timeline window underneath showing the modifications to various elements over time. To the right of the stage is a Layers panel showing to identify DOM elements. Selecting a layer will display that layer’s properties in the property explorer, which also supports the new CSS transformations in 2D and 3D. The Flash similarities also extend to the use of “Actions” to manage groups of transitions and “Symbols” to group objects.
The Edge prototype uses the Webkit rendering engine to preview animations. Like Dreamweaver, Edge offers a source code editing mode so, like Dreamweaver, when it’s probably a good idea for users to have some knowledge of coding to verify that the generated code is clean.