Flash Explained

Learn Flash easily.

Shape Tween Animation

October 10th, 2008 | Author: Luka | Category: Animation


Maybe you want to learn:

Shape tween animation is used much less frequently than motion tween animation, but it offers the one possibility motion tween hasn’t got – for objects to change shape, to deform them, to make transitions from one shape to another.

1 Open a new Flash document. Select the Oval Tool (O) from the Tools panel. If you are working in Flash 8, turn the Object Drawing option off – the icon on the left in the options panel (see image below).

The Object Drawing option turned off.

2 Draw a circle on stage by clicking and draging while holding the SHIFT key.

A circle drawn on stage.

3 Right-click on, let’s say, frame 30 in the timeline and select the Insert Keyframe option. You will notice that the circle is now selected on stage. Click anywhere on stage outside the circle to unselect it.

4 Using the Selection Tool (V) deform the circle. You can do that by placing the mouse near the circle’s border and when a small arc appears beneath the cursor, it means you can start deforming it.

Positioning the mouse near the circle's border.

Click and drag and you will see it. You can drag both outwards and inwards.

The circle deformed inwards. The circle deformed outwards.

5 Click on any frame between the two keyframes in the timeline, or the first keyframe. Don’t click on the second one, because we must animate our segment from the first keyframe to the second one. Not from the second one, because there isn’t any animation after it.

Selecting a frame on the timeline.

6 Now go to the Properties panel below the scene and from the Tween menu select Shape.

Choosing a type of animation.

You should see an arrow on light-green background appear on the timeline, between the two keyframes.

The timeline showing the shape tween animation.

7 Test your movie by choosing Control > Test Movie or pressing CTRL+ENTER (Command+ENTER for Mac). You should see your tween 🙂

Comments

Submit a comment

  • HeatoN Christenson Jun 16, 2009 at 9:32 am

    Nice tutorial, albeit a bit simple. Perhaps you should expand on it and make it a little more diverse. Other than that nicely explained.

You must log in to post a comment.