Adobe’s Edge HTML5 Web Tool Blazes A Trail To The Post-Flash Internet

Today Adobe is launching a public preview of Edge, its tool for web designers that allows moving, interactive graphics on a website using HTML5, not Flash. Adobe tells Fast Company why it’s the tip of the iceberg.



Today Adobe publicly launches the preview of Edge, its Flashless animation tool for web designers. And it’s free to download for anyone interested at Adobe’s Labs webpage. Adobe’s been tinkering with HTML5 tools for a while now, and it actually showed its new Edge authoring tool at the MAX 2010 company conference–but with the public preview comes proof that Adobe’s readying itself for a post-Flash Internet.

Fast Company spoke to Adobe senior computer scientist Josh Hatwich about it, and saw a demonstration of Edge in action. Slick as it is, it’s missing interactive functionality, the ability for Edge-created objects to react to user clicks and text inputs in the way that advanced Flash code does (in games, adverts, and many a tool on many a website). It’s coming soon, Hatwich says. The launch timing begins with the pre-release that enables animation, shortly followed by shapes, expressivity and coding (for truly clever behind-the-scenes website stuff), and then interactivity and graphics will arrive for testing in the public pre-beta before an expected “1.0” product in 2012.

Edge will let web coders “bring animation, similar to that created in Flash Professional, to websites using standards like HTML5, JavaScript and CSS,” according to Adobe’s press release, which also cautions that there are “rapid changes around HTML5,” so it’s “adopting an open development methodology for Adobe Edge and is releasing the software on the Adobe Labs site much earlier than normal in the development proces–before it even reaches beta.” The bold move allows “user feedback to help shape the final product.”

Users of Adobe’s professional products like Flash Professional or Lightroom will be familiar with its clean, simple modular panel display, with a “working window” and a timeline. By clicking on objects in a web page, designers can then drag them to the timeline and apply effects on a timed basis, moving graphics around, rotating them, fading them in and out with certain speeds and timings. There’s all the usability of a slickly-designed UI here, and all the complexity coders will appreciate like tweening and easing (the gentle “slowing” of an image as it zooms into its place, making the effect more elegant to the eye). The casual observer will also recognize this as the sort of functionality usually delivered by Flash code in websites–if you’re not immediately familiar with it, pick almost any photographer’s website from Google, as they love the stuff and their websites are infested with Flash because it makes browsing their portfolio more eye-pleasing.

More thoughtful observers will also notice the similarlity with Flash and note the prominence of the words “HTLM5” and “CSS” in the press release. And Adobe says “Edge Preview works natively with HTML,” “enables users to add motion to existing HTML documents without hampering design integrity of CSS-based layouts,” “create visually rich content from scratch, using familiar drawing tools that produce HTML elements styled with CSS3” and “standard web graphics assets such as SVG, PNG, JPG and GIF”–all signs of a future-facing toolset that utilizes much more open web standards than its proprietary Flash system did.


“Content created with Edge is designed to work on modern browsers including those on Android, BlackBerry, Playbook, iOS, HP webOS, and other smartphone mobile devices as well as Firefox, Google Chrome, Safari, and Internet Explorer,” the announcement continues. Essentially Adobe’s admitting that it needs to have its presence felt on all of the new mobile browsers (thanks to the explosion in smartphones and tablets) and all modern high-tech web browsers.

The words “iOS” and “Safari” stand out the most, of course. Because Steve Jobs famously insisted Adobe’s Flash be left out of the iPhone and iPad user experience since, he argued, Flash is unreliable on the desktop, causes too many browser crashes, and eats too much processor power. On a mobile platform this would all be much worse, because Steve’s vision for the iPhone is that “it just works” and a processor-thirsty web browsing experience would dint the battery life and result in unsatsifying performance from the lower-power CPUs in a phone compared to a desktop. Jobs’s stance started a cold war with Adobe, inspired a PR campaign for Android phones along the lines they offered Flash compatibility and thus a “full” web experience (despite poor first reviews), and there were even rumblings of legal action due to Apple’s alegedly monopolistic position on the matter.

But Jobs is actually winning his battle, and much web video has already been switched from Adobe’s proprietary and troubled Flash system to HTML5-friendly versions that run on iPads and iPhones.

Edge is strong evidence that Jobs was right, and in fact Adobe has had to release something like Edge so it doesn’t get left behind as a champion of old tech. The astute among you will note Edge doesn’t quite offer all that Flash does, and Adobe does stress it’s currently meant to be a “lightweight professional tool” that complements Adobe’s existing web tools, such as Adobe Dreamweaver, Adobe Flash Professional, and Adobe Flash Builder 4.5 software. But remember, Flash wasn’t fully featured at first, when it emerged from Macromedia’s labs, and it had more features added over time.

But while Adobe in a sense had to launch Edge, to keep a presence in the web design and devlopment game even as the web evolves around it, developers will be pleased because what Adobe’s promising is powerful, and is wrappered in Adobe’s usual sleek tool design. Other companies have tried to do this already, with the Hype app on the Apple Mac App Store being a particularly good example, but Adobe’s tool is most likely to be the definitive one–it’s jumped out ahead of the others, after all.

[Image: Flickr user scobleizer]


Chat about this news with Kit Eaton on Twitter and Fast Company too.


About the author

I'm covering the science/tech/generally-exciting-and-innovative beat for Fast Company. Follow me on Twitter, or Google+ and you'll hear tons of interesting stuff, I promise.