Motion Tween

Motion Tween

Flash CS4 Tutorial


How to Add a Motion Tween to Flash Timeline



Motion Tweens are similar to Classic Tweens and are used to transition between two states of the same symbol. In other words, you may have a symbol at stage left, at frame one. Once you apply a Motion Tween, you can move the object to stage right at frame 18. The object gradually moves from left to right over 18 frames.

A symbol is added at the first keyframe. You then add a Motion Tween and a tween extends for one second. If you had an animation running at 18 frames per second, the tween would appear for 18 frames. You can easily extend the tween by Cmd-dragging (PC-Ctrl-dragging) the end point. If your content extends beyond one second when you add the Motion Tween, then the tween appears for the duration of the initial content.

In addition to Position, you can also tween Tint, Rotation, Alpha, Brightness, and Scale. It is best to convert your object to a symbol before applying a tween. Motion Tweens require that you have the same symbol at the start keyframe and each additional keyframe. There must be some change made to the symbol state (i.e., Position or Alpha), at each keyframe. For information on Alpha, Brightness or Tint tweening, see topics Transparency (Alpha) Tween, Brightness Tween, and Tint Tween.


Step One

Add a polystar shape to the stage using the Polystar tool to a layer with one frame.

Step Two

With the polystar shape selected, convert it to a Movie Symbol (F8)(Modify > Convert to Symbol).

Step Three

Ctrl-click (PC-right-click) the keyframe and choose Create Motion Tween. A tween is added to the layer that extends for one second.

Step Four

Move the timeline frame indicator (red box) to the final frame of the tween.

Step Five

Move the polystar shape on the stage. Notice that a second keyframe is added.

Step Six

Place your curser over the motion path. Move the line to redefine the path.

Step Seven

To render your swf file, press Cmd/Return (PC-Ctrl/Enter).

Classic, Motion, and Shape Tweens

Classic Tweens and Motion Tweens work with Symbols. If you wish to transition between Drawing Objects or Merge Shapes you would use a Shape Tween.

The new Motion Tweens were first introduced in Flash CS4. They have two major improvements over the Classic Tweens. Whenever you create a Motion Tween, a motion path is automatically added. Motion Tweens also allow you to take advantage of the Motion Presets Library (Window>Motion Presets) and the Motion Editor (Window>Motion Editor).

In addition to tweening an symbol's position, you can also apply a motion tween to changes in Alpha, Brightness and Tint.

To make your tweens more organic and less linear, consider using the Motion Editor to vary the ease-in and ease-out settings. For more information, see topic, Motion Editor.

Motion and Classic Tween Name Confusion

Prior to Flash CS4, Classic Tweens were called Motion Tweens. A Classic Tween is nothing more than a Flash CS3 Motion Tween.

Extending a Motion Tween

To scale a Motion Tween, place your curser over the final frame of the tween and drag the frame. The tween is extended (or shortened) as you drag. All of the internal keyframes move proportionally.

If you wanted to simply extend the content without shifting the existing keyframes, press Shift as you drag.


Contribute Ad