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

Full Schedule
g Flash and Animation Site

BellaOnline's Flash and Animation Editor


Create a Simple Motion Tween Animation within a Movie Clip in Flash CS3

In this FlashR CS3 tutorial, we will create a simple Motion Tween animation with a graphic that we will import as a Movie Clip. Because we want this animation to play continuously, we will place the Movie Clip on Frame 1 on the Timeline for our main movie. The sample website that I am using for this tutorial is my personal website that I am updating. Although you will not be working on the same project as my website, these steps can be applied to any project that needs a simple Motion Tween animation applied to a Movie Clip symbol.

I started with a "Wizzy Room" graphic that I placed on the bottom layer of the main Timeline which I renamed "background". Because this Wizzy Room graphic is so full of images, it would be difficult for the visitor to know which areas of the website are clickable without a little help. The purpose of the Motion Tween animation that we will be creating is to draw attention to a clickable area that will work as an email link to open an email message window. We will create the clickable button area in the next tutorial. For now, we will be creating the underlining Tween animation.

For this Motion Tween animation, we need a small graphic that looks like an envelope. I used the Custom Shape tool (Shape Envelope 1) in PhotoshopR to create the envelope on a transparent layer. We will maintain the transparent layer as we import this small graphic into our Flash movie. Then we will be ready to animate it to appear as a screensaver animation for the computer on the desk in the Wizzy Room.

  1. We will import our envelope as a Movie Clip. I still have only one frame in the Timeline for the main movie of my website. From the Menubar, click File, Import, Import to Stage.

  2. In the left box of the Import to Stage dialog box, click on Layer 1 and rename it to "email". You should now see the options for this layer to the right. We will be animating this graphic, so we will import the layer as a Movie Clip. First, click the radio button next to Bitmap image with editable layer styles. Next, give this Movie Clip an Instance name of "my_email". Keep the other default settings and click OK.

  3. You will find the small envelope graphic at the top left of the Stage. Use the Selection tool to drag the envelope to a position on top of the computer screen. As you do this, the Properties Inspector will display the settings for this Movie Clip. You can see that it is a Movie Clip symbol with an instance name of "my_email". Also, you will see that you have a new layer, named "email", in the main Timeline.
Next →

Add Create+a+Simple+Motion+Tween+Animation+within+a+Movie+Clip+in+Flash+CS3 to Twitter Add Create+a+Simple+Motion+Tween+Animation+within+a+Movie+Clip+in+Flash+CS3 to Facebook Add Create+a+Simple+Motion+Tween+Animation+within+a+Movie+Clip+in+Flash+CS3 to MySpace Add Create+a+Simple+Motion+Tween+Animation+within+a+Movie+Clip+in+Flash+CS3 to Del.icio.us Digg Create+a+Simple+Motion+Tween+Animation+within+a+Movie+Clip+in+Flash+CS3 Add Create+a+Simple+Motion+Tween+Animation+within+a+Movie+Clip+in+Flash+CS3 to Yahoo My Web Add Create+a+Simple+Motion+Tween+Animation+within+a+Movie+Clip+in+Flash+CS3 to Google Bookmarks Add Create+a+Simple+Motion+Tween+Animation+within+a+Movie+Clip+in+Flash+CS3 to Stumbleupon Add Create+a+Simple+Motion+Tween+Animation+within+a+Movie+Clip+in+Flash+CS3 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