logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
European Travel
Action Movies
Bible Basics
Houseplants
Romance Movies
Creativity
Family Travel


dailyclick
All times in EST

Low Carb: 8:00 PM

Full Schedule
g
g Flash and Animation Site

BellaOnline's Flash and Animation Editor

g

Flash Thanksgiving Animation


In this tutorial, we will create a simple text effect Tween using FlashR Motion Presets for a Thanksgiving project. If you have been following along with the Digital Art tutorials, you will have already created the background image for this project. If not, use the link at the bottom of the page to read that tutorial.

The first step is to merge all the layers in our PhotoshopR image. As mentioned in the tutorial, we needed each leaf on it's own layer when we created the background image. However, now that we are ready to use it as a background image for our Flash animation, we can merge all the layers into that one background layer.

  1. Open your background image into Photoshop. From the Menubar, click Layer Flatten Image. Now, we can save this version of our image in the default psd format. In order to keep the layered version intact, we need to save this flatten version with a new name. Let's call it ThanksgivingFlattened.psd.

  2. Start a new project in Flash CS4. Rename Layer 1 to "Background".

  3. We can import our flattened image into our Flash project. Click File Import Import to Stage. Browse to your ThanksgivingFlattened.psd and choose that as your import image. It should appear on the Flash stage.

    Because we made the background image the same width and height as the default Flash stage, it will automatically be centered in position on the stage and ready to go.

  4. Add a new layer to the Timeline and name it "Happy Thanksgiving". This will hold the preset motion tween for our "Happy Thanksgiving" text.

  5. Click on the stage with the Text tool and add our text in the text box. In the Properties panel, you can change the font, style, size and color of the text. In the example, I kept the Times New Roman text but set the size to 35pt. I also set the Anti-alias for animation and changed the color to a dark red (#BD2226).

  6. With the text still selected, click Window Motion Presets to open that panel. In this panel we have several presets in the Default Presets folder. Experiment with each preset to see which one you wish to use in your animation. In the example, I used the "Multiple-bounce" preset.

    There is one important thing to remember when working with Motion Presets. The preset will be applied to the object (our text) as it appears in the first frame of the preset animation. At this point, our text is centered on the stage. In the Multiple-bounce preset, the text will drop a little and bounce a few times. But, if I apply the preset to the text at the current position, the text will not be visible when it drops. It will drop off the bottom of the stage and we will not be able to see it bounce. Therefore, I need to place the text at the top or above the stage. This way, it will drop down and bounce at the center of the stage. This is the effect we want. If you are using a different preset, you will want to decide where the text should be at the start of your animation.

  7. Select the text and drag it to just above the stage. To apply a preset to your text, select the preset of your choice and click the Apply button.

    Each preset is a motion tween with a set number of frames that will be added to the Happy Thanksgiving layer.

  8. Before we test our animation, we need to extend the Background layer to the end of the preset tween. In the example, that is Frame 75. Right click on this frame on the Background layer and Insert a Frame. Now we can click Control Test Movie to preview our animation so far.

In the next tutorial, we will refine this animation and add a second preset to finish our project. At this point, save your project in the default .fla format.

Next →


Join us in the Flash forum.




Add Flash+Thanksgiving+Animation to Twitter Add Flash+Thanksgiving+Animation to Facebook Add Flash+Thanksgiving+Animation to MySpace Add Flash+Thanksgiving+Animation to Del.icio.us Digg Flash+Thanksgiving+Animation Add Flash+Thanksgiving+Animation to Yahoo My Web Add Flash+Thanksgiving+Animation to Google Bookmarks Add Flash+Thanksgiving+Animation to Stumbleupon Add Flash+Thanksgiving+Animation 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


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2014 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


g features
Motion Workspace - Checkbox, Dials and More

Motion Workspace - Menu, Icons and Sliders

The Motion Toolbar Tools

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


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


BellaOnline Editor