Motion Editor

Motion Editor

Flash CS4 Tutorial


How to Vary the Velocity of Your Flash Motion Tweens



The Motion Editor is used to fine tune your Motion Tweens. Unfortunately, it doesn't work with Classic Tweens or Shape Tweens.

To access the Motion Editor, click a Motion Tween, then click the Motion Editor tab or select Windows > Motion Editor.

There are several presets available in the panel or you can design a custom velocity graph.


Step One

Open a new document and add a shape with the PolyStar tool.

Step Two

Select the shape and press F8 to convert it to a Movie Symbol.

Step Three

Position the star on the right side of the stage and right-click frame one of the default layer. Choose Create Motion Tween from the pull-down menu.

Step Four

Click the final frame of the tween and move your object to a new location. A new keyframe is added to the tween.

Step Five

Click the tween and open the Motion Editor by choosing Window > Motion Editor.

Step Six

The Motion Editor is broken into five sections, Basic Motion, Transformation, Color Effect, Filters and Eases.

Step Seven

To add a new Ease to your menu options, click the plus icon in the Ease section and choose Bounce In from the pull-down menu.

Step Eight

To add Bounce In to the motion, choose Bounce In from the pull-down menu in the Basic Motion section.

Step Nine

Test your movie by choosing Control > Test Movie (Cmd/Return (PC-Ctrl/Enter).

Step Ten

Repeat the process with the other Eases.

Step Eleven

To build a Custom ease, choose Custom from the Ease pull-down menu. You can add multiple Custom eases to your Flash document.

Step Twelve

Click the keyframes in the graph, then adjust the handles to reshape the curve. A steeper curve means faster motion.

Step Thirteen

Cmd-click (PC - Ctrl-click) the graph to add a keyframe.

Step Fourteen

Cmd-click (PC - Ctrl-click) a keyframe to remove a keyframe from the graph.

Step Fifteen

Use the Graph Size, Expanded Graph Size and Viewable Frames settings to scale the graph height and width.

Color Effects and Filters

The Color Effect and Filters sections include additional tweening options. Color Effects include Alpha, Brightness, Tint and Advanced Color. Your filter choices are Drop Shadow, Blur, Glow, Bevel, Gradient Glow, Gradient Bevel and Adjust Color.

De-Cluttering the Motion Editor

If you have several eases that aren't being used, click the minus icon in the Ease section to remove them from the panel.

Easing in One Direction

In our example we showed how to apply an Ease to the Basic Motion. It equally affected the x, y and z object motion. If you wanted to affect only one direction, open the Basic Motion section (click triangle) and apply the preset to a specific direction.

The same is true with the Transformation section.