Attractive contour animation
Submited in: Flash
| Total Views: 49302
Reading this tutorial you will learn:
1. How to create contour of any object using the Line Tool
2. How to animate that countour using the mask effect and rectangle.
You don't have to use action script code to make this tutorial. You can apply this animation on any objects, and you can use it for some header animation, banner...
First of all, downalod my picture to make this tutorial quickly.
Open a new flash document.
Press Ctrl+J key on the keyboard (Document Properties) and set the width of your document to 404 pixels and the height to 355 pixels. Select any color as background color.Set your Flash movie's frame rate to 26 and click ok.
Choose File > Import > Import to Stage (Shortcut key: Ctrl+R) and Import my picture into a flash stage.
While the picture is still selected, go to the Align Panel (Ctrl+K) and do the following:
1. Make sure that the Align/Distribute to Stage button is turned on,
2. Click on the Align horizontal center button and
3. Click the Align vertical center button.
Now you have aligned a photo with the background.
Double click on layer 1 to rename its name in picture. After that, click on frame 70 and press F5 key.
Create a new layer above the layer picture and name it contour.
After that, take the Line Tool (N) and go to the Properties Panel (Ctrl+F3) below the stage. Then, choose the following options:
1. Enter #C4E7FB for the stroke color
2. Select Solid as the type of outline, with the line thickness set to 1.
3. Turn on the Stroke hinting option to get rid of any blurry edges while drawing.
Then, draw a contour around the human shape like it is shown on the picture below.
While the contour that you just created is still selected, go again to the Properties Panel (Ctrl+F3) and choose the following options. See the picture below.
Now, you have this:
Click on frame 70 of layer contour and press F5 key.
Create a new layer above the layer contour and name it mask.
Take the Rectangle Tool (R). In the Colors portion of the Tool panel, block the Stroke color by clicking on the little pencil icon and then on the small square with the red diagonal line. For Fill color choose any color and draw a “rectangle” below the picture about 350 × 30px. See the picture below.
Click on frame 25 and 40 of layer mask and press F6 key.
While you're still on frame 40, place the rectangle above the picture using the Selection Tool, or by mouse. See the picture below.
Right-click anywhere on the gray area between the frame 25 and frame 40 on the timeline and choose Create Motion Tween from the menu that appears. See the picture below.
Click on frame 55 and press again F6 key, Then, while you're still on frame 55, place the rectangle again below the picture. See the picture below.
Right-click anywhere on the gray area between the frame 45 and frame 55 on the timeline and choose Create Motion Tween from the menu that appears. See the picture below.
After that, click on frame 70 and press F5 key.
Select mask layer and convert it to a mask by right-clicking on the mask layer and selecting Mask. See the picture below.
Now you have this:
Test your Movie (Ctrl+Enter).
Have a nice day!