Flash Animation Tweening 1
Stephen Lewis
Trinity School
In this lesson you make Flash timeline animations.
Run Flash and make sure you have these windows open: Timeline, Tools, Properties
Choose the circle tool and draw a circle at the left side of the white drawing area
Click just below Frame 25 in the timeline to highlight frame 25 which will appear as a small blue rectangle
From the top menu choose Insert/ Keyframe. The blue box under frame 25 should then have a black dot in it
Click the black arrow tool from the Tools Menu. Your circle and its outline should be highlighted.
Drag your circle (both the colored interior and the outline) to the right side of the drawing area
Click once in the gray rectangle under the numbers 1 to 25 in the Timeline window
Go to the Properties window and choose Shape from the Tween pull down menu. Do NOT choose "motion". You should now see an arrow in the timeline window going from frame 1 to frame 24 and the background of the long thin rectangle should become pale green.
Press Control/Enter to run your tween. Stop it from running by clicking the black X in the upper right corner. Try dragging the reddish rectangle in the timeline box from side to side. You should see the circle go through the entire movement from its start point in frame 1 to its endpoint in frame 25.
Flash is automatically calculating the intermediate points in your animation. You just draw the start and end images. However, you can ONLY change images that are "keyframes". You can convert any intermediate frame to a keyframe by clicking under its number and choosing Insert/Keyframe. Try it. Click an intermediate frame, Insert/Keyframe, then move the highlighted object in the drawing area.
Now click on the little box under Frame 25 to set the circle to its end point position and highlight it.
From the Tools menu, choose the little square with the dot in the center, which is the free transform tool
Now change your circle by dragging the midpoint "handles" of the rectangle around your circle. You can make the circle distort.
Press Control/Enter again to see your new tween animation
You may keep adding new Keyframes along the timeline and changing the circle—its shape, fill color, etc. for each of those tweens.
To add more objects to your animation, you must create new layers and put each object that you want to tween on its own layer. You can NOT animate multiple objects in the same layer.
You can also completely change the drawing in any keyframe. Click on the box under Frame 25. It should highlight your circle. Hit the delete key. Use the brush tool to create a small squiggle. Run the program. Your circle should morph into a squiggle.
To extend your animation, just click in a frame farther down the timeline. Click in frame 50, for example, then choose Insert/Keyframe. If you have multiple layers, you may need to extend each of them as far as your longest timeline for any of your layers.
Make a really cool, artistic and intelligent animation, save it, publish it and send me the .swf file.
You can change how fast the animation runs by right clicking on the drawing area. In the menu choose "document properties" and then adjust the Frame Rate. It's in frames per second. The maximum rate is about 30 frames per second.