- Getting started
- About animation
- Understanding the project file
- Animating position
- Changing the pacing and timing
- Animating transparency
- Animating filters
- Animating transformations
- Editing multiple frames
- Changing the path of the motion
- Swapping tween targets
- Creating nested animations
- Easing
- Frame-by-frame animation
- Animating 3D motion
- Exporting your final movie
- Review questions
- Review answers
This chapter is from the book
This chapter is from the book
This chapter is from the book
Easing
Easing refers to the way in which a motion tween proceeds. You can think of easing for changes in position as acceleration or deceleration. An object that moves from one side of the Stage to the other side can start off slowly, build up speed, and then stop suddenly. Or the object can start off quickly and then gradually slow to a halt. Your keyframes indicate the beginning and end points of the motion, but the easing determines how your object gets from one keyframe to the next.
A simple way to apply easing to a motion tween is to use the Properties panel. Easing values range from −100 to 100. A negative value creates a more gradual change from the starting position (known as an ease-in). A positive value creates a gradual slowdown (known as an ease-out).
A more advanced way of applying eases to a motion tween is to use the Motion Editor, which you’ll learn about in the next lesson.
Splitting a motion tween
Easing affects the entire span of a motion tween. If you want the easing to affect only frames between keyframes of a longer motion tween, you should split the motion tween. For example, return to the 03_workingcopy.fla file of the cinematic animation. The motion tween of the car in the Left_car layer begins at frame 75 and ends at frame 191, at the very end of the timeline. However, the actual movement of the car starts at frame 75 and ends at frame 100. You’ll split the motion tween so that you can apply an ease to the tween just from frame 75 to frame 100.
In the Left_car layer, select frame 101, which is the frame just after the second keyframe, where the car ends its movement.
Right-click frame 101 and choose Split Motion.
The motion tween is cut into two separate tween spans. The end of the first tween is identical to the beginning of the second tween.
In the Middle_car layer, select frame 94, right-click, and choose Split Motion to cut the motion tween into two separate tween spans.
In the Right_car layer, select frame 107, right-click, and choose Split Motion to cut the motion tween into two spans.
The motion tweens of all three cars have now been split.
)
)
)
)
Applying eases to motion tweens
You’ll apply an ease-in to the motion tweens of the approaching cars to give them a sense of weight and to make them decelerate, as real cars would.
In the Middle_car layer, select any frame between the first and second keyframes of the first motion tween (frame 70 to frame 93).
In the Tweening section of the Properties panel, enter 100 for the Ease value.
This applies an ease-out to the motion tween.
In the Left_car layer, select any frame between the first and second keyframes of the first motion tween (frame 75 to frame 100).
In the Properties panel, enter 100 for the Ease value to apply an ease-out to the motion tween.
In the Right_car layer, select any frame between the first and second keyframes of the first motion tween (frame 78 to frame 106).
In the Properties panel, enter 100 for the Ease value to apply an ease-out to the motion tween.
Select Loop at the top of the Timeline panel and move the start and end markers in the timeline header to frames 60 and 115, respectively.
Click Play (Return/Enter).
Animate plays the timeline in a loop between frames 60 and 115 so that you can examine the ease-out motion of the three cars. The three cars slow down as they approach their final keyframes, giving them a sense of weight and realism.
)
)
)