Printer Friendly Version

BellaOnline's Flash and Animation Editor

Masking Script Lettering in Flash CS5

There are many uses for the script lettering masking technique in FlashR. One method that is very popular is the effect that reveals the script lettering as to appear as if it's being written on the stage. This animation can be created in several levels of realism. For our working example, let's take a look at a few ecards that I animated for Pamela Gladding.

The easiest but less realistic method would be to use masking to reveal one word or letter at a time. You often see this effect in advertising. It gives the impression that the words are being spoken instead of written. I used this type of masking for the "Greetings of the Season" message in the Poinsettia Scroll ecard (see link below to view ecard). I chose this method because the words are being "revealed" by the twinkling stars that move across the stage. Therefore the handwriting effect is less important to this animation.

But when we want to create a realistic hand script effect, we will need to mask small parts of each letter over many frames. I used this technique in two PG ecards. In the first example, a Thanksgiving ecard, the capital letter G in "Give Thanks" was masked over 52 frames. As you can see in the screenshot, I used the round brush to paint small dots along the curve of the G. This method can be a bit time consuming but the effect is worth the extra work. The entire Give Thanks animation took 341 frames.

For the Holiday Gilded Pear and the Seasons Greeting Sleigh ecards, I used this technique along with a small paint brush animation to give the illusion that the brush was writing the message. I imported a small bitmap image of a paint brush and converted it to a movie clip so that I could create a tween animation for the brush.

As you would expect, this requires the tweening for the paint brush to be sequenced with the script lettering. I first masked the script lettering which made it easier to match the movements of the paint brush to the letters. If you take a look at the screenshot, you can see the purple guidelines match the shape of the letters. This entire animation was created within one movie clip which I named "message". I placed a stop(); code on the last frame of this movie clip so that the animation would play only once. Then on the main timeline, I placed this message movie clip on the stage on the frame that I wish the animation to begin.

Poinsettia Scroll

Thanksgiving Wishes

Holiday Gilded Pear

Seasons Greeting Sleigh

Join us in the Flash forum.

Flash and Animation Site @ BellaOnline
View This Article in Regular Layout

Content copyright © 2013 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2016 Minerva WebWorks LLC. All rights reserved.

BellaOnline Editor