Friday, July 29, 2011

Adobe Wallaby - flash to html5 canvas conversion tool

Just gave wallaby a try with a new flash project. Wallaby is a beta utility that converts flash fla to html5 svg. It has some problems but I am pretty impressed with it thus far. Although it doesn't produce anything of professional quality nor create anything that can be polished. Can't wait until its a fully functional product, its about time adobe figured out a way to support more devices!

Here are a list of release notes with supported features below.

Browsers tested and sorta working:
Safari 5.0.3 - had some loading issues but good results
iPod mobile safari v??? - partly worked, not all animation loaded
Chrome v12.0.742.122 - best results

Firefox 5 - dont work at all :(
IE9 - failure as well

The animation came across exactly as in the flash fla (CS4).
Sound did not get converted
Buttons - hover actions and links don't work

Convert project contains

  • jQuery 1.4.2
  • project_source_assets - folder for all the svg files
  • project.html - loads all svg resource in div containers with styles for the resource/tween/sprite.
  • project.js - file that starts animation for objects and children
  • project.css - styles and css based webkit animations, the styles have an underscore and a number which seems to inidicate the motion or tween setup in flash.

i.e.
.wlby_260
{
    -webkit-animation-duration: 0.28125s;
    display: none;
    position: absolute;
    -webkit-transform: matrix(1, 0, 0, 1, 182.55, 270.05);
}


Stumble Upon CodePyro

No comments:

Post a Comment