Flash Tutorial: Car Tutorial|1

Noving Cai Tutoiial

1. Open Macromedia Flash 8.
2. Create a New Flash Document.


3. You will need an image of the top view of a car for this tutorial. Make sure that the background of
the picture is transparent. Chooseeither PNG OR GIF format. Go to FileMenu, Import and click
Import to Library.



4. A window will show up for you to browse the picture you want to use as background.


5. Click on the Oval Tool [O]. On its color properties, use the #999999 color for both the Fill and Stroke.
It is on the 4
th
row of the 2
nd
column.
Flash Tutorial: Car Tutorial|2





6. While holding the Shift Key draw the circle on the stage. The reason why you hold Shift key is that it
maintains the proportion of the oval making it a perfect circle. Your stage should already look like
this.


7. Return to the properties of the Oval Tool [O]. Change the stroke and fill color to WHITE or
#FFFFFF.On the Options Panel, make sure that the Object Drawing [J] is selected. This will the oval
to be drawn is separated from the gray circle.



8. While holding the Shift Key draw the circle inside the gray circle. Your stage should look like this.


9. Use the Selection Tool or the Transform Tool to make it fit in the center of the circle. You should
create something like below. This will serve as the road where your car will move.


Object
Drawing
Option
Flash Tutorial: Car Tutorial|3




10. Add a new Layer and on that layer, insert the Car you imported in step 3 & 4.



11. On both layer 1 and 2, create a Key Frame on Frame 60 by pressing F6. Lock Layer 1. Then, on
frames 15, 45 and 60 in Layer 2, also add Key Frame. Your timeline should look like this.



12. In Layer 2 add motion tween between frames 1&15, 15 & 30, 30 & 45 and 45 & 60. To do this, just
right-click any frame between the given intervals, right-click, then select Add Motion Tween. You
timeline should look like this.



13. On Frame 15 of layer 2[CAR LAYER], move the car to this position shown on the image below. The
car was rotated counter-clock-wise by 90 degrees.



Flash Tutorial: Car Tutorial|4

14. On Frame 30 of layer 2[CAR LAYER], move the car to this position shown on the image below. The
car was rotated counter-clock-wise by 180 degrees.


15. On Frame 45 of layer 2[CAR LAYER], move the car to this position shown on the image below. The
car was rotated counter-clock-wise by 270 degrees.



16. AddMotion Guide to Layer 2[CAR LAYER] by clicking second button next to right of the Add New
Layer button. Timeline should look like this.



17. Select the Oval Tool [O]. On the Colors, BLACK for the stroke color and NONE for the fill color.


18. On the Guide of Layer 2, draw a circle. Use the transformation. Use the Transform Tool to adjust
the circle and make the stage look like this.

Flash Tutorial: Car Tutorial|5

19. Back to Layer 2 [Car Layer] ,Frame 1, click the Car. Make sure the small circle in the center of the car
is aligned with the black line from the Guide Layer.


20. Do the same thing on Frame 15, 30, 45 and 60.

FRAME 15 FRAME 30


FRAME 45 FRAME 60


21. And now youre done. Ctrl +Enter to preview what you did.