Path Animation
Layer Masks
Shape Tweening

 

LAYER MASKS

 

 

A layer mask is like a wall with a window in it. You cant see anything behind the wall, except through the window.

You can animate the mask or the layers beneath it, or both.

A mask is useful for effects and to shape objects.

If youd like to check out a mask in action, open Mask Example.fla from your Flash Samples web design course folder. Hit F12 to play the movie.

 

Creating a Mask

The mask can be any shape, as long as it has a solid fill. The shape becomes the "window" that defines what is visible on the layers beneath.

  1. Create a new Movie, 760x420
  2. Create two layers.
  3. Name the top layer Mask and the bottom Layer Masked Stuff
    It doesnt matter what you call the layers, but its a good idea to name them something descriptive.
  4. On the Masked Stuff layer, draw a whole bunch of stuff. Go crazy. Nows your chance to become a modern artist.

A frank artistic commentary on harmony in the Middle East

 

  1. On the Masked Stuff Layer, add a keyframe at frame 20 on the
    The Keyframe will make sure the masked stuff shows for 20 frames.

  2. On the Mask Layer, draw a circle on the left side of the screen.
    This object is the mask. It will not show when we are finished, so it doesnt matter what color you make it. It does have to be solid, though.
  3. Make the circle a symbol and animate it so that it moves across the screen in twenty frames.

  1. Right-click (ctrl + click, Mac) the Mask layer-> Choose MASK..

 

Everything will disappear, except for what we can see through the mask.

  1. Play your movie!

 

Editing a Mask

You may notice that the mask layer and its sub-layers are locked. The mask layer and its sub-layers must be locked for the mask to function properly. You must unlock the layers to edit the mask.

 

Quick Step Guide to Masking

  1. Create two layers
  2. On the top layer, draw or place a solid shape. This will become your mask.
    Animate it as you choose.
  3. On the bottom layer place the objects to be masked.
    Remember that none of them will be visible unless the mask shape is directly above it.
    You can animate at will.
  4. Right-click (ctrl + click, Mac) the top layer and choose Mask.

 

Masking with a Feather

Sorry, cant do it. The mask must be a solid shape.

You can import an image with transparency, though. The transparent part of the imported image could be feathered, and would show layers underneath it.

A black shape with a feathered hole cut in it

 

Youll need PhotoShop to import an image with transparency into Flash.

 

  1. In PhotoShop, flatten all layers and select the area of the image that you want to see.
    The selection can be feathered
  2. Click SELECTION-> SAVE SELECTION
    Save the selection. Everything else will be transparent.
  3. Click FILE-> SAVE AS
  4. Choose .PNG as the file type.

 

When you import the .PNG into Flash, the non-selected areas will be transparent!

 

 

Continue to Shape Tween |