g Text Version
Beauty & Self
Books & Music
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
News & Politics
Religion & Spirituality
Travel & Culture
TV & Movies

Bored? Games!
Take a Quiz
Rate My Photo

Natural Living
Folklore and Mythology
Distance Learning

All times in EST

Clairvoyance: 08:00 PM

Full Schedule
g Digital Art and Design Site

BellaOnline's Digital Art and Design Editor


Create A Halloween Animation With The Flash Timeline Blur Effect

Project Information-- • Skill level-Intermediate • MacromediaR FlashR MX 2004

It's almost Halloween so I decided to create a quick and easy text animation using the Flash Timeline Blur effect and a scary sound file. In keeping with the holiday spirit, I decided to animate a scary looking BOO! Of course, you can use any text and sound file you prefer for your own project. Most of the instructions for this project have been covered in greater detail previously in my Building A Website With Flash series and you may wish to review those articles before we begin. But if you are ready, open Flash and let's go.

Step 1. Start A New Document. To start a new Flash document, click File > New to open the New Document dialog box and choose Flash Document from the list.

Step 2. Resize And Recolor The Stage. The default size and color of the Flash stage is too large and isn't very scary is it? So let's go to the Property Inspector/Size button and change the Background color to black and resize it to 200 pixels wide and 100 pixels high. Of course, you can use any size and color you prefer for your own project.

Step 3. Add Text. Now we will add the BOO text. Click on Frame 1 on the Timeline, click on the Text Tool and then click on the center of the Stage. Go to the Property Inspector again to set the following values for the Text Tool. Once you have the text the way you want, hit the Enter key on your computer keyboard. Now use the Selection Tool to drag the text to the bottom center of the stage. Of course, you can change any of the settings below to fit your needs.

Text Type: Static Text
Font: Thickhead
Size: 48
Color: CCCCCC (Gray)
Style: Bold
Align: Center

Step 4. Timeline Effect. Now the fun begins. We will use the Blur effect to make the text fade away like a ghost in the night. Use the Selection Tool to RIGHT click on the text box and choose Timeline Effects > Effects > Blur. Set the following values in the Blur dialog box.

Effect Duration - 40 Frames
Resolution - 15
Scale - .25
Allow Horizontal Blur - Checked
Allow Vertical Blur - Checked
Direction of Movement - Up (top row, click the arrow pointing up)

You may also wish to try changing these setting in the dialog box to see what other results you can get. Just change a setting and click the Update Preview button to see the results. When you have the results you like, click OK to close the dialog box and finalize the effect. You will notice that the Timeline has changed. There are now 40 frames in the Timeline for the Blur effect. Also you will see that a Blur symbol and an Effects Folder has been added to the Library Panel.

You still need to change one last setting for the Blur effect to be complete. Go to the Property Inspector and change the drop-down list from Loop to Play Once.

Insert Layer Button
Step 5. Add A Scary Sound. If you are using a sound with your animation, you will need another layer in the Timeline. Click on the Insert Layer button and name this new layer Sound. Now we will import your sound file into the Library Panel. Click File > Import to Library. Click on Frame 1 on the Sound layer and then drag an instance of the sound file from the Library Panel to the Stage. You will notice the sound has been added to the Timeline.

Step 6. Preview Animation. You may need to adjust the duration of the animation to match the duration of your sound file. You don't want the animation to stop before the sound stops. Let's preview the animation and make that decision. On the Menubar click Control > Enable Live Preview to allow Flash to play the animation and then click the Enter key on your computer keyboard to preview the animation. If you need to adjust the duration of the animation, click on Frame 1 on the Blur layer in the Timeline. Now click on the text box and click on the Effect/Edit button in the Property Inspector to reopen the Blur dialog box. Change the number of frames for the Effect Duration setting to shorten or lengthen the animation as needed. Once you get the animation and sound to match, you are ready to save your Flash file.

Step 7. Save .fla File. Before you publish your animation, let's save it in the default Flash .fla file format. Click File > Save As and give your animation file a descriptive name.

Step 8. Publish. In the Publish Settings dialog box, we need to change the setting to tell Flash to play the animation only once (by default the setting is Loop). Click File > Publish Settings to open the dialog box. On the HTML tab, uncheck the Loop for the Playback setting and click OK to close the dialog box. Now you are ready to publish your animation for the web. Click File > Publish and Flash will create a .swf file and the matching HTML webpage file.

Macromedia Flash MX 2004 Workspace

Macromedia and Flash are trademarks or registered trademarks of Macromedia, Inc. in the United States and/or other countries.
Product screen shot(s) reprinted with permission. All Rights Reserved.

Add Create+A+Halloween+Animation+With+The+Flash+Timeline+Blur+Effect to Twitter Add Create+A+Halloween+Animation+With+The+Flash+Timeline+Blur+Effect to Facebook Add Create+A+Halloween+Animation+With+The+Flash+Timeline+Blur+Effect to MySpace Add Create+A+Halloween+Animation+With+The+Flash+Timeline+Blur+Effect to Del.icio.us Digg Create+A+Halloween+Animation+With+The+Flash+Timeline+Blur+Effect Add Create+A+Halloween+Animation+With+The+Flash+Timeline+Blur+Effect to Yahoo My Web Add Create+A+Halloween+Animation+With+The+Flash+Timeline+Blur+Effect to Google Bookmarks Add Create+A+Halloween+Animation+With+The+Flash+Timeline+Blur+Effect to Stumbleupon Add Create+A+Halloween+Animation+With+The+Flash+Timeline+Blur+Effect to Reddit


RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map

For FREE email updates, subscribe to the Digital Art and Design Newsletter

Past Issues

Printer Friendly
tell friend
Tell a Friend
Email Editor

Content copyright © 2015 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.


g features
Working With Shapes In Canva

Using Backgrounds in Canva

Quick Look - Affinity Designer

Archives | Site Map


Past Issues

Less than Monthly

BellaOnline on Facebook

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

BellaOnline Editor