Adobe Prototype on HTML5's Cutting "Edge"
The Web Dev Zone is brought to you in partnership with Mendix. Download this Forrester Report to gain a better understanding of the low-code platform market and how to make a strategic platform selection you won’t regret.
For web developers and designers, it can be simple to build an HTML5 animation, but difficult to choreograph that animation just the way you want it. You can see below that the Edge prototype has a timeline setup that is commonly found in any video editing or effects software.
Letting the visual tools do some of the leg work can be extremely helpful and time-saving, especially when you have a lot of elements. Of course, you'll need to verify that any generated code is clean and know your HTML5.
A properties editor also supports new CSS transformations in 2D and 3D. The Edge prototype uses the WebKit rendering engine for previewing animations, which should support all of the most stable HTML5 specifications. Of course, Adobe didn't forget developer needs when building the prototype, which currently has a source code editing mode.
Check out this video of Adobe's Mark Anders previewing some of the features in Edge:
One of the commenters on the video was especially pleased with Adobe's new tooling venture, saying: "This tool is looking really promising. As a visual designer I look at the new HTML/CSS features and while they seem cool, there's such a huge barrier between what they can theoretically do and the voodoo that must be done for it to actually work. A tool that does the voodoo for you is what we need!"