4. Creating a Simple Motion Tween

Within a Flash movie, animation is stored as a sequence of frames called a timeline. Frames appear sequentially when an animation plays; however, not all frames need to have contents defined. Through a process called tweening, Flash uses a few specially defined frames called keyframes to interpolate the intermediate frames.

The steps below walk you through creating a simple right-to-left motion tween. Just for fun, we'll animate a movie clip (the flying macaw from Lesson 3) rather than a static graphic symbol.

  1. Drag the symbol you want to animate onto the frame where animation should begin, in this case Frame 1. A black dot [•] labels the frame as a keyframe with its own content defined.


  2. Click on the frame where you want the animation to end. Then choose Insert: Keyframe from the main menu. This creates a second, identical keyframe on the end frame, in this case Frame 60. At 12 frames per second, this will generate a 5-second animation.


  3. At the final frame, drag the symbol from the left side of the Stage to the extreme right of the window, beyond the edge of the Stage. This will make it look like it's moving off-screen.


  4. Go back to the starting frame. Open the Frame panel. For Tweening, select Motion. An arrow with a blue background now appears between Frames 1 and 60.


  5. You've created your motion tween! To see the finished product, click here. In Flash, you can press F12 to preview the results.