Creating Basic Tween Examples in Flash CS5

Create a new Flash document. Follow the steps below to add different kinds of tweens to your Flash movie.

By the end of this tutorial, you should have something like this: [DEMO PAGE]

Movement - Classic Tween

1. Draw a circle on the upper-left corner of the stage using the oval tool. 
2. Select the whole shape using the selection tool, and then convert it into a graphic symbol named Circle.
3. On the timeline, right-click on the frame 40 box and choose Insert Keyframe.
4. Make sure you are still on frame 40 by clicking on the keyframe that you just added. 
5. Then use the selection tool to move the circle to the upper-right corner of the stage.
6. On the timeline, right-click anywhere between frames 1 and 40 and choose Create Classic Tween.
7. Press ctrl + enter (PC) or cmd + return (Mac) to test your movie.
8. Save your work.

Scaling Animation - Classic Tween

1. Insert a new layer.
2. Make sure you are on frame 1 of this second layer by clicking on the blank keyframe on frame 1.
3. Use the rectangle tool to draw a square shape in the middle of the stage.
4. Select the whole shape using the selection tool, and convert it into a graphic symbol named Square.
5. On the timeline (layer 2), select frame 40 by clicking on it. Make sure that no other frames are highlighted except for frame 40 of layer 2.
6. Once it's selected, right-click on it and choose Insert Keyframe.
7. Make sure sure you are still on frame 40 of the second layer by clicking on the keyframe that you just added.
8. Then on the stage, right-click on the square and choose Free Transform. 
9. Make the square bigger by clicking on any of the corner handles and dragging outward.
10. On the timeline (layer 2), right-click anywhere between frames 1 and 40 and choose Create Classic Tween.
11. Press ctrl + enter (PC) or cmd + return (Mac) to test your movie.
12. Save your work.

Color Changing Effect - Classic Tween

1. Insert a new layer (this will be the 3rd layer).
2. Make sure you are on frame 1 of this third layer by clicking on the blank keyframe on frame 1.
3. From the library, add another instance of the Circle symbol and place it on the lower-left corner of the stage.
4. On the timeline (layer 3), select frame 40 by clicking on it. Make sure that no other frames are highlighted except for frame 40 of layer 3.
5. Once it's selected, right-click on it and choose Insert Keyframe.
6. Make sure sure you are still on frame 40 of this third layer by clicking on the keyframe that you just added.
7. Then select this new instance of the circle symbol on the stage by clicking on it using the selection tool. Do this even if the instance already looks selected just to make sure that it's really selected. Make you sure you only click on it <b>ONCE</b>. Do <b>NOT</b> double-click on it. If you double-click on it, you will enter the symbol's timeline.
8. After selecting the instance, go to the Properties Inspector. If you don’t see the Properties Inspector, choose Window > Properties.
9. You should see the properties of the selected graphic instance in the Properties Inspector. Under Color Effect, click on the Style drop-down menu and choose Tint.
10. Click on the tint color box and choose a new color for the instance. Make sure that the tint amount slider below the drop-down menu is at 100%.
11. On the timeline (layer 3), right-click anywhere between frames 1 and 40 and choose Create Classic Tween.
12. Press ctrl + enter (PC) or cmd + return (Mac) to test your movie.
13. Save your work.

Morphing Effect - Shape Tween

1. Insert a new layer (this will be the 4th layer).
2. Make sure you are on frame 1 of this fourth layer by clicking on the blank keyframe on frame 1.
3. Draw a circle on the lower-right corner of your Stage. DO NOT CONVERT IT INTO A SYMBOL. We are going to add a shape tween, and it will not work if you convert the shape into a symbol.
4. On the timeline (layer 4), select frame 40 by clicking on it. Make sure that no other frames are highlighted except for frame 40 of layer 4. 
5. Once frame 40 of layer 4 is selected, right-click on the frame and choose Insert BLANK Keyframe. You should see the circle disappear.
6. Make sure sure you are still on frame 40 of this fourth layer by clicking on the BLANK keyframe that you just added.
7. Then switch to the rectangle tool and draw a square shape on the same spot that the circle was on.
8. On the timeline (layer 4), right-click anywhere between frames 1 and 40 and choose Create Shape Tween.
9. Press ctrl + enter (PC) or cmd + return (Mac) to test your movie.
10. Save your work.