Masking Part 2

 

A Mask Without a Mask Layer

It should be obvious that this effect is going to involve the background image showing through the hole you just created in the rectangle. Through the clever use of filters and blend modes, you are going to remove the solid color around the hole and feather the edges of the oval to create the soft mask effect. Here's how:

  1. Open the Softmask2.fla file. When the file opens, open the library, and open the softmask movieclip in the Symbol Editor. Add a new layer named Mask.
  2. Select the Mask movieclip and drag it to the new layer. Move it into position in order to have the background image appear through the oval.
  3. Select the movieclip in the Mask layer, and click the Filters tab of the Property inspector. When the filters appear, click the sign and select the Blur filter.
  4. When the Blur filter properties appear, use these settings:

    The outside edges of the rectangle and the inside edges of the cutout, as shown in Image 3, will have a blur applied to them.

    Applying a blur 
    Image 3. Applying a Blur filter to the masking object

    • Blur X: 15
    • Blur Y: 15
    • Quality: High

Select the mask shape, and in the Property inspector, select the Erase blend mode. The whole shape disappears . . . or does it?

5.  The Erase mode removes the base color from the pixels of the movieclip to which it is attached. It also removes anything behind it. In this case, the content will show through the hole. Also, as we pointed out in an earlier masking exercise, content on a mask layer can't have a filter applied to it. The blend modes allow filters, which means that the content showing through the hole will gradually fade out.

  1. To complete the effect, return to the main timeline by clicking the Scene 1 link. Click the movieclip on the stage to select it.
  2. With the movieclip selected, apply the Layer blend mode in the Property inspector. The mask effect now becomes apparent, as shown in Image 4.
  3. Save the movie.

    Applying a blend mode 
    Image 4. Apply the Layer blend mode to the movieclip on the stage to create the effect.

What happened? There are eleven blend modes in Flash, and two of them—Alpha and Erase—require that a Layer blend mode be applied to the parent movieclip or object. In the case of this exercise, the softmask movie clip is the parent of the Mask movieclip. The parent is required because of the hierarchy that Flash uses for managing content on the stage, which is different from Photoshop CS3 or Fireworks CS3. This is why the Alpha and Erase modes require that an additional movieclip be set to the Layer blend mode.

Flash treats this movieclip as an entirely different canvas. In this specific case, the embedded blending modes are first calculated, and then the parent—softmask—is redrawn using the Normal mode. This is needed because you can't have an invisible stage on the main timeline. This is awfully techie, but you now know how to use the Erase and the Alpha blends to create a soft mask effect.