Analysis: Google Swiffy: Convert Flash to HTML

About a month ago we had from Google this extension presumely to transform Flash to HTML easily.

If you go to the website you can download it as an .mxp. I shall remind you that if you have more than one Flash version installed you could have a conflict with the Adobe Extension Manager. I had to unistall the previous version of it so as to run this extension.

Easy to install

Download the Swiffy Extension (.mxp file) and open it.Adobe Extension Manager will install the Swiffy Extension, making it immediately available to use from Flash Professional.

Export to HTML5 with one command

The new “Export to HTML5 (Swiffy)” item in the “Commands” menu exports your file to HTML5 and opens the result in your default web browser. Assigning a keyboard shortcut to this command makes it even easier!

Quick feedback

Information about the conversion process, such as features that are not supported by Swiffy, is shown in the “Output” panel, immediately after the export finishes.

So, you have it installed! And now?

Let´s make a simple banner with no Code, only timeline animation, with Actionscript 2 and exported as a .swf, you will have this:

Now, if you go to Flash > Menu> Commands > Export as HTML5 (Swiffy) you will have this advice first:

Later, your brower will open a new Tab, so if your .swf route was this:

whatever/300x250_timeline_animation_as2.swf

In my case: http://www.fernandocomet.com/blog/300x250_timeline_animation_as2.swf

Now you will have this:

whatever/300x250_timeline_animation_as2.swf.html

In my case: http://www.fernandocomet.com/blog/300x250_timeline_animation_as2.swf.html

And if you upload to a server and embed it

So, there´s no difference by now.

Let´s do this in Actionscript 3. You won´t have the Warning, and about the results:

Exported as .swf:

Exported with Swiffy as HTML5:

There´s no difference. I would even say that it´s easier in Actionscript 3 as there are no warnings.

So let´s try now with some code:

Do not try to do it in Actionscript 3, you will have this Warning:

Swiffy Flash Extension for Win v1.0.13 [Swiffy v3.6.1]

- Warnings -

Scenes are not supported.

ActionScript 3.0 is not supported.

In Actionscript 2 you can´t use blend modes.

The good news is that you can use Greensock library

For example in a banner in Actionscript 2 with this code:

[CODE]

import com.greensock.*;

import com.greensock.plugins.*;

function infiniteMovement()

{

textbanner._alpha=0;

TweenLite.to(textbanner, 1, {delay:1, _alpha:100});

TweenLite.to(textbanner, 1, {delay:3, _rotation:360, overwrite:false});

TweenLite.to(textbanner, 1, {delay:7, _alpha:0, overwrite:false, onComplete:onFinishTween, onCompleteParams:[4,bg]});

TweenLite.to(textbanner, 1, {delay:6, _rotation:0, overwrite:false});

}

function onFinishTween(parameter1:Number,parameter2:MovieClip)

{

infiniteMovement();

}

infiniteMovement();

stop();

[/CODE]

The result in HTML5 once exported is this: