Flash 101 (part 3): Bouncing Around - Bouncing Balls
(Page 6 of 9 )

Motion tweening is a great way to create animation clips that look good and are simple to put together - as this next example demonstrates.



How did I do this? Very simple.

First, draw a circle on the Stage and fill it with a gradient fill - I've used blue, but feel free to experiment - to create a smooth bouncing ball. Convert it to a graphic symbol - you'll be using this symbol throughout the exercise.



Next, select frame #7, insert a new keyframe, and move the ball vertically downwards. Use the scaling handles to flatten it vertically and stretch it horizontally, so that it looks like it's been squashed.



Go back to frame #1 and create a motion tween between the two keyframes (you can also do this by right-clicking anywhere between the two keyframes and selecting the "Create Motion Tween" command)

Now, move on to frame #14, insert a new keyframe, and move the ball back up to its original location. Pop open the Transform panel, and use the Reset button (bottom right corner) to restore the symbol to its original state. Insert a motion tween between frame #7 and frame #14.



When you play your clip, you'll see something like this:



If you think the clip would look better if it played a little faster, you can alter the frame rate through the Modify -> Movie dialog.



There are just a couple more steps to this animation. First, select frame #7 (the flattened ball) and move the symbol about 100 pixels to the left. Do the same with frame #14, the final keyframe, except that the symbol should be moved to the right When you play the clip, the ball will appear to bounce across the screen.



And finally, the fade-in/fade-out effect. Select the ball in the first frame, and use the Effects panel to add an alpha effect, so that the ball is partially transparent. Do the same for the final keyframe.This time, when you play the clip back, the ball will slowly solidify as it moves downwards, and fade out as it bounces upwards.



How long did that take? About five minutes, I'd say - and the result is a pretty good-looking animation clip. Plus, since the entire clip is built using a symbol, you can easily alter the colour and size of the ball in symbol-editing mode, and have your changes immediately reflected in the clip itself. Try it yourself and you'll see what I mean!

This article copyright Melonfire 2000. All rights reserved.

Next: Zooming In >>
 

More Flash Articles
More By icarus, (c) Melonfire

Comments On: Flash 101 (part 3): Bouncing Around

>>> Be the FIRST to comment on this article!