STEP 03 establishing a BACKGROUND SYMBOL

Flash movies are generally intended to be viewed through a web browser, embedded in an HTML page. Consequently, your movie may be placed in an HTML page with a background color or image that works against, or clashes with, your design. For example, most of the spots I design are delivered to the client, who then adds them to his corporate site. Often, they become an addition to a preexisting page, one that has its own background color. To maintain complete control of the movie, I always create a background symbol that matches the dimensions and color of my stage.

This is extra cool because, in addition to ensuring that my background color will be present, regardless of who may be writing the embed tag, a background symbol can aid my animation. Let's say, for example, that you need to momentarily distract the viewer while bringing on a new element in your animation. With a separate background symbol, I can change the background color for a frame or twoeffectively flashing the backgroundto draw the viewer's attention away from the new visual element, and at the same time add energy to the animation.

Follow these steps to create the background symbol:

1. Click once on the background layer. The Pencil icon that appears next to the name indicates that the layer is active and ready for editing.

2. Choose the Rectangle tool from the drawing toolbar (see figure 02:04, top circle).

   
   

   Figure 02:04.

   

   
   

3. Select the Line Color button and, from the pop-up color picker, choose the No Color option (see figure 02:04, middle circle).

4. Choose the Fill Color button and select black from the Color pop-up (see figure 02:04, bottom circle).

5. Draw a rectangle over the stage. Your rectangle doesn't have to exactly line up with the stage; you'll have a chance to adjust that next.

6. While the new rectangle is selected, choose Window > Inspectors > Object to open the Object Inspector. Alternatively, you can use the keyboard shortcut Ctrl-Alt-I / Cmd-Option-I.

7. Enter in both the x and y fields. This moves the origin point of the rectangle (the top-left corner) to the upper-left corner of the stage.

8. Enter 550 in the w (width) field and 400 in the h (height) field to match the dimensions of the stage.

9. Click Apply when you're done. The selected rectangle should completely mask the stage at this point, as shown in figure 02:05.

   
   

   Figure 02:05.

   

   
   

10. With the rectangle still selected, change it into a symbol by pressing the F8 key. In the resulting Symbol Properties dialog, enter background for the Name and select Graphic as the behavior.