Mark Angeletti |
16 June 2006
Adobe's (formerly Macromedia's) Flash
application is, according to them, "The industry's most
advanced authoring environment for creating interactive web
sites and digital experiences." However, many users have
trouble structuring their site efficiently within Flash.
When Flash is opened, a blank canvas appears, and a single
layer with multiple blank frames displays, waiting to be
used, as you can see in the image below. There's little
guidance on how to proceed, and many different directions
that one can take. So it's easy to see why users can become
Over the past six years of working with Flash and helping
others with their own Flash projects, one thing has become
clear to me: no two Flash web sites are laid out the same.
Sadly, over 90% of the Flash sites I've seen are not
structured efficiently; some are horribly inefficient. While
there may be no one right way to structure a Flash web site,
some ways certainly are better than others.
Keep in mind that when I say "structure" I'm not talking
about how your web site looks; we don't care how your web
site looks, at least, not in this article. Structure is
about setting up your Flash site with Keyframes,
ActionScript and MovieClips, and controlling the Flash
playhead. Good structure can make your site load faster,
make it easier to manage and update, and keep unexpected
things from happening. A bad structure can increase load
times, make it painful to make future changes, and cause
unexpected headaches. The principles explained in this
article apply to all Flash site designs.
In this article, we'll develop a navigation system. Though
it might seem trivial, this will serve as a good example for
this article and the techniques can be applied to any
project you're working on, be it a full Flash web site, a
Flash poll, or a Flash RSS reader. Incidentally, I've
created all of these in the last month, and all exhibit the
structure that we'll see here.
Now is a good time to go ahead and download the necessary
files so that you can follow along. The code archive below
contains a Flash FLA file, an XML file, a CSS file and a PNG
Once you open the navigation.fla file, you'll immediately
notice how empty it looks. This file contains but 2 layers
spanning 4 frames. Almost all my Flash 'creations' have a
similar structure: typically no more than 5 frames and a
handful of layers. If your Flash structure looks like the
one shown in the image below, you're doing something wrong
-- it's a good thing you're reading this article.
Let's start with a tip: Never use Scenes.
Scenes can cause unexpected results from the playhead. The
playhead doesn't really move from scene-to-scene gracefully.
Depending on your Flash site, you may or may not notice
this. But, if you're playing a music file and your playhead
moves to another scene, you can witness problems as the song
skips. For this reason, you won't find more than one scene
in our file.