Home / Articles / Advanced Motion Tweening with Adobe Animate

Advanced Motion Tweening with Adobe Animate

Chapter Description

Learn how to use the Motion Editor in Adobe Animate to edit property and ease curves and create more realistic motion.

Copying and pasting curves

You’ve spent a lot of effort creating a custom property curve for the motion of the first movie clip. Fortunately, you don’t have to work through the same steps for the other movie clips. Animate provides quick and easy ways to duplicate individual property curves or entire motion tweens.

In the following section, you’ll duplicate the motion of the US block to the European Union and Japanese blocks.

  1. In the Motion Editor of the motion tween for the US movie clip, select the Y-property under Location.

  2. Right-click the Y-property curve and choose Copy.

    Animate copies the curve for the Y-property.

  3. Double-click the motion tween in the Euro layer.

    The Motion Editor in the US layer collapses and the Motion Editor in the Euro layer expands. Both the X-property and Y-property curves of the motion tween in the Euro layer are straight, each representing linear motion.

  4. Select the Y-property under Location.

  5. Right-click the Y-property curve and choose Paste To Fit Current Range.

    The property curve data copied from the US clip is applied to the Euro clip, but it is adjusted to fit the range of Y-position values for the Euro clip’s motion.

    The final pasted curve has the correct shape and anchor point curvatures, but it is squeezed to fit the beginning and ending points of the Euro motion tween. That means its ending point is lower on the Stage than you want.

  6. Hold down the Shift key and drag the final anchor point down so that its property value is identical to the previous anchor point. (The final anchor point should be at a point where the Euro block sits immediately under the US block with no space between them.)

  7. Hold down the Shift key and drag the anchor point at frame 21 to about Y=200 in the Motion Editor to re-create the gentle slope in the original curve.

  8. Test your new motion by pressing Return/Enter.

    Both the US and the European Union blocks slowly ease in to their motion, fly up high, and then settle back down in the middle of the Stage.

Duplicating entire motion tweens

Copying and pasting individual curves in the Motion Editor allows you to duplicate the animation of individual properties. For example, you could duplicate the Y-motion of a tween, but not its rotation.

In this project, since you want to duplicate the motion tween of blocks you’ve already finished (which consists of change only along the Y-property), you can use the commands Edit > Timeline > Copy Motion and Edit > Timeline > Paste Motion.

You’ll use Copy Motion and Paste Motion to copy the motion tween of the European Union movie clip and paste it into the Yen movie clip.

  1. Double-click the motion tween in the Euro layer to collapse the Motion Editor.

  2. Shift-click the motion tween in the Euro layer.

    The entire motion tween span is selected.

  3. Right-click and choose Copy Motion, or choose Edit > Timeline > Copy Motion.

    The entire Euro layer motion tween is copied.

  4. Select the motion tween in the Yen layer.

  5. Right-click and choose Paste Motion, or choose Edit > Timeline > Paste Motion.

    The property curves of the Yen motion tween now are identical to that of the Euro motion tween, with different beginning and ending values. The Paste Motion duplicates the copied tween but applies it to the object’s starting position.

    If you want to refine the motion of the Yen block further, open its Motion Editor. Select the Y-position property and lower the height to which it rises (by dragging the anchor point in frame 21 up slightly) before falling back down. Doing so will create a slight separation between the Yen block and the Euro block. Make minor adjustments to the positions of the property curve keyframes until you’re satisfied with the overall motion.

    Wrap things up by closing the Motion Editor.

8. Adding complex eases | Next Section Previous Section

There are currently no related articles. Please check back later.