Page 1 of 1

Motion and Shape Tweening Learning to use Motion and Shape Tween Rate Topic: ***-- 1 Votes

#1 gbertoli3  Icon User is offline

  • DIC at Heart + Code
  • member icon

Reputation: 40
  • View blog
  • Posts: 1,162
  • Joined: 23-June 08

Posted 01 November 2008 - 01:09 PM

In this tutorial I will show you how to use the Motion and Shape Tween.

Motion Tween allows you to animate two or more keyframes by moving them.
Shape Tween allows you to animate two or more keyframes by morphing them.

Animation in Flash is one of the easiest things you can do. It only takes a couple of steps and a couple minutes of free time.

Motion Tween

Start by Creating a Round Object on your document.
Posted Image

After you have created your Object set it's Location to (0, 0)
Posted Image

Then go to Modify->Convert to Symbol...
Posted Image

Type in Ball for the Name and Graphic for the Type, Also make sure that the Registration is the Center Point.
Posted Image

Go to your Document's/Scene's Properties and find the Frame Rate. Make sure that it is set to 15 fps. That means 15 frames per second. Knowing this will come in hand with our animation.
Posted Image

Now that we have set our Frame Rate we need to add some frames to our timeline. Select frame30 then go to Insert->Timeline->Keyframe. We selected frame 30 because we want our animation to last for 2 seconds. Since our document will be projecting 15 frames per second, we need 30 frames per 2 seconds.
Posted Image

If frame 30 is not selected, select it now.
Posted Image

Now move the Symbol(Ball) to the Very Bottom of your Document(or anywhere else you would like)

Here comes the easiest part.
Select any frame between 1 and 30.
Posted Image

Then go to your Document's Properties and Set Tween to Motion.
Posted Image

Now if you look at your timeline you will see an arrow stretching from the first frame to the last.
Posted Image

You can now Preview your Animation in Flash or you can Preview it Outside of Flash. I always preview it inside of Flash. To Preview it Inside of Flash select the First Frame and Hit Enter or you can go to Control->Play. To Preview it Outside of Flash Select any Frame and Hit Ctrl+Enter(Control + Enter) or you can go to Control->Test Movie.

Shape Tween

I just Showed you how to use the Motion Tween to Animate a Ball, now I will Show you how to use the Shape Tween to Morph a Ball Into a Square.

Start off with Setting your Frame Rate to 15 frames per second.
Then Create a new Circle. Make sure you put it's Locatoin to (0, 0). Do NOT Convert it to a Symbol.

Select Frame 30 and Create a new Keyframe. You can do this multiple ways; Right Click(on the Frame)->Insert Keyframe, Insert->Timeline->Keyframe, and Select any Keyframe then Press F6.

Now that you have Created a new Keyframe on Frame 30 we can Create our new Shape.
Make sure that Frame 30 is Selected and Delete the Circle. After you have Deleted the Circle from Frame 30, Create a new Shape. Set it's Location to the Same Location where your Circle was. In this case (0, 0). I will be creating a Square with a Different Color. Do NOT Convert it to a Symbol.

Select any Frame between the First and Last. Then go to the Properties Panel and Set Tween to Shape. There should now be a Green Background on the Frames.
Posted Image

Now Preview the Animation/Morph.

You should now have a Circle Morphing into a Square.

Source Files: Attached File  MotionShapeTween.zip (9.59K)
Number of downloads: 817

Is This A Good Question/Topic? 0
  • +

Replies To: Motion and Shape Tweening

#2 1a11ous  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 23
  • Joined: 10-July 09

Posted 19 November 2009 - 09:16 AM

Nice and simple tutorial :)
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1