Email the Instructor

Upload a File

Flash 1 - Beginning

Class ends Sunday June 29, at 5pm

×

Drag your file here to upload it.

Motion paths

If you want something to move in a curved path instead of a straight line, you can bend the spline (a.k.a. motion path) of a motion tween:

The animation above contains only two keyframes of the rat: one at the beginning of the maze, and one at the end. The rat's movement is controlled with a motion path—a line that winds through the maze, connecting the center of the rat in keyframe 1 with the center of the rat in keyframe 50.

To create this animation:

  1. In a new Flash document, import the Maze illustration. (In this class you can ignore the Illustrator Import dialog; you'll need all layers of any Illustrator file I provide).
  2. Note the two new layers: Rat and Maze (to see what artwork is on each layer, click the name of the layer, and the artwork on it will be selected).
  3. Select the Rat artwork and Press F8 (convert to a Movie Clip named “Rat”)
  4. Select frame 1 of the Rat layer and choose INSERT > Motion Tween.
  5. Drag the right end of the tweened frames out to frame 50.
  6. Select frame 50 of the Maze layer and press F5 to insert a normal frame (since the maze is not moving, you do not insert a keyframe here—that would just make Flash have to export a duplicate drawing of the maze and cheese, adding to the file size).
  7. In frame 50 position the rat at the end of the maze, near the cheese.
  8. Since it's quite difficult to give a motion path more than a simple bend, you'll draw a completely new path to replace the motion path with: add a new layer and draw a line that winds through the maze. (Use the Pencil, not the Brush, and ensure the Pencil mode is set to "Smooth": look for the Mode option at the bottom of the Toolbox: )
  9. Select this entire line and copy it.
  10. Hide the layer you just drew the line on (click the dot under the Eye icon)
  11. Select the spline of the rat's motion guide and choose EDIT > Paste in Place to replace it with the copied path.
  12. Press RETURN to preview the motion.
  13. To make the rat face forward at all times, select any frame in the tween, and check the Orient To Path checkbox on the Properties panel.
  14. Press RETURN to preview, and save this file.

Pausing the action

Let's say you wanted the rat to hesitate at a certain point in the maze:

  1. In the file you just saved, move the playback head to the frame where you want the rat to pause.
  2. Select the property keyframe at that point.
  3. Choose MODIFY > Timeline > Split Motion (this breaks the tween into two seperate tweens without affecting the apparent movement of the Rat)
  4. Click in the blue area of the new (second) motion tween (the entire tween should highlight).
  5. Drag the second tween 12 frames farther down the timeline (be sure the entire range of frames is selected before dragging!).
  6. Select the blank keyframe at the end of the first motion tween, and press SHIFT-F6 to eliminate it (the frames that fill in the span between the two tweens will all be identical, leaving the rat where he was at the original split).
  7. Extend the Maze layer's timeline to last as long as the newly extended Rat layer now lasts (not necessary of you merely compressed the second tween in step 5, instead of moving it).

Controlling animation speed

Easing

 Easing is an option on the Properties panel when a tween is selected (see circled area to the right):

This number can be anywhere from -100 to +100. A positive easing makes the tweened change decelerate; a negative easing makes it accelerate. An easing of zero (the default) means a constant rate of change. An example of when you would apply easing is an animation of a ball being thrown into the air. The effect of gravity can be simulated by applying positive easing to the tween of the ball as it moves upward, and a negative easing to the tween of the ball moving downward. It's easy to apply a single easing value to a tween, but requires the Motion Editor to apply complex or multiple easing settings.

Adding/Subtracting Frames

The best way to control the speed of activity in a movie is to change the number of frames between keyframes. Using the above Rat-in-a-Maze example, if you wanted the rat to move slower through the maze, you should add frames in both motion tweens (while lowering the frame rate would accomplish that too, it would lower the quality of the animation, and slow everything else in the movie). To make the rat faster, subtract frames from the tweens. Add or subtract frames in a motion tween by dragging the right end of the blue shaded frames. Add frames elsewhere by highlighting regular frames and pressing F5 to add, or SHIFT-F5 to subtract (beware of subtracting keyframes—you usually want to keep the keyframes and only subtract regular frames in between!).