I’ve been using Flash CC to help me speed up my development pipeline. It doesn’t matter if the game is for Adobe Air, HTML5 or any other platform.

For a project I needed to generate this scenario:

Every part of the scenario was exported as a separate PNG and put it together in a spritesheet using Texture Packer (you can create your spritesheet in Flash CC too)

So, I need the coordinates and Z position of each element in a JSON document I can use in my project. Since doing this by hand would take a good amount of time, and will bring headaches if something have to get changed in the future I choose to use Flash IDE.

The first step is to import all the PNGs in a Flash AS3 document. So you have all of them in a single Layer and stacked on the top left corner.

Select everything in the scenario, right click on top of the images and choose Distribute to Layers (or cmmd+a and then shft+cmmd+d). Now you have each PNG in a layer with their name on it, this way is easier to localize, isolate or arrange depth.

You can then import a layer with a flatten reference image to help you arrange the items. I did that, and also tinted the image to visually help me.

Now you just have to arrange your items on screen.

Once you have finished, go to the Library and copy/paste the name of the PNG into the Linkage column, this is going to help us identify the class of each item. We’ll remove the “.png” extension with code, so the names match the names assigned by Texture Packer.

Then we just use this code:

[cc lang=”actionscript”]
import flash.net.getClassByAlias;
import flash.utils.getQualifiedClassName;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.system.System;

var output:Array = [];

for ( var i:int=0; i< this.numChildren; i++)
{
if ( this.getChildAt(i) is Bitmap)
{
var b:Bitmap = this.getChildAt(i) as Bitmap;
var bd:BitmapData = b.bitmapData;
var n:String = getQualifiedClassName( bd ).split(‘::’)[0];
output.push(
{
name:n,
x:b.x,
y:b.y
}
);
}
}

var output_string:String = JSON.stringify(output);
System.setClipboard(output_string);
[/cc]

cmmd+Enter to run the SWF and we will have the generated JSON on our clipboard. Just paste it in your favorite code editor.

This code tracks just the name and x/y position and orders the items from bottom to top. But you can easily modify it to track more properties (rotation, alpha, scale, etc.).

And that’s it! Use it in your favourite game engine.