Creating motion and animation in Flash.

Hey, Call Me for a Class,
415-839-0096

The part you’ve all been waiting for. How to make objects move across the stage. This is called tweening. What does tweening mean? Let’s talk about it and explain the history and the process.

When Disney animated, they used frame by frame animation. Here how it would work. We need to understand the term “frame rate.”

1. When you go to the movies, movies have 24 frames per second (fps). Thomas Edison discovered that if you flip images at 24 per second, it creates   the illusion of smooth motion.

2. When you watch video in America, it runs at 29.97 fps

3. When you watch video in Europe, it runs at 25 fps.

4. Charlie Chaplin movies of old ran at 18 fps. Not quite 24, thus he looks jerky when
he walks.

Ok, that is Frame Rate. So, Imagine making an animated cartoon and Mickey Mouse is going to throw a baseball. That takes about 2 seconds. At 24 frames per second, that means that someone has to draw 48 pictures.

Now we introduce the Concept of KeyFrames.

In Flash, one of the most important concepts is KeyFrames. For something to exist in Flash, there must be a keyFrame. Whenever there is change in Flash, there is a KeyFrame.   We’ll talk about this more in a minute.

Mickey is starting to throw the baseball. If this were 50 years ago, we would draw Mickey, starting to throw the baseball in frame one. This would be called a keyFrame, and it would be drawn by a KeyFrame Artist. KeyFrame Artist would draw the important frames. In this Case, the would draw frame 1,,the beginning of the action, and frame 48,,,the end of the action, in this case the drawing of Mickey at the end of the throw.

Now, we need to draw each and every arm movement from frame 2 to 47. The KeyFrame Artist is done, now, the Inbetweener artist take over, they draw all of the pictures between frame 1 and 48. It’s a tough job and the money isn’t that great.

That is where the term tweening came from.

Some people think that you only tween motion. That means you make an object go from one place to another. But you can tween, or better put, animate over time, many things. Here is a list of attributes of objects that you can tween.

1. Motion
2. Scale (the size of an object)
3. Rotation
4. Opacity
5. Color

And, you can do all of that to one object at the same time.

Let’s go through, what I call, the five steps of tweening.
1. Create a Symbol to tween.

2. Go down the road in time and insert a KeyFrame (go....Insert>KeyFrame)

3. Move or change the object

4. Select both of the KeyFrames associated with the object.
If you click on the Layer Name, in this case, that will select both keyFrames and the frames in between.

5. Go to the Insert Drop down menu and select, “Create Motion Tween.”
On the other hand, when you click on the layer name, the frames in that
layer turn black. Right click in the blackness between the selected KeyFrames and the first option from that dropdown menu is, “Create Motion Tween.”

6. After you follow these steps, it the enter, or return key to see your animation.

(you might have to click the play button above)

You know you are successful if you see an arrow going through your layer between your keyframes. You know you messed up if you see a dashed line.

Try it. It should work. I figure it takes about 30 to 50 tweens on your part before you become a good tweener. Go ahead, tween your brains out. Have fun and become an expert at it.

Tweening Multiple Objects at the same time.

If you want to have many objects moving around the screen at the same time, you would have to put each object in it’s own layer. If you put any object in a layer that is tweening, it breaks the tween and the tween will not work.