Game Development Reference
The primary purpose of the timeline in Flash is as an animation tool. You can think of it as spool of
film, in which each frame represents a snapshot showing an object in a slightly different position than
in the previous frame. When the frames are played sequentially in quick succession, the illusion of
motion is created.
The timeline is a fantastic tool for animation, but I won't delve too deeply into timeline animation in
this topic (it's discussed in Chapter 8, but it's a topic worthy of a topic in its own right). What you'll
be looking at, however, is the wonderful and unplanned side effect of the timeline as a way of storing
You can think of each frame in the timeline as a little box that you can use to store some informa-
tion about an object. Suppose that you want to store some of your little sister's states as information
on the timeline. In one frame, you could keep her happy state, in another frame you could keep her
sleeping state, and in a third you could keep her annoying state. If she were starting to annoy you too
much, you could just program a button to tell the timeline to go to the frame that stores her sleeping
state. Now that would be a great program!
Unfortunately, try as they might, programmers just can't seem to get as much control over the emo-
tions of the people around them as they do over their code. But they have come up with a solution
for that: to program the people from scratch in code. That's a pretty big project, and although it has
been attempted many times (try a web search for “alicebot” for one example), you'll set your sights
somewhat lower. You'll use the timeline to build a simple state machine for an interactive frog.
First, you need a frog Movie Clip symbol to get started:
1. In the opknu>kkg*bh] file, create a new Movie Clip symbol called Bnkc. (Remember to check
Export for ActionScript when you do this.)
2. Design your frog however you like. If you're still getting your Flash graphic design feet wet,
refer to Chapter 2 and model your frog on the design of the cat character.
If there are graphics on the frog that you expect will change in any of your states, they need
to be on separate layers. I put the frog's eyes, body, and feet on different layers to help myself
stay a bit more organized, but you can keep this basic design of the frog on one layer if you
want to for this project. I also designed my frog with a closed mouth because you'll be giving
it an open mouth in a later state. My frog looks like Figure 4-18.
Figure 4-18. Design your frog.