“Motion tweens”

The next tween that I want to talk about is the “Motion Tween”.
What is a “Motion Tween”?
It is the change of one or more property values of an object between two main frames.
For example, a car that runs from left to right, which is the positional property, or color of a square changing from red to green, the color effect property or two things together, eg, a circle which moves from top to bottom with change of color.

What objects can we use with a “Motion Tween”?
Everything. As long as you get only a symbol of it, it does not matter which symbol, “Movie clip symbol”, “Button symbol”, “Graphic symbol” of your choice.

What do we need to make a “Motion Tween”?
A symbol, a starting “Keyframe” where this symbol is placed and an end frame.

 

Add “Motion Tween”

In the example below I used a drawing made by my daughter several years ago. A car surrounded by a “beautiful” landscape.
All parts of this beautiful landscape are in the “environment” layer folder and the car.

The car is a “Movie clip symbol” (car) that consists of three layers, you have a layer for the body, you have a layer for the left wheel and you have a layer for the right wheel.

All three of these layers have a “Graphic symbol”, in particular wheel or a vehicle body.

The first thing we do is, add a motion to determine the time of the tween, in this case the car that runs from right to left across the “Stage”. I want this to happen in 3 seconds for which I add a frame in frame 72 of the “car” layer.

How I got that 72 is that the “Flash” Movie is set to 24fps, which means 24 frames per second. When this car whizzes across the screen in three seconds, it needs 3 times 24 frames, so thats 72 frames. Right? Right!

The same goes for the rest of the layers in the “environment” layer folder.

We’re almost there.
First place the car to the right, on the “Stage”.

Place the play button in frame 72.

Right-click the “car” layer and select “Motion tween” in the drop-down menu.
The layer, in this case the “car” layer to which you added a “Motion Tween” gets a blue background.

With the play button still in frame 72 drag the car to the left across the “Stage”.

Test the movie. (Ctrl + Enter)

The car runs from right to left, or rather slides from right to left, the wheels are not turning yet.

Now we open the “car” “Movie clip symbol”.

Add 20 frames to each layer (F5).

Right-click the first layer which is “right wheel” and select “Create Motion Tween” from the drop-down menu.

In the properties dialog, select the option “Rotate”, set it to 1, for the “Direction” give “CW” i.e Clockwise or right to left.

We do the same for the “left wheel” layer.

Click “Ctrl + Enter” on your keyboard to test the movie.

 

Featured Courses

• Downloading iPad Apps
• Lesson 1: Introduction to Publisher
• Lesson 65: File Formats