Wallaby: Adobe Releases Beta Flash-to-HTML5 Converter

Today at FITC in Amsterdam Adobe announced a prerelease version of an app—codenamed Wallaby—that converts Flash (FLA) files to HTML5, CSS3 and SVG. Adobe has made it clear that this is a “preview of experimental technology” and is releasing Wallaby on Adobe Labs, where its public betas and other experimental software first gets seen by the public. It’s currently a standalone AIR application and free to download, but Tom Barclay, Sr. Project Manager of Flash Professional, tells me it might eventually be deployed as an export option in a future version of Flash Professional.

Adobe MAX attendees and followers might remember the Wallaby demo and the general buzz around HTML5 at that event last fall, but I recall it was mostly about Edge, which is actually significantly different. Edge looks much more like a Creative Suite product—I compared it to Flash Catalyst—and it basically lets Flash users work with a Flash-like application and get HTML5 as the output. Wallaby would let Flash users work in Flash Professional itself and still get HTML5. Being that there’s already three Flash Platform applications on the market, I think exporting HTML5 from one of those existing apps is a superior strategy to creating another Flash-like product.

Wallaby’s user interface is plain but the product is still experimental.

I’ve seen Wallaby in action and here’s some technical details:

  • Wallaby’s user interface will list errors and warnings that arise during processing. The UI can also run batches and can be scripted.
  • Sound and video assets are not included in the final output. There’s also quite a few Flash functions that don’t translate to HTML5: dynamic masks, 3D transforms and 3D tweens, filters (except alpha) and blend modes.
  • ActionScript is also discarded, and not translated to JavaScript like I would have hoped. Translating ActionScript to JavaScript would be a huge game-changer but I’m not surprised it hasn’t happened yet.
  • Graphics are converted to SVG (vectors) or JPEGs (bitmaps). Text might be converted to SVG as well, but Wallaby will use standard paragraph HTML tags if possible.
  • Animations are recreated not with JavaScript or a framework like jQuery, but with CSS animations—particularly webkit-transform, which only works in WebKit browsers like Safari and Chrome. Firefox users can modify the code and get CSS animation to work. As usual, Internet Explorer users are out of luck.

A code snippet shows well-formed HTML5 and usable hooks for CSS and scripting.

I’ve seen the HTML5 code that Wallaby outputs and it looks clean and easy to work with after conversion. There’s enough hooks to manipulate the elements with your own JavaScript or a framework like jQuery. Wallaby’s downside is its inability to translate many of Flash’s features into HTML5—animations and advertising are about the only Flash projects that can be cleanly converted to HTML5. Projects that depend on multimedia, ActionScript and complex Flash effects and filters might as well stay in Flash, but of course that prevents it from being seen on iOS devices. But there’s a lot of Flash animations on the web, and those are exactly the elements Wallaby handles well.