How To Use Google Swiffy to Convert Flash Into HTML5

Swiffy is a tool developed by Google to convert Flash into HTML5,
As digital advertising industry is shifting from using Flash creatives to HTML5 built creatives, there are plenty of tools which can help you to do that.

What are the prerequiste ?

As we all know that Flash file contain Clicktag which is variable use to track the clicks and redirection to advertiser page.Read More ClickTag

The clicktag is case sensitive so ClickTag clickTAG and ClickTAG are diffrent ,
So make sure which kind of clicktag is implemented inside the swf file that you are going to convert.

Secondly If we decompile the flash file using various tools such flash docompiler,SWFInvestigator by Adobe, We will be able to see which kind of clicktag is implemented and how it is implemented

And implementaing Click url was not accepted in our old method of trafficking the swf creatives,
But for Flash to HTML5 conversation , you will need the clickurl as direct third party url and addtional impression tracker from third party so that impression will get recorded inside third party adverser.

Once this checks are done its time to upload the swf 

Steps

• Open the swf file with flash decompiler and check the clickurl implementation

• Go to https://developers.google.com/swiffy/convert/upload

• Once you saved the converted HTML5 file, Open the file into Notepad++ or Notepad.

     We just need to upload only some code in Adserver,
     If additional trackers are provided then we need to upload the code below the HTML5 Converted code.

Now copy highlighted Code from Notepad++ and upload in Adserver,

Since we didn’t append any click macro we need to manually append the code in front of the URL.

Append %c which is universal click macros before click url

• If you are using DoubleClick tracker then below are the few changes that can help in tracking  

You need to modify the Swiffy code by adding an additional line of code - as below. Make sure you add the add the line exactly before stage.start().

  [...]
    <div id="swiffycontainer_%ecid!" style="width: %%WIDTH%%px; height: %%HEIGHT%%px"></div>
    <script>
      var stage = new swiffy.Stage(document.getElementById('swiffycontainer_%ecid!'),
          swiffyobject, {});
      stage.setFlashVars("clickTAG=%%CLICK_URL_ESC%%%%DEST_URL%%");          
      stage.start();
    </script>/
  </body>


Flash variables are case-sensitive. If the Flash creative expects a different clickTAG case format (e.g.clickTag, clicktag, or CLICKTAG), you should change the variable case accordingly. If you don’t define the clickTAG case properly, clicks won’t be tracked correctly, and the creative won’t redirect to the correct destination URL.

Also, if you’re using synchronous Google Publisher Tags, make sure to add _%ecid! in the Swiffy code snippet, as highlighted above. This ensures your Swiffy-generated HTML5 creatives don’t clash if more than one serves at the same time.