|
|
|
Creating Motion Tween in Flash
Author: Saumitra | Email
Advertisement
The Flash tweening is the most interesting part of Flash. It directly influences the way animation is done. Consider that you have to create an animated ball on the timeline that moves from one point to another in about 5 seconds.
There are several ways to do it. By using either "key frame" based animation or actionscript and by using motion tweening.
In the key frame based animation the first and the last key frames will represent the initial and the final state of the animation. And the intermediate key frames will represent the intermediate positions. This method is used only in case of representing very complex animations, which cannot be easily achieved using tween. For example, a dancing couple can be represented with a set of images in various positions to complete initial to final state. Although this makes the files heavy and appears jerky, this can help create scintillating 2D animations.
Actionscript can be used as well for animations and dynamically controlling various aspects of a movie clip. This method is used when it is important to have control over various movie clips and their properties in the Flash file. For example, an animated analog clock or lip-sync animation where lips need to move randomly and stop when there is no audio. Very smooth animation can be created since no actual "frames" are involved in this.
Finally, the "tweening" method is also one of the important and interesting ways to create 2D animations.
This method is extensively used in creating short movies, animated e-learning courseware and CD based presentations.
So what exactly is Tweening?
Tweening has been derived from the word "be-tween" or rather "in between". It works on the principle that the designer just has to create the first and last key frame of the animation and the "in between" part is managed by Flash.
As a practical example refer to the files available with this tutorial. The main timeline is seen with the ball in the first key frame at position 1. The last key frame represents the ball at the same position. We will soon see when to move the ball to its final position.
To create a tween first create the first and last frames. Further, select all the frames on the timeline, right click, and choose "create motion tween"
This will change the color of the frames from grey to blue. Also, an arrow will appear directing from left key frame to the right key frame.
Please see Fig 1.1 below that represents the above steps:
Fig 1.1
This creates the animation with the ball at the same position at both points. Image below Fig 1.2 shows how the ball the tween looks like.
Fig 1.2
Also notice that the library now contains two tween element Tween1 and Tween2. This adds to the file size of the file. This can be avoided by first creating a symbol "ball" instead of directly using the Flash shape. (That is the usual way to create a tween though ignored occasionally creating file size issues at a later stage)
Moving forward, select the symbol on the last frame and place it another location. All done!
Press "Ctrl + Enter" to test your movie. Wow!! The ball does move from point 1 to 2 and it is so smooth (see image below)
Thanks to (be)tweening that automatically manages the position of the ball without the need to crating the intermediate key frames.
The motion tween does not have to be a two frame animation. To add new key frames just select the frame number and press F6.
Pressing F6 in case the selected frame is within an existing "tween" does not affect the animation until any change is done at that key frame.
To delete the frames, you can select the frames to delete and use "shift + F5" as the shortcut.
Once created, the tweens internal frames(between first and last frame) cannot be modified. Only the end positions are editable and that too as the first and last tween or the single symbol if appropriately created before tweening.
The motion tween layer should be considered "dead" This is because it does not allow any other elements to be added to it on the root. Whatever has to be added can only be added to the tweens.
In case, you need to reverse the tweens in direction, you should manually do it. There is an option called "Reverse Frame" that is available in the Right Click menu when a tween sequence is selected. Do NOT use it as it only swaps the first and last frames and kills the tweening.
You may as well try the following with the motion tween:
a. Change the size (width, height, skewing) of the ball in the last frame
b. Change the alpha of the ball in the last frame
c. Change the rotation of the ball in the last frame.
Other interesting type of tween is the shape tween in which case the shape of the object itself can be changed to another shape.
Also the above example creates a linear animation, that is, a straight-line animation from 1 point to another. To create a path based animation, we need to use motion "guides" discussing which is beyond the scope of the tutorial here.
Download Source File
We hope the information helped you. If you have any questions
or comments, please don't hesitate to post them on the
Forums section
Submit your Tutorial at Click Here
|
|
|
