Gallery

Adobe Edge Animate proves HTML5 is no substitute for Flash

Posted on 27 Feb 2013 at 09:50

Tom Arah says the shift from Flash to HTML has set web design back 15 years

For more than 15 years, professionals wishing to push the web envelope beyond the capabilities of HTML turned to Adobe Flash (or, more recently, Silverlight). Now, though, the future of web browsing is moving to mobile browsers that no longer support these plugins, so what’s the modern alternative?

Without a plugin, the only way to do it is in the browser. Both Adobe and the web design community must follow Steve Jobs’ advice from 2010, when he announced Flash wouldn’t be allowed onto iOS: use open browser standards instead.

As Jobs put it then, "HTML5, the new web standard... lets web developers create advanced graphics, typography, animations and transitions without relying on third-party browser plugins (like Flash)... Perhaps Adobe should focus more on creating great HTML5 tools for the future, and less on criticising Apple for leaving the past behind."

Put that way it sounds reasonable and straightforward, but Adobe disagreed – no surprise given Flash was its unique selling point, the rich web format that held together its entire Creative Suite (from Premiere Pro through to InDesign), and the basis for its future mobile plans.

It’s back to the drawing board alright, but without any tools

Without Apple’s support, and hence without cross-platform universality, the writing was on the wall, and so the rhetoric and Adobe’s entire business strategy has changed. Flash in the browser is now rarely mentioned, and Adobe has repositioned itself as a champion of next-generation HTML5, taking Jobs’ advice in launching a range of tools designed to set the benchmark for standards-based web creation.

The most significant of these is Adobe Edge Animate, which is designed to create the rich, animated, interactive web experience that previously required Flash. It costs $499, but to encourage take-up Adobe has added it to the apps available through Creative Cloud and has made this first release free – here’s your chance to give your standards-based web projects a professional edge.

Back to the drawing board

So how does Edge Animate compare to Flash? Let’s start with the drawing tools, and you’re in for a shock since there are only three: the Rectangle tool, Rounded Rectangle tool and the Ellipse tool. Flash Professional’s Deco tool for drawing animated fire or vegetation effects is long gone. You don’t even get a Brush, PolyStar or even Pen or Path tools – in fact, you can’t actually draw a straight line unless you fake it with a thin rectangle! It’s back to the drawing board alright, but without any tools.

Edge Animate’s formatting capabilities are no compensation, either. From the Properties pane you can choose flat colours for fill and outline of rectangles or ellipses, set the line width (solid, dashed or dotted), and that’s about it. Special effects? A flat opacity setting and a shadow option, or to really impress you can set a different curvature for each corner of your rectangle.

There are no gradient fills, no textures, no procedural effects, brush outlines, graduated transparency or blend modes. The message is pretty clear that you’re supposed to do any serious artwork externally, so you might expect that Adobe has enabled you to cut and paste vector drawings directly from Illustrator into Edge Animate. You’d be wrong: the only route is via awkward export and import.

Moreover, scalable vector graphic (SVG) images are automatically flattened, so you can’t access their independent elements, which means you’d be better off using JPEG or PNG bitmaps unless you explicitly need resolution-independent scalability. As the help file puts it, "for the time being, it’s safer to use PNG".

Edge Animate does at least let you add text within the program, although you can edit it only in an awkward little dialog box. Formatting includes control over letter, word and line spacing, as well as paragraph alignment and indent. It also includes size and font – but forget about advanced effects such as fitting text to a curve, or within an irregular shape (not that you can create one anyway). Worse still, don’t expect to simply specify any typeface installed on your PC as you could with Flash – the default is those same old web font families of which we’re all so familiar and heartily sick of (although Adobe’s new Edge Web Fonts service may improve matters here).