Free Flash Tutorials	Home • Food • Mates • Members • Tutorials • Forum • Buy Templates • Contact Us

Flash Tutorial MX: Animation - Tweening

002 Absolute Beginners
Flash Compatibility: MX     For Flash 8 click here      For Flash MX 2004 click here

Written by: Phil

Length: 800 words

This tutorial is designed for people who have little or NO Experience of using Flash. The aim of the tutorial is to:

Show you how to create a simple animation with a technique called Tweening.

My Example: Download the Flash file  Beg 002a

Example of Flash shockwave movie with a Tweened animation.

More Examples: To view additional examples of the type of animation that you will learn to do in this tutorial: Motion Tween Animations

Step One: Creating a symbol

In Flash whenever you use an object more than once you create a symbol. This saves on download time as the symbol downloads once. Even though you may use it many times the original symbol is simply repeated as many times as you use it without repetitive downloads. In Flash when you animate with a technique called tweening you must use a symbol. Tweened animation only use symbols.

1. Go to: Insert > New Symbol
2. In the dialog box give your symbol a name
3. Select Graphic as the behavior.
4. Click OK.

This gives you a work area to create your symbol. This is not the Main Stage.

5. Create your new symbol in this work area.
   

   You can type a word or draw something simple. As long as you have something to animate.

Step Two: Placing your symbol on the main stage

Above the work area where you created your symbol are two tabs. One of them will have the name of your new symbol, the other will say Scene 1. Scene 1 is the main stage.

1. Click on the Scene 1 Tab. You will return to the main stage, which should be empty. Don't panic you haven't lost your symbol.Click on: Window > Library. Your symbol should be in the library.
2. Drag your symbol onto the main stage.

Step Three: Animating your symbol

1. Go to frame ten on the time line and right click. Select Insert Keyframe. This copy and pastes whatever is in frame 1 into frame 10.Move the copied symbol on frame 10 to a new position on the stage. This will not move the symbol on frame 1.
2. Right click in the time line in-between the two Keyframe (The frame with the black dots in them). Select Create Motion tween.

Step Four: Test your animation

If your tween is correct your time line should have a arrow between the two key frames.

1. Click on frame one two place your play head back at the beginning of the movie.
2. Press Enter on the keyboard to test your animation.

Step Five: Extending your tween

1. Right click on frame 20 and choose Insert Keyframe.Move the new instance of the symbol to a new position.
2. Right click in-between frame 10 and 20 and select Create Motion Tween.

Continue to repeat this every time you want the symbol in a new position.

Extending or reducing the Tween

To slow the animation down click in between the any two key frames and press F5 on your keyboard. This will extend the length of the tween. Do the same but use Shift F5 to delete frames in the tween, which speeds the animation up.

Free Transformation Tool

Try changing the size of the symbol with the Free Transformation Tool. To do this click on your symbols with the Free Transformation tool and drag one of the little square handles. You can also rotate and shear a symbol with this tool.

panels

Some of the panels found in the: Window menu: Info, Transform and Property panels.You can use the Info panel, Transform panel and the Properties to change a variety of the instance of the symbol on stage. You can open the panels in the: Window menu. Remember you must have the symbol selected to use these panels.

Info

Width, height and X Y axis (position on the stage).

Transform

Width, height, rotation and skew.

Properties

Width, height and X Y axis (position on the stage).In the Property panel look under the Color drop down menu and try changing:

1. Tint: This will effect the colour of the symbol.
2. Alpha: This will effect the transparency of the symbol.

Remember to keep testing your work: Control> Test Movie