Wednesday, January 7, 2009

How to find your way in an existing Flash presentation…

Wow, this was absolutely brilliant! I can't believe that people are this helpful. The original question:

I've done quite a bit of Flash and Flex programming in AS2 and AS3 (well, Flex only in AS3 :). <self-definition>I've gotten these platforms to do exactly what I want. I've built Flash components and created an MVC framework in Flex, etc.</self-definition>

If you hand me a Flex app that I've never seen and say, "make these changes," I know where to start understanding the application: from the Application tag downwards. It's probably got some interaction with a server somewhere, with some callbacks, etc. Or some interaction with a framework.

If you hand me a Java app I can do the same: go from the front-end to the back end, or maybe go backwards through the method calls.

But if you hand me a Flash app I'm totally lost for the first hour while I try to guess why it works the way it does... and if it doesn't compile, I think I would be lost forever. This has to do with the MCs embedded in MCs (some of them hidden! great!), and not so much to do with the code. Then the code is spread out in all different frames, scenes, etc., so as to when what fires only the original developer knows.

When I do pure Flash I do everything in Components and use a very flat structure, but that´s a different story. My question is for the Flash presentations I get:

How do you start understanding an existing Flash presentation when you get it? What do you look for first, etc.? Do you have any tips on making sense of a Flash presentation you're seeing for the first time?

and the first amazing answer, from this guy

Well, if you're given an FLA, the first thing I'd do is try and grok the overall structure of the application, and that begins with looking at the main (root) timeline. If it looks empty, or has nothing but actionscript, then clearly the thing is code-driven - read that script or look for a document class, and assume the library is just a component repository.

If the root timeline is populated, then generally it's either an animation of some kind, meant to be played through, or else it's a state management system, where the application moves from frame to frame when it changes display states. If it's an animation then that's usually straightforward, but you'll need to figure out whether it plays straight through or jumps about (look for frame labels), and especially what happens after it finishes. If the root timeline is a state machine, then you're off and running - you can generally assume that each important frame (often they'll have labels) is hierarchically equal, and examine them more or less separately. Also be on the look out for content that's fundamentally a state machine, but with transitional animations between the states.

Now with that said, the really powerful-but-confusing thing about Flash Authoring is that every time you look inside a movie clip, you kind of have to recurse back two paragraphs and start the process over, because that MC might itself be a component or a display-state machine or an animation. When you look at a bunch of movie clips you never really know which ones house a trivial graphic and which house lots of complexity. So you divide and conquer - for any given clip, figure out what all nontrivial things it contains, and then figure out what each of them is doing.

More random tips:

  • Learn to use the movie explorer (alt+F3 on PC) to determine which clips contain actionscript. You'll probably see lots of trival "stop" commands sprinkled around, but if there are big chunks that house logic, you want to figure out what they do, and where they are in the hierarchy of objects.
  • If you find any scripts attached to movie clips, gird yourself for righteous battle - you're not in for a good time. Fortunately this is not allowed in AS3.
  • When lots of stuff is jumbled together, try expanding all folders in the timeline and going through them turning visibility on and off to get an idea of what's where. The library may be in disarray, but at least on the timeline assets must be layered in the same order they visually overlap, and this often gives you clues. Organize them sensibly into folders if the original designer didn't.
  • It's also a good idea to do a "select all" once in a while to get a sense of which things are separate objects, and whether there are any invisible assets. Empty clips, or clips with nothing on the first frame, always show up as a small white circle, but clips whose alpha is 0 do not show up at all unless you select them, or turn on outline mode (the little colored button on each timeline layer).
  • When you see the small white circle that marks an empty clip, make sure to check it out. It might be a container for loading content into, or a clip with graphical assets but not on the first frame, or even a marker that other content will be aligned to. But you can bet that it's hiding some complexity from you.
  • If it ever seems like there's less in the root timeline than there should be, just for kicks open up the "Scene" panel. Some designers are crazy like that.

No comments: