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

Low Carb: 8:00 PM

Full Schedule
g Flash and Animation Site

BellaOnline's Flash and Animation Editor


Synchronize Flash Motion Tweens

In this FlashR tutorial, you will learn how to synchronize several Motion Tween fade transitions. We have been building a Flash slideshow template that contains four placeholder images. At this point, we have added a Motion Tween with a fade-in transition and a fade-out transition to the first image. Now we are ready to build the tweens for the other three placeholder images.

The fade transition is a very common transition used in TV and video. If you look at it closely, you will see that as one image is fading out, another is fading in. We can synchronize this effect by overlapping the transitions.

Let's start building our next animation for image2.

  1. As we did in the last tutorial, we need to convert image2 to a movie clip named "image2".

    We will start the animation for image2 on Frame 70 and end on Frame 150. It may be helpful to turn off the visibility of the image1 layer.

  2. Select Frame 1 of the image2 layer. Hold down the F5 key on your keyboard which will add empty frames after Frame 1 and push the frame that contains the image2 movie clip forward. Stop when the frame containing the image2 movie clip reaches Frame 70.

  3. On this Frame 70, right-click and create a Motion Tween. Drag the Tween span to Frame 150.

  4. Add a Keyframe to Frame 80, 140 and 150.

  5. In the Properties panel, set the Alpha to 0 for Frames 70 and 150. Set the Alpha to 100 for Frames 80 and 140.

    As you can see, we have overlapped the fade transitions for the two image. As image1 fades out over Frames 70 to 80, image2 fades in.

  6. For image3, we will begin the animation on Frame 140 and end on 210. We will overlap the fade transitions over Frames 140 to 150 and add a fade out transition for Frame 200 to 210.

  7. For image4, we will begin the animation on Frame 200 and end on Frame 280. We will overlap the fade transitions over Frame 200 to 210 and add a fade out transition for Frame 270 to 280.

Now we come to a little problem. We have image4 fading out on the last 10 frames and then the animation goes back to Frame 2 and image1 will fade in over 9 frames. These two transitions combined to span over 19 frames and never really overlap. This will cause the stage to become completely white at the end of the animation. We will fix this in the next tutorial.

Join us in the Digital Art and Design forum.

Add Synchronize+Flash+Motion+Tweens to Twitter Add Synchronize+Flash+Motion+Tweens to Facebook Add Synchronize+Flash+Motion+Tweens to MySpace Add Synchronize+Flash+Motion+Tweens to Digg Synchronize+Flash+Motion+Tweens Add Synchronize+Flash+Motion+Tweens to Yahoo My Web Add Synchronize+Flash+Motion+Tweens to Google Bookmarks Add Synchronize+Flash+Motion+Tweens to Stumbleupon Add Synchronize+Flash+Motion+Tweens 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