In the last tutorial, we prepared the raster graphics for the palm tree animation. We selected each palm from the background image and placed each palm on its own layer in preparation for our Flash^R animation.

Our next step will be to align the palms in place over the background layer in the Photoshop image file. We will have the background layer which we will call "base" and seven palms. Three palms on the right are labeled rt1, rt2 and rt3. On the left, we have palms lt1, lt2, lt3 and lt4. Because the palms are already aligned in their positions over the background layer, when we import this Photoshop file into Flash, their positions will be maintained.

In our Flash project, we will start a new movie clip (Insert - New Symbol). This will take us to the edit mode and a blank Timeline for the movie clip. We will import the Photoshop image directly into this empty Timeline (File - Import - Import to Stage). As you can see, Flash automatically placed each palm and the background (base) graphic on their own layer and labeled these layers with the same names that we gave them in Photoshop.

All this preparation has led us to this point where we will animate each palm with a Motion Tween. If you studied any videos of palm trees, you will notice that the wind pushes each palm progressively in one direction. Therefore if we were to assume that the wind was coming from the right of the stage, we will need to animate the palms on the right of the tree before we animate the left palms. In the same way, we would animated the outside palms before the inside palms because they would be pushed by the wind first.

As you can see, the Motion Tweens on the Timeline will move each palm in succession, 1 through 3 (on the right) and 4 through 7 (on the left). Palms 1 through 3, the right palms will move slightly downward and to the left. But for the palms on the right, the wind will push them upward and to the right.

We will begin the Motion tween for palm no. 1 and then pause a few frames before we start the tween for palm no. 2, and so on. Each Motion tween will have a duration of about 60 frames. But in nature, the palms on the left will not remain stationary while the palms on the right are moving. So let's start the sequence for moving palms 4 through 7 only slightly after the first palm begins to move. So we will have palms on both sides of the three moving at the same time but with a little delay on the left.

Once the last palm (no. 7) has moved in the wind, we can begin to bring the palms back to their original positions, just as they would do in nature. If you study the way tree branches move in the wind, you will notice that sometimes they have a slight rebound motion when their branches move back into place, after the wind has stopped. One last touch will be to add this slight rebound action to the palms. As we move them back to their original positions, we will move them slightly beyond that point and then finally back to the original position.

← Back

View Finished Ecard at Pamela Gladding Ecards

Copyright 2018 Adobe Systems Incorporated. All rights reserved. Adobe product screen shot(s) reprinted with permission from Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst and Flash Paper is/are either [a] registered trademark[s] or a trademark[s] of Adobe Systems Incorporated in the United States and/or other countries.