Tweening instances, groups, and type

To tween the changes in properties of instances, groups, and type, you use motion tweening. Flash can tween position, size, rotation, and skew of instances, groups, and type. Additionally, Flash can tween the color of instances and type, creating gradual color shifts or making an instance fade in or out. To tween the color of groups or type, you must make them into symbols. See Creating symbols. To animate individual characters in a block of text separately, you place each character in a separate text block; see Breaking text apart.

If you apply a motion tween and then change the number of frames between the two keyframes, or move the group or symbol in either keyframe, Flash automatically tweens the frames again.

You can create a motion tween using one of two methods:

When tweening position, you can make the object move along a nonlinear path. See Tweening motion along a path.

To create a motion tween using the Motion Tweening option:

  1. Click a layer name to make it the active layer, and select an empty keyframe in the layer where you want the animation to start.
  2. To create the first frame of the motion tween, do one of the following:
    • Create a graphic object with the Pen, Oval, Rectangle, Pencil, or Brush tool, then convert it to a symbol. For more information on converting objects to symbols, see Creating symbols.
    • Create an instance, group, or text block on the Stage.
    • Drag an instance of a symbol from the Library panel.
  3. Create a second keyframe where you want the animation to end, then select the ending frame (immediately to the left of the second keyframe on the Timeline).
  4. Do any of the following to modify the instance, group, or text block in the ending frame:
    • Move the item to a new position.
    • Modify the item's size, rotation, or skew.
    • Modify the item's color (instance or text block only).

    To tween the color of elements other than instances or text blocks, use shape tweening. See Tweening shapes.

  5. Click any frame in the tween's frame span and select Motion from the Tween pop-up menu in the Property inspector (Window > Properties).
  6. If you modified the size of the item in step 4, select Scale to tween the size of the selected item.
  7. Drag the arrow next to the Easing value or enter a value to adjust the rate of change between tweened frames:
    • To begin the motion tween slowly and accelerate the tween toward the end of the animation, drag the slider up or enter a negative value between -1 and -100.
    • To begin the motion tween rapidly and decelerate the tween toward the end of the animation, drag the slider down or enter a positive value between 1 and 100.

    By default, the rate of change between tweened frames is constant. Easing creates a more natural appearance of acceleration or deceleration by gradually adjusting the rate of change.

  8. To rotate the selected item while tweening, select an option from the Rotate menu:
    • Select None (the default setting) to prevent rotation.
    • Select Auto to rotate the object once in the direction requiring the least motion.
    • Select Clockwise (CW) or Counterclockwise (CCW) to rotate the object as indicated, and then enter a number to specify the number of rotations.

    Note: The rotation in step 9 is in addition to any rotation you applied to the ending frame in step 4.

  9. If you're using a motion path, select Orient to Path to orient the baseline of the tweened element to the motion path. (See Tweening motion along a path.)
  10. Select the Sync option in the Property inspector to synchronize the animation of graphic symbol instances with the main Timeline.

    Note: Modify > Timeline > Synchronize Symbols and the Sync option both recalculate the number of frames in a tween to match the number of frames allotted to it in the Timeline.

  11. If you're using a motion path, select Snap to attach the tweened element to the motion path by its registration point.

To create a motion tween using the Create Motion Tween command:

  1. Select an empty keyframe and draw an object on the Stage, or drag an instance of a symbol from the Library panel.

    Note: To create a tween, you must have only one item on the layer.

  2. Select Insert > Timeline > Create Motion Tween.

    If you drew an object in step 1, Flash automatically converts the object to a symbol and assigns it the name tween1.

  3. Click inside the frame where you want the animation to end, and select Insert > Timeline > Frame.
  4. Move the object, instance, or text block on the Stage to the desired position. Adjust the size of the element if you want to tween its scale. Adjust the rotation of the element if you want to tween its rotation. Deselect the object when you have completed adjustments.

    A keyframe is automatically added to the end of the frame range.

  5. Drag the arrow next to the Easing value or enter a value to adjust the rate of change between tweened frames:
    • To begin the motion tween slowly and accelerate the tween toward the end of the animation, drag the slider up or enter a value between -1 and -100.
    • To begin the motion tween rapidly and decelerate the tween toward the end of the animation, drag the slider down or enter a positive value between 1 and 100.

    By default, the rate of change between tweened frames is constant. Easing creates a more natural appearance of acceleration or deceleration by gradually adjusting the rate of change.

  6. To rotate the selected item while tweening, select an option from the Rotate menu:
    • Select Auto to rotate the object once in the direction requiring the least motion.
    • Select Clockwise (CW) or Counterclockwise (CCW) to rotate the object as indicated, and then enter a number to specify the number of rotations.

    Note: The rotation in step 6 is in addition to any rotation you applied to the ending frame in step 4.

  7. If you're using a motion path, select Orient to Path to orient the baseline of the tweened element to the motion path. (See Tweening motion along a path.)
  8. Select Synchronize to ensure that the instance loops properly in the main document.

    Use the Synchronize command if the number of frames in the animation sequence inside the symbol is not an even multiple of the number of frames the graphic instance occupies in the document.

  9. If you're using a motion path, select Snap to attach the tweened element to the motion path by its registration point.