Flash & Swish  Home Flash & Swish Flash Tutorials Simple Directional Fade
rss

Simple Directional Fade

Author: Pipey.com More by this author


Here's a fairly simple technique to achieve a directional fade-in. Using this method, you can fade any object into view from any direction.

Start a new movie. Use Insert > Frame to put in about 20 frames.
Type in some text.

The next step is to make a 'mask' which is used to hide and gradually reveal the text. Insert a new graphic (Insert > New Symbol and select Graphic).
Start by drawing two identical rectangles. Fill one with white (to match your movie's background color).



The second rectangle needs a special colour gradient. Open the Color dialog (Window > Colors) and go to the gradient tab.
For the left side of the gradient, choose white with 100% Alpha (solid white). For the right side, use white with 0% Alpha (totally transparent). Click on 'New' to save this gradient to the palette.
Use this special gradient to fill the other rectangle



To complete the symbol, remove the borders from the two rectangles and move them together so that they form a single shape.
In the picture I've set the movie background to grey so you can see what the shape looks like.


Next comes the animation. Create a new layer above the text layer. Open the library (Ctrl-L) and drag a copy of the rectangular mask onto the Stage.
Stretch the mask horizontally so that it is at least twice the length of the text.
Position the rectangle so that the solid white half covers the text.


Insert a keyframe at frame 20. Then drag the rectangle left until it is past the left side of the text.
Finally, tween the motion of the rectangle (Right-click on the frame in the timeline and select 'Create Motion Tween')

And that's it. Run the animation!
It should look something like this...



Download Source



Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Simple Directional Fade"