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 Flash and Animation Site

BellaOnline's Flash and Animation Editor


Import Layered Bitmap Image Into Flash

In this FlashR CS5 tutorial we will create a candle flame animation. We will use a flame graphic that we created in a PhotoshopR tutorial. See the link at the bottom of the page. In the Photoshop tutorial, the flame graphic contains three transparent layers. One layer contains the flame shape, another layer contains the orange glow and a third layer contains a smaller white glow. By animating all three of these parts separately we can create a realistic animation.

Once we have created the animation, you will be able to use it in any Flash project. To keep the animation reusable for various candles, you may wish to omit adding the candle graphic.

  1. Start a new Flash CS5 project and set the Background Color to black or a dark color of your choice and the Frame Rate to 30.

  2. We will start by creating a new movie clip. From the Menubar, click Insert � New Symbol. Name the new movie clip "flameAni". This will take us to the edit mode for the new symbol.

    At this point, we have one layer on the Timeline. Rename this layer to "bg" and leave it empty.

    In preparation for using this animation in several Flash projects, let's create a folder in the Library to contain all the assets for this movie clip.

  3. Add a new folder to the Library and name it "candleFlame Assets". Now, drag the flameAni movie clip into this folder.

  4. This is optional. We will import a candle graphic into our project (File � Import to Stage). This will add a new layer to the Timeline containing the imported bitmap. Rename it "candle".

  5. As stated above, the flame image has three layers. When we click File � Import to Stage, Flash will automatically create three new layers for us. In the Import dialog box, use the Bitmap Image with Editable Layer Styles option for each layer.

    We now have five layers on the Timeline.

    flame_glow � the orange glow around the flame
    flame_shape � the basic shape of the flame
    back_glow � the white glow around the flame
    candle � the candle image
    bg � empty bg layer

  6. In the Library, drag the asset folders for the candle and flame bitmaps into the candleFlame Assets folder.

Because we used the Editable Layer Styles option when we imported the flame bitmat, Flash has already converted the imported flame layers into movie clips. We will use Frame 1 as our first candle flame position. Then we will transform the shape several times to build our tween animation.

Join us in the Flash forum.

Add Import+Layered+Bitmap+Image+Into+Flash to Twitter Add Import+Layered+Bitmap+Image+Into+Flash to Facebook Add Import+Layered+Bitmap+Image+Into+Flash to MySpace Add Import+Layered+Bitmap+Image+Into+Flash to Digg Import+Layered+Bitmap+Image+Into+Flash Add Import+Layered+Bitmap+Image+Into+Flash to Yahoo My Web Add Import+Layered+Bitmap+Image+Into+Flash to Google Bookmarks Add Import+Layered+Bitmap+Image+Into+Flash to Stumbleupon Add Import+Layered+Bitmap+Image+Into+Flash to Reddit


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

For FREE email updates, subscribe to the Flash and Animation Newsletter

Past Issues

Printer Friendly
tell friend
Tell a Friend
Email Editor

Content copyright © 2018 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
Subtle Animation Website Trends

Wix Editor - Background Video

Video on Wix Websites

Archives | Site Map


Past Issues

Note: BellaOnline uses cookies to help provide a consistent user experience. Our advertisers may use cookies to help customize ads. Please contact us with any question about our cookie use.

Summertime Foods
Corn on the Cob
Burgers on the Grill
Apple Pie


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

BellaOnline Editor