At the company I work for we use Functional Specification documents for any new Flash game that we make. Before any of the developers start any coding, the design team puts together a simple frame by frame Flash file to make it easy to see what things will look like in the various states of the game. This will eventually become screen shots put into the spec. There will be an additional section put into the spec that includes all of the top-left and center x,y coordinates for each MovieClip on the stage during each frame. That was usually a tedious part of the job that none of the designers liked doing. When they brought this to my attention, I decided to make a quick script to do this for them. Here are the results:

USAGE:

  • Copy and paste the code into frame 1 of any Flash file
  • Make sure all objects that you want wireframes for are Symbols (for some reason, the x,y is off if they aren’t)
  • Run the swf
  • Use the arrows keys to change frames
  • Use space bar to toggle wireframe view
  • You may press the space bar multiple times to get new random colors
  • You can click and drag on the x,y text to move it to a new location

SAMPLE:

Flash ActionScript 3 X,Y Wireframe Preview, 1

Flash ActionScript 3 X,Y Wireframe Preview, 2

demo | source (.fla) | source (.as)