Macromedia Flash Tutorial, Continued

Creating a Digit

You should now have one frame of your Stripes template completed and saved as a symbol named Numbers. The next step is adding a copy of the stripes you created to each of the remaining frames. To do this, you'll need to use the timeline.

Every graphic and animation in Flash is based on the timeline, which displays the contents of a Flash movie over time. Each frame in a movie represents a single point in time. The frame rate (number of frames per second) can be adjusted by the user (Modify > Movie > Frame Rate).

We'll create the number 4 as our example of creating a digit. Go to the timeline and highlight frames 1 through 10. Click the right mouse button and select Insert Keyframe. A copy of the stripes template will now be in each frame. Since zero will be in frame 1, go to frame 5 where we will create the number 4. Drag the symbol Four Shape from the Flash symbols library (or import or create your own number shape) and place it beside the stripes. You may want to refer to the graphical tour to see how this looks if you haven't already.

For the "Stars and Stripes" theme, we'll create digits that are constructed from stripes and have no edge border. To do this, the first step is to break apart the 4 symbol (Modify > Break Apart). Next select the ink drop tool and select a small or hairline line size. Apply an outline to the number 4, then deselect everything by clicking on a blank area. Once you've deselected everything, select the interior of the 4 and delete it.

Now take the outline of the 4 and place it on top of the stripes. When it is in the correct position, delete the portions of the stripe that are outside of the digit's outline. Next delete the outline of the digit itself.

You can create a Stars graphic (a blue box with stars) in the same way that you created a Stripes graphic. When you've created and saved the Stars graphic, create a Stars layer in the Numbers graphic. Make sure you are still in frame 5 when you do this, since you want to apply the stars to the number 4. Now drag the Stars graphic from the Library. Align the Stars graphic over the upper left corner of the 4. You're done with the number 4. Other numbers can be created in a similar manner.

view a printable version of this article