Flash: Advanced Buttons - Animated Buttons

Source Files: Download
Level: Medium
Version: 4,5

Animated buttons provide advanced interactivity. Simple rollovers and down states are common, but when you create animated buttons, your buttons take on a new life!.

Step 1. Begin with a new document and place some graphics and/or text you'd like to use for your button. Here's what I am starting with:

Step 2. Select all of your graphics and click the F8 key and make them a Button. Name your button.

Step 3. Double-click your button to edit it.

Step 4. I want to animate the circle and arrow in this example, so I'm going to select those again and click the F8 key again, and this time I'll select Movie Clip.

Step 5. Let's edit this movie clip now so double click it to open it up. Here I'll separate the outer black ring from the inner yellow circle/arrow.

Step 6. Double click the black circle to select it. Click F8 to convert it to a Graphic.

Step 7. While still selected, click Command-X/Control-X to cut it. Create a New Layer, name it black circle and click Command-Shift-V/Control-Shift-V to Paste in Place on the Black Circle layer.

Step 8. Select the yellow circle and the inner arrow and click F8 to make them a Graphic.

Step 9. Create a short Motion Tween for each symbol. I rotated the yellow circle/arrow and animated the black circle.

Step 10. That will complete the animation on the Up state on your button. Go ahead and preview the button by clicking Command-Enter/Control-Enter to preview it.

When you're ready, go on to the next page to animated the Over state.

Page 1 | Page 2

We've added 4 New Movies to our Flash 5 source files cd! These include detailed videos on:

1. Tell Target/With
2. Dynamic Text 1
3. Dynamic Text 2
4. Animated Fly Out menu Part 2

-------
About the CDROM:
These movies are the SAME content found in our Flash 5 tutorials, but the quality is clearly better than the streaming, web-compressed format we have online with Frame Rates up to 20 TIMES FASTER and CD-ROM quality AUDIO!

More Info...

Copyright © 1999-2011 CBT Cafe, All rights reserved

Flash®, Fireworks™, and Dreamweaver® are registered trademarks of Macromedia, Inc. in the United States and/or other countries
Photoshop®, Photoshop Elements® and Illustrator® are registered trademarks of Adobe Systems, Inc.
QuickTime® is a registered trademark of Apple Computer, Inc.
Ebay® is a registered trademark

CBT Cafe | Multimedia Learning | Interactive Graphics