Designing and animating characters in Flash – Part 2: 2.5D animation

Setting up the Timeline

As showed you in the example in Part 1, I used the Distribute to Layers command to help organize my layers on the Timeline. Flash placed each symbol on its own layer and named each layer based on its symbol name (see Figure 2).

Figure 2. Each symbol in the Timeline exists in its own layer.

The option to Show all Layers as outlines it turned on so that you can see how each part of the character's body is separated. This is important because motion tweens require you to place only one symbol per layer during the tween. If you try to put two different symbols on the same layer within the same motion tween, the tween will break.

Clicking the Outline icon immediately to the left of Frame 1 causes all of the artwork to appear as outlines, which can be helpful as you are aligning and animating the pieces (see Figure 3).

Figure 3. Character displayed with the outlines setting enabled.

At this point in the process, I extend the length of each layer by inserting a number of frames. First, select the desired end frame number and drag your cursor down across all layers to select the same frame vertically. Press the F5 key (to insert frames) and Flash will insert the frames that extend to the frame number of your selection (see Figure 4).

Figure 4. Timeline as it appears after extending the frames.

Now that the Timeline is set up and there's a character on Stage that is ready to be animated, let's move on to the next goal—using the Timeline to add motion spans and create animations to bring the character to life. I also describe how to use the Transform tool to squash and skew various parts of the character to add subtle movements.

Page 2 of 5

Previous Page

Next Page