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

Women's Fashion
Small Office/Home Office
Holiday/Seasonal Cooking
Crafts for Kids

All times in EST

Clairvoyance: 08:00 PM

Full Schedule
g Flash and Animation Site

BellaOnline's Flash and Animation Editor


Using Flash for In Betweens

Before the computer arrived on the scene and made life much easier for the animator, one of the major tasks for creating animation was to draw all the individual "in between" frames for an animation. This was usually done with a technique called onion skinning. Animators would start with a "working drawing" and place a thin sheet of paper, called an onion skin, over the top. They would draw the same image onto this onion skin paper using the working example underneath as a guide. By making subtle changes to the second and subsequent drawings, an animation was created.

These days, we don't find this technique used as much because animation software creates these in between images for us. But, one of my readers recently needed to create the in betweens for one of her projects. Her first thought was to travel back in time several decades and draw each in between manually. Then a bright light bulb went off over her head and she realized she could still let FlashR do the work for her.

She needed 10 in betweens. So she opened Flash, installed the beginning and ending object on the Flash Timeline and told Flash to create a 10-framed Tween. Now the task was to grab each frame of the tween as an image. Because these images were going to be used over a background image, she decided on a png format.

Let's walk through the process in Flash CS5. Open a new ActionScript 3 project in Flash.

  1. Setup the PolyStar tool with the color of your choice. In the Tools Settings area of the Properties panel, click the Options button. Set the Style to Star.

  2. Draw a star on Frame 1. Convert this shape to a Movie Clip.

  3. Right-click on the star and choose Create Motion Tween.

  4. Drag the Tween Span from Frame 25 to end on Frame 10.

  5. Move to Frame 5 and add a Keyframe. In the Properties panel, reduce the opacity of the star to 10%. (Color Effect - Style - Alpha)

  6. Move to Frame 10 and add a Keyframe. Set the Alpha back to 100%.

  7. Click Control - Test Movie - In Flash Professional.

    You should see your star blink repeatedly.

    Now we need to grab the in betweens.

  8. Go to Frame 1 and click File - Export - Export Image. Choose the png format and name the file "Frame 1". Accept the default png export options.

  9. Repeat this for each of the 10 frames.

Note: Frames 1 - 5 are identical to Frames 6 - 10 (except in reverse). To save time, we could have exported the first 5 frames of the Tween and duplicated them in Photoshop, naming them Frame 6 - 10 in reverse order. I worked with all 10 frames in the example for teaching purposes.

Join us in the Digital Art and Design forum. | Join us in the Flash forum.

Add Using+Flash+for+In+Betweens to Twitter Add Using+Flash+for+In+Betweens to Facebook Add Using+Flash+for+In+Betweens to MySpace Add Using+Flash+for+In+Betweens to Del.icio.us Digg Using+Flash+for+In+Betweens Add Using+Flash+for+In+Betweens to Yahoo My Web Add Using+Flash+for+In+Betweens to Google Bookmarks Add Using+Flash+for+In+Betweens to Stumbleupon Add Using+Flash+for+In+Betweens 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 © 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
Animation Software Terms

Why Hype 3.5 and Pro

Tumult Hype and Pro Intro

Archives | Site Map


Past Issues

Less than Monthly

BellaOnline on Facebook

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

BellaOnline Editor