Banner Project

(adapted from Flash 5 by Bill Sanders and used with his permission)

Objectives:

• to change the color of the stage
• to use a shape tween (morphing) to create a color change in an object
• to use a motion tween to create a size change in an object
• to use positioning on the timeline to introduce an object
• to introduce the Text Tool
• to introduce an elementary Action Script

Basics:

• the Free Transform Tool can be used to change the orientation of the object. Remember that when the cursor is moved near the corner block a circle will appear allowing the object to be rotated.
• a keyframe is required at the end of a layer involving a shape or motion tween
• the Pencil Tool has an Options menu
• to do a shape tween the objects are not converted to a symbol and the objects are created on one layer
• keyframes must be included when a new shape is introduced
• certain objects lend themselves to the the process of morphing.
• a motion tween can be applied to text if it first converted to a symbol
• an Action Script can be used so that the movie only plays once
• a Stop Action script need only be applied to one layer and the movie will stop
• a little "a" indicates an Action Script has been applied.

Exercise

a) Layers

• no background layer will be included
• change the color of the stage from white to blue by selecting the Properties panel and use the pop-up color mixer on the panel beside the entry Background.
• four layers will be included: Moon rising, Welcome, Telephone and Letter
• select the 80th frame for the 4 layers and insert Frames

b) Moon Layer

• select the Circle Tool and change the Stroke Color Well to red and the Fill Color Well to orange
• use the slider in the Properties Panel and change the stoke to 5
• draw a circle with W = 350 and H = 350
• use the Align Tool from the Modify Menu and select Center Horizontal. Make sure that To Stage has been selected.
• to draw the inner circle
  • using the Black arrow select the circle that has been drawn and make a copy (Command C) of the circle
  • use the Paste in Place from the Edit Menu to paste a copy over the original circle
  • do not deselect anything at this point (do not click on anything on the stage)
  • select the Info panel and change the dimensions of the circle to W = 240 and H = 240
  • select the Stoke Color Well and change the color to white
  • select the Fill Color Well and change the color to dark green
• select the Text Tool (capital A) from the Toolbox
  • in the Properties Panel select a Font (suggest Times) from the pop-up menu and Font Size (suggest 30) using the slider
  • select the color white for the text using the color mixer pop-up menu and select Bold
  • click on the inner portion on the smaller circle and type the message Animation 20 on the first line, Daytime on the second line and Productions of the third line.
  • if the text is too large select all the text by clicking on the A of Animation and dragging over all the text and using the slider select an appropriate size
  • click on the Black arrow key and using the four arrow keys on the keyboard center the text
• select the concentric circle including the text using the Black arrow key and Convert to Symbol
• select frame 1 of this layer and move the instance until it is just off the bottom of the stage
• select frame 80 and insert a keyframe
• move the instance until the top of the large circle touches the top of the stage. Keep the vertical alignment using the X value from the Info panel
• double click on the first frame and from the Properties Panel select a Motion Tween
• lock the layer

c) Letter Layer

• select the Rectangle Tool and change the Stroke Color Well to black and the Fill Color Well to dark blue
• draw a rectangle of dimensions W = 90 and H = 30
• select the Pencil Tool and draw a flap for the envelope
• select frame 1 and select the envelope using the Black arrow and position the letter just off the stage in the upper left hand corner
• select frame 80 and insert a keyframe
• drag the envelope to the lower right hand corner positioning it just off the stage
• change the Fill Color Well to yellow and the color of the letter will change
• double click on the first frame and from the Properties Panel select a Shape Tween
• lock the layer

d) Welcome Layer

• select the Rectangle Tool and change the Stroke Color Well to black and the Fill Color Well to gray
• draw a rectangle of dimensions W =180 and H = 60
• use the Pencil Tool and draw a flap on top of the rectangle illustrating an open envelope
• change the Fill Color Well to light green and using the Paint Bucket color in the inside portion of the flap
• select the Rectangle Tool and change the Fill Color Well to white
• draw a rectangle representing a piece of paper stuck inside the envelope
• select the Text Tool (capital A) from the Toolbox
  • in the Properties Panel select a Font (suggest Times) from the pop-up menu and Font Size (suggest 20) using the slider
  • select the color black for the text using the color mixer pop-up menu and select Bold
  • click on the paper portion and type the message Welcome To on separate lines
  • if the text is too large select all the text by clicking on the A of Animation and dragging over all the text and using the slider select an appropriate size
  • click on the Black arrow key and using the four arrow keys on the keyboard center the text
• select the envelope and piece of paper using the Black arrow tool and Convert to Symbol
• select frame 1 and position the instance off the stage in the upper right hand corner about a sixth of the way down from the top
• using the Info panel change the dimensions to W = 60 and H = 20
• select frame 80 and insert a keyframe
• drag a copy of the instance from the Library and position off the stage in the upper right hand corner about a sixth of the way down from the top
• using the Info Panel change the dimensions to W = 780 and H = 550
• position of the instance so that the top of the paper is just below the top of the stage
• double click on the first frame and from the Properties Panel select a Motion Tween
• lock the layer

e) Telephone Layer

• insert a keyframe at frame 60
• use the Text Tool and select the Times font and size of 32
• click on the lower left hand portion of the stage and type the number 683-7800
• select the number and Convert to Symbol
• using the Info Panel resize to W = 60 and H = 20
• click on frame 80 and insert a keyframe
• select the instance and change the size to W = 180 and H = 60
• double click on the 60th frame and from the Properties Panel select a Motion Tween
• lock the layer

f) Action Script

• select the Moon layer and frame 80 or any of the other layers and frame 80
• select Actions from the Window Menu
• select the stop command from the Movie Control and double click on it
• the script will be placed in the Script Window
• or it may be dragged to the Script Window - the white rectangle

• a little "a" appears above frame 80

• test the movie

Banner Movie