Intro to Flash | 3


Working with Flash

The Animation Steps


Fig.4 - Our first Flash animation

We've just completed everything we need to do to create a simple animation. We can now add text and another shape for practice.

Let's make a new layer and call it text. We do this in the Timeline area with the plus in the bottom left corner. Make sure the text layer is above the circle layer. In the same fashion as we made the circle animation, add a keyframe to the text layer in the first frame. Then type the word "Welcome" in the first frame using the type item (the "A") from the toolbar. Select the text with the arrow item and go to Insert> Convert to Symbol like we did with the circle. Now that the text is a symbol, we can create our animation. Drag the text so that it is off of the black area on the left side. Create a motion tween and then place another keyframe at frame 25. In the last frame, place the text somewhere near where the circle is. Go back to the first frame and then play the movie again to preview it. Let's take a moment to catch our breath and review the steps we took:

  1. Create a new layer
  2. Draw your object
  3. Convert it to a symbol
    Insert> Convert to Symbol
  4. Add keyframes where needed
    Insert> Keyframe
  5. Create the motion tween
    Popup Menu from frame> Create Motion Tween
  6. Change the positions or appearance of the object
To add the last shape, make a new layer and repeat the above steps. I drew a triangle for mine and made it move from the bottom left hand corner to the middle of the area. I also took the standard animation one step further by changing the orientation of the object. Try what I did with your shape. In frame 25, I rotated the triangle by 150 degrees. To do this, make sure the object is selected and then under the Inspectors> Transform tab set the rotate feature to "-150" and press return. Now when the animation runs, the triangle will rotate as it moves across the screen.


Fig. 5 - Transforming our triangle

Now that we have simple animations under control, let's move on to some advance features.

Next: The advanced features of Flash

Comments are welcome

Written by Kate Levy and
Revised: June 23, 2000

URL: http://webreference.com/multimedia/flash/flash3.html