Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Summary:

RAINBOW Mask in Flash

    ●  Masking is an Important Concept and can be difficult to understand.

    ●  However, it is important because most graphic applications use them in some form or another. Learn about masking in Flash by doing this interesting and fun tutorial.


Learn About:

Masking Keyframes Classic Tweens

  •   This tutorial is normally used in the Aesop's Fables Project.

Other People's Work:

Here are examples of work inspired by this tutorial.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #1: Open a your Work in Flash ~

Open your project in Flash

… and go to your last scene where you'll have your moral (or just make a new scene for it now).


Or just make a new scene for your Moral now:


Step #2: Type your Moral ~

Select the Text Tool or hit the keyboard shortcut letter (t) …

text flash

… draw a text box and type your moral (if you don't remember the moral, find it here)

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #3: Select a Good Font ~

Open Properties by hitting the keyboard shortcut: Cmd(⌘)+F3 click on the font and scroll down until you find what you want …

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #4: Embed the Font ~

When you've selected your text, hit Embed …

… and select All:


Step #5: Convert to Movie Clip ~

With the text selected, hit F8 f8(or Right-Click and select: ) and make a Movie Clip.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #6: Double-Click the Movie Clip ~

Double-Click on the Movie Clip - now you are working INSIDE the Movie Clip.


Now you are working INSIDE the Movie Clip.
movie within a movie

Remember: A Movie Clip is a movie WITHIN a movie.


Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #7: Lock the Text Layer ~

Now that you're inside the Movie Clip, lock and label the text layer and make a New Layer above it.

 


Step #8: Oval Tool ~

Get the Oval Tool which is behind the Rectangle Tool or hit the keyboard shortcut letter (o):


Step #9: Set your Colors ~

Open the Color Palette by hitting Shift+F9 and set the Stroke color None

… and set the Fill Color to Rainbow.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player



Step #10: Draw an Oval ~

Draw a small Rainbow circle in the middle of your text.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #11: Create Motion Tween ~

Click on Frame 40 and hit f6 to insert a Keyframe (or Right-Click and select: ) on both layers.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #12: Insert a Motion Tween ~

Right-Click between the keyframes in the middle of the top layer somewhere and select Create Classic Tween.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #13: Stretch the Oval ~

Then select the Free Transform Tool or hit the keyboard shortcut letter (Q) …

… click the last frame of the top layer …

… click and stretch the oval out to cover the entire stage area.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #14: Add More Time

Go out a few more frames and add some time to your animation by hitting F6 to put keyframes on each layer. 

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #15: Drag the Text Layer~

Drag the text layer layer ABOVE the Rainbow layer!


Text should be on top - Rainbow below.


Step #16: Mask

 Right-Click on the "Text" layer and select Mask. 

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #17: Back to Scene ~

In the upper left hand corner of the Flash interface, go back to main scene by clicking it.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #18: Filters ~

Now find Filters by going to: Window > Properties

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

… and apply Drop Shadow to the movie clip.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #19: Bevel ~

Also add Bevel to the box and adjust the strength to your liking.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Step #20: View your Work ~

View your work by hitting the keyboard shortcut: Cmd(⌘)+Enter cmd enter

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Last Step: Save and View your work ~

Save your work as - FIRST_NAME_LAST_NAME_PROJECT_NAME.fla]

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

 

•   ALWAYS save your projects using the following naming convention:
FIRST_NAME_LAST_NAME_PROJECT_NAME


  •   DO NOT name your project any other way - Improperly named projects will not receive credit and you will be sad.


  •   NEVER leave your work on the desktop or depend on a flash drive - instead, save your work in a folder you can find later - preferably on a virtual drive where it can be backed up.