home
 
Tutorials:
Animated text (part 1)
Animated text (part 2)
Basic Motion Tween
Blur Effect
Drop Shadows
Panning and Zooming
Lip Syncing
Line Weight
Iris Transition Effect
Edit Center

 

Forums:
Macromedia
Flash Film Maker
Kirupa
Were-Here
Brajeshwar
Swift 3D

 

Contact Me:
chris@mudbubble.com
 
Basic Fade Effect
written by Chris Georgenes
 
This tutorial demonstrates how to create a very basic fade effect. By the end of this tutorial you will have made the following animation:
 
  1. Use any of the shape tools or drawing tools to create a shape - doesn't matter what it is - just keep it simple for now.
 
2. With the arrow tool (black arrow) select your shape (or CTRL + A). We must convert our shape to a symbol before applying a motion tween. If we apply the motion tween first, Flash will automatically generate a symbol with our shape and give it a generic name ("tween 1"). This makes it difficult to keep our symbols organized and to locate later as our Flash movie becomes more complex. Convert the shape to a symbol by hitting the "F8" key, or, from the drop down menu, Insert > Convert To Symbol. In the "Convert To Symbol" dialog box type in a unique name for your shape and choose it's behavior (I chose "Graphic" for this example). For more information on symbol behaviors, hit the "F1" key and search help documentation. We now have what is referred to as an "Instance" of our symbol on the stage.
 
3. Next, select a new frame further down the timeline (I chose frame 20). Doesn't matter right now which frame you choose, it will be easy to edit that later. With this 2nd frame selected (it should now be shaded), hit the "F6" key or from the drop down menu, Insert > Keyframe. You should now have 2 keyframes on your timeline and the frames between them should be shaded gray. Each keyframe contains it's own instance of our symbol.
.
 
4. With the playhead still on frame 20 (or whatever is your 2nd keyframe), use the arrow tool to select your symbol instance on the stage. Open the Properties panel and from the "Color" drop down menu choose "Tint" and the color of your background.
* You can choose "Alpha" as your fade effect if you have a background that is not a solid color, like a bitmap or several different color shapes. I always choose Tint tween to a solid color background because it's much more processor friendly during playback than Alpha tweens are - especialy when fading bitmaps. My own personal test result in a 30% increase in CPU performance when using Tint tweens over Alpha.
 
5. Right click (Windows) or Command click (Mac) anywhere between the 2 keyframes and from the drop down menu choose "Create Motion Tween."
 
Done! Now test or playback your movie to see your shape fade away.


I hope this lesson helps you. I have provided the source file for you to download and play around with. If you have any questions feel free to drop me an email or IM me:
 
download source Download source (Flash MX)