Flash animation course - motion tweening in flash - flash motion tweening animation - course in motion tweening of macromedia flash
flash animation course, motion tweening in flash, flash motion tweening animation, course in motion tweening of macromedia flash
Flash Animation Course - Motion tweeningGo to Flash Animation Course - Motion tweeningAdvanced Flash tutorialGo to advanced Flash tutorialWeb development tutorialsGo to web development tutorialsHomepage

Flash Animation Course - Motion tweening

One of the basic animation techniques is moving an object from one location to another. This is accomplished in Flash by applying a Motion Tween between the start and the end frames.

Step 1
Open a new file. You'll notice that this movie has only one layer called Layer 1. It is always a good practice to put descriptive names of your choosing for the layers in a Flash file. To rename Layer 1, double click on its name and then type the new name, something like "Motion Tween".
Renaming Layers in Flash

Step 2
Our stage is set and it is now time to create an object.
Hightlight the first frame in the Time line and using the Oval Tool Flash Oval Tool and draw a circle somewhere on the stage.

Step 3
To animated this circle so that it moves from one place to another, we have to convert it into a Symbol.
Click on the Arrow tool Flash Arrow tool and select the circle you have just drawn. (The previous tutorial explains how to select objects using the Arrow tool). Flash places a sort of 'net' over selected objects. The image below shows what a selected and an unselected circle looks like.
Selected and unselected objects
Now click on Insert - Convert to Symbol. The Symbol Properties window pops up. In the name text field type "Ball" which is the name for our symbol and also make sure that the Behavior is set to Graphic (that is the default value). Click OK to convert the circle into a symbol.
Converting a circle to a symbolSymbol properties window

Step 4
If the Symbol Library is not open, click Window - Library to display the library in which you will find your newly created symbol, "Ball". Click on its name to view the a thumbnail of the object.

Step 5
Place the circle (which is now a symbol) somewhere near the top-left corner of the stage.
Now right-click frame number 36 in the time line and select Insert Keyframe
Adding a key frame This adds a key frame at frame 36. With this frame selected, move the circle symbol and place it near the top-right corner of the stage. Thus, the circle is placed at its staring point (top-left) in frame 1 and at its ending point (top-right) in frame 36. We are all set to apply the animation.

Step 6
The last step is creating a Motion Tween between frame 1 and frame 36.
Right-click at any frame between 1 and 36, and from the drop down menu select Create Motion Tween
Creating a motion tween
With the motion tween applied between frames 1 and 36, the layer should look something like:
Final - Motion Tween
To see how it works, click on Control - Rewind and then Control - Play.
Click on the button below to see is what I made:

Click to view Flash animation tutorial motion tween result




Back to Introduction Next


AddThis Social Bookmark Button
Page contents: Flash animation course - motion tweening in flash - flash motion tweening animation - course in motion tweening of macromedia flash

Page URL: http://www.webdevelopersnotes.com/tutorials/adflash/ flash_animation_course_motion_tweening.php3



Join Mailing List


Feedback/Questions




50+ web hosting FAQs

Search engine for your website

Free software from Google - The Google Pack Collection

Create your own search engine
Search WebDevelopersNotes.com