H  10  11  12  13  14 

Hands-On: Flash MX 2004 Basic Animation

Exercise 10: Tween Position, Scale, Rotation, and Color

There are seven ways in which graphic instances can be varied: Position, Scale, Rotation, Skew, Brightness, Tint, and Alpha. Flash tweens can be modified in these properties as well.

  1. Use the Text tool to create your name at 60pts tall.
  2. Use the Black Arrow tool to select the text block(not the text itself).
  3. Select Insert > Convert to Symbol [F8] and name the symbol myName. Make sure to select Movie Clip behavior. Click OK.
    The Create New Symbol dialog box.
  4. Click in the Timeline on frame 30 and insert a keyframe, select Insert > Keyframe [F6].
  5. Click on the keyframe in frame 1 and re-position your name to the bottom-left corner. (This will be the initial position. From the Timelines Zoom drop-down list, choose Show Frame).
    Placement on the Stage.
  6. While the first keyframe is selected, pick Motion from the Tween drop-down list in the Properties panel.
    The Properties Inspector Motion is selected.
  7. Click on the keyframe in frame 30 so you can edit the end position.
  8. Select the Transform tool and use Scale to scale the text large enough to occupy the entire stage. (You may need to position it closer to the center).
    The Transform tool on the tool bar.arrowTransform shown on Stage and the Timeline.
  9. Scrub red current frame marker or hit the [Enter] key to get an idea of how the tween looks.
  10. NOTE: From this point forward, remember that you'll only be able to edit with the Properties panel when either the beginning or ending keyframe is selected, not between—that's where Flash is responsible for the tweening.
  11. Move the red current frame marker to frame 30, and modify the color effect.
  12.  Select the instance of myName from the Properties panel and select Tint from the Color styles drop-down list. Pick a bright color and set the percentage to 100%. Scrub for a quick preview.
    Properties Inspector for Tint
  13. Rotate shown on the Stage. Go to frame 1 and with the Transform tool stretch your name really tall. (You may need to adjust the position.)
  14. While still in frame 1, use the Rotate option to rotate your name counterclockwise just a few degrees.
  15. Skew your name while the Transform tool is still selected. (The corner handles rotate and the middle handles skew).
  16. Check your animation by scrubbing or testing the movie. You created two very different keyframes, and Flash figured out how to animate from one to the other.
  17. REMEMBER: That keyframes establish when something should be onstage and where it will remain until another keyframe comes along. Also, be aware of the differences between the Key Frames and the Tweens Flash created for you; the Tweens have an arrow on top of the frames.

 

Back to Top