bravemouse

I promised to reveal how to create a "scribble effect" using mask layers in Flash.  If you don't know what a mask layer is yet, have a look at this post on Mask Layers.

So how do you use mask layers to create animated writing like the example below? ( press the play button to see the animation)

You can download the files used in this example here.

Create the layers:

• Create two layers.
• Turn the top layer into a Mask layer:
  • Right click on the little "page" icon next to the layer's name.
  • Tick "Mask" from the drop down menu.
  • You should see the icon of that layer change, and (this is important) the one below it as well.

Your layers should look something like the screen shot below. The top layer is the "Mask" layer,and the one below the "Masked" layer.

Notice that both these layers are locked.  Click on the little lock icons to unlock both layers.

Create the writing:

In this example, I've re-named the layers.  The top "mask" layer is called "mask".  The "masked" layer at the bottom, is called "scribble".

• Click on the first frame of the layer named scribble – in other words, the lower, "masked" layer.
• Write or type out the entire phrase you want to appear.
• Insert some frames to stretch this layer.  It should look something like this:

Gotcha: If you are using the Type tool to create the writing  you will need to break it apart.  Go to Modify > Break Apart.  Do this TWICE. This changes the editable text created by the Type Tool into normal vector shapes.

Create the mask animation:

• Select the first frame of the "mask" layer.
• Use the Brush tool, and paint a small patch of colour covering up the bit of writing that you want to appear first.
• You dont need to be very neat – remember, the mask layer will (eventually) be invisible.

In this example, the mask layer is indicated in red:

• Insert a new keyframe in the "mask" layer.
• Make a splotch of colour over the next part of writing that must be revealed:

• If you lock both the layers, you will see the mask in action already.  Notice how it does not matter much how "messy" your mask is, as long as you cover all the bits of text you want to have revealed:

• Carry on inserting keyframes in the mask layer.  At each keyframe, add another patch of colour, gradaully covering up all of the text.
• When you are done, your layers should look something like this:

Test it (Control > Test Movie) and see.  Did you get it working?

You can download the files used in this example here.

Tags: 1 Comment