Home >> Production >> Flash and ActionScript >> Symbols, Tweening and Properties

Flash Basics: Symbols, Tweening and Properties

Continued from Introduction to Frames and Timelines

Creating a simple motion tween.

We will start with a very basic motion tween. By making an object a symbol, you can automatically tween the motion (have Flash generate the position or properties) in between the two keyframes.

STEP ONE:

Draw or type something on the stage. Select your content with the black arrow tool.

NOTE: If you have a more complex drawing with several different lines and shapes, you should select all of the seperate objects (hold SHIFT while selecting with black arrow tool) and group them by going to Modify-->Group

 

 

STEP TWO:

Convert your object to a symbol
Insert-->Convert to Symbol or use the short cut by pressing F8

By making your object into a symbol, you have added it to the Library of your movie and now have an instance of that symbol in a keyframe. An instance is not the symbol itself. The symbol itself is stored in the library and is sometimes called a library item. Instead, an instance is a copy of the symbol. You can make changes to this copy (or "instance") without affecting the symbol in the library.

 

STEP THREE:

Add another keyframe farther down the timeline.
Insert-->Keyframe or use the short cut by pressing F6

When you make a new keyframe further on in the timeline, it will automatically duplicate the content in the last keyframe. i.e., when I insert a keyframe at frame 20, it automatically duplicates the content from frame 1 (which is an instance of the symbol "Loyola") and is shown as a solid dot keyframe.

 

STEP FOUR

Alter one of the keyframes. You can change size, position, alpha transparency, or color tint.

With the black arrow tool, select one of the keyframes, a blue box should appear around the content associated with that keyframe on the stage (see above image)

With the content of one of the keyframes selected you can perform one or several of the following property changes:

Change Size Change Position Change Color Change Transparency Change Angle
Modify-->
Transform-->
Scale
Drag object to
another spot on
the stage
Modify-->
Instance-->
Effect (tab)-->
Tint (pulldown)
Modify-->
Instance-->
Effect (tab)-->
Alpha (pulldown)

Modify-->
Transform-->
Rotate

For Vertical or Horizontal Flip:

Modify-->
Transform-->
Flip Vertical or Horizontal

 

STEP FIVE

Now that you have altered an instance of the symbol in one of the keyframes, you can apply a motion tween.

Slide your cursor in between the two keyframes so that a hand pops up, and then left click to select the area between the two keyframes, it will turn black when selected.

Now apply the motion tween by either:

right clicking and selecting Create Motion Tween for a quick motion tween

OR

Modify-->Frame-->Tweening (tab)-->Motion (pulldown) for more option


Tweening:
where you can select motion or shape tweening

Easing: the velocity of the animation

Rotate: rotates object either clockwise or counterclockwise


DID IT WORK?

 

 

Modify Instance or Modify Frames?

How do you know when to modify instance or modify frames? Modify frames is used for tweening-- you want to modify all of the frames in between keyframe a and keyframe b.

Modify instance is used to change the properties of one of the keyframes. This option is only available if you have selected the instance (clicked on it on the stage) and if that instance is indeed a symbol. If it is not a symbol, you cannot change the instance.

 

Go on to Shape Tweening