spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / multimedia / flash / intro

Working with Flash

Developer News
OpenOffice 3.2 Lands Amid Critical Changes
Red Hat, IBM Firmly in KVM Virtualization Camp
Red Hat Talks Up Open Source Cloud Plans

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


The Network for Technology Professionals

Search:

About Internet.com

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | E-mail Offers

webref The latest from WebReference.com Browse >
Search Engine Optimization: Selecting and Embedding Keywords · Are Google's Language Translation Web Services Ready for Prime Time? · Installing and Using Meeplace, the Business Review CMS
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
IBM DB2 10 for z/OS: Justifying the Upgrade · Living La Vida Colo: Choosing the Right Colocation Facility · FTC Concerns over Social Media Privacy Linger


Revised: June 23, 2000

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