- 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
Animating transformations
Now you’ll learn how to animate changes in scale or rotation. These kinds of changes are made with the Free Transform tool or with the Transform panel. You’ll add a third car to the project. The car will start small and then become larger as it appears to move forward toward the viewer.
Lock all the layers on the timeline.
Insert a new layer inside the cars folder, and rename it Left_car.
Select frame 75 and insert a new keyframe (F6 or Insert Keyframe button).
Drag the movie clip symbol called carLeft from the Library panel to the Stage at frame 75.
Select the Free Transform tool.
The transformation handles appear around the instance on the Stage.
While holding down the Shift key, drag a corner handle inward to make the car smaller.
In the Properties panel, make sure that the width of the graphic is about 400 pixels.
Alternatively, you can use the Transform panel (Window > Transform) and change the scale of the car to about 29.4%.
Move the car to its starting position at about X=710 and Y=488.
In the Properties panel, in the Color Effects section, choose Alpha from the Style menu.
Set the Alpha value to 0%.
The car becomes totally transparent.
Choose Create Motion Tween from the button above the timeline.
The current layer becomes a tween layer.
Move the playhead to frame 100.
Make sure the transparent instance of the car on the Stage is selected, and in the Properties panel, change the Alpha value to 100%.
A new keyframe is automatically inserted at frame 100 to indicate the change in transparency.
While holding down the Shift key, drag a corner handle outward to make the car larger. For more precision, use the Properties panel and set the dimensions of the car to width=1380 pixels and height=445.05 pixels.
Position the car at X=607 and Y=545.
You have used Animate to tween the change in position and the change in scale as well as the change in transparency from frame 75 to frame 100.
Move the Left_car layer in between the Middle_car and Right_car layers so that the car in the center overlaps the cars on the side.
Save your progress so far in this document, 03_workingcopy.fla.
)
)
)
)
)
)