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
Bible Basics
Houseplants
Romance Movies
Creativity
Family Travel
Southwest USA
Irish Culture


dailyclick
All times in EST

Full Schedule
g
g Flash and Animation Site

BellaOnline's Flash and Animation Editor

g

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 Del.icio.us 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


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
Animate Lower Third in Motion 5

Drop Zone and Lower Third in Motion 5

Add Static Text To Craft Product Trailer Template

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