Printer Friendly Version

BellaOnline's Flash and Animation Editor

Flash Classic Motion Guide

Our FlashR sparkle effect will be a star moving along a guide path. If you haven't read the first part of this tutorial, use the Back link at the bottom of the page.

Begin back at the first frame and add a new layer and name it "starAni1". It's easy to draw a star on the stage with the PolyStar tool. In the Properties panel you will want to set the Style to Star, the Number of Sides to 5 or 6 (depending on how many points you want for your star) and the Point Size to .10. Click and drag to draw the star on the stage. Convert the star shape to a Symbol named "starAni".

When we created the masked scroll animation, it ended on Frame 100. Still on the same starAni1 layer, add a Keyframe on Frame 100. This will extend the starAni1 layer to end with the mask scroll animation. Go back to Frame 1 and move the movie clip to the top of the stage. Right-click on the starAni1 layer in the Timeline and choose Create Classic Tween. We should now see a horizontal line across the 100 frames to indicate that we have a Classic Tween.

Now we will draw the Guide path for our star with the Pen tool. Of course, the guide path will follow along the shape of the red scroll. But we can't see the scroll because it is masked. To turn off the mask, we need to unlock the mask layer. Go back to the starAni1 layer and right-click on the layer's name (not on the layer itself). Choose Add Classic Motion Guide from the menu. Flash will add a another layer, named Guide:starAni1, above the Star layer. You will also see that the starAni1 layer is indented under this new Guide layer, indicating it is controlled by the Guide layer. Starting on Frame 1 of the Guide layer, use the Pen tool to draw the path line along the curve of the red scroll. Note that we are only working on one scroll at a time. We will repeat these steps for the other red scroll and another guide layer.

Click on Frame 1 of the starAni1 layer. In the Properties panel, choose Snap. Drag the movie clip to the beginning of the guide path and it will snap into place. Next, go to the last frame of the animation (it should already have a Keyframe) and drag the star movie clip to the end of the path. Again, it should snap into place. Move the Timeline slider to watch the star move along the guide path.

Because our graphic has two scrolls, we need to repeat this process for another instance of the star movie clip. Add another layer to the Timeline (named starAni2) and copy/paste our star movie clip on to Frame 1. Create a Guide layer and draw the guide path with the Pen tool along the second scroll. Repeat the rest of the process for the second star. Now, we can test the movie and see that as the scroll image is revealed on the stage, the stars follow along the path. Both animations begin and end together.

The effect is enhanced if we use a small animated star movie clip instead of a static star. Let's build an animation for our star.

View Ecard at Pamela Gladding Ecards

← Back | Next →

Join us in the Flash forum.

Flash and Animation Site @ BellaOnline
View This Article in Regular Layout

Content copyright © 2013 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2018 Minerva WebWorks LLC. All rights reserved.

BellaOnline Editor