In this tutorial, you will see how to create on a simple way, very cool and attractive photo animation. You can use this animation as banner, some presentation... You don't have to use action script code to make this tutorial. To make this tutorial you just have to use some special flash tips and tricks. Let's go!



Step 1

First of all, save my pictures below which we will use for this tutorial.







Step 2

Press Ctrl+J key on the keyboard (Document Properties) and set the width of your document to 320 pixels and the height to 232 pixels. Select white color as background color.Set your Flash movie's frame rate to 60 and click ok. See the picture below.



Step 3

Choose File > Import > Import to Library. In the file explorer window that appears, find a two photos (photo1 and photo2) and Shift-click to select them.Then click open. If you now open your flash library (Ctrl+L key) you will see a two photos that you just imported. See the picture below.



Step 4

Take the Selection Tool (V), and using the "drag and drop" technique, move the photo 2 (black photo) from the library on the stage. While the photo is still selected, go to the Align Panel (Ctrl+K) and do the following:

1. Make sure that the Align/Distribute to Stage button is turned on,
2. Click on the Align horizontal center button and
3. Click the Align vertical center button.



Step 5

Click after that on frame 15 and press F5 key.

Step 6

Create a new layer above the layer 1 (layer 2). Select the first frame of layer 2 and move the photo 1 from the Library on the stage. After that, while the photo is still selected, repeat step 4.

Step 7

After you have aligned the photo with the background and while the photo is still selected, press F8 key (Convert to Symbol) to convert this photo into a Movie Clip.



Step 8

Then, press F6 key fifteen times. See the picture below.



Step 9

After that, go back on frame 2 and press delete key on the keyboard to delete it. Do this also for frame 4,6,8,10,12 and 14.



Step 10

Go back now on the first frame, take the Selection Tool (V) and click once on the photo to select it. After that, go again to the Properties Panel (Ctrl+F3) below the stage. On the right, you will see the Color menu. Select Alpha in it and put it down to 0%.



Step 11

Select frame 3, take the Selection Tool (V) again and click once on the photo to select it. After that, go again to the Properties Panel (Ctrl+F3) below the stage. On the right, you will see the Color menu. Select Alpha in it and put it down to 18%.



After that, select frame 5 and set alpha to 32%, for frame 7, set alpha to 48%, for frame 9, set alpha to 62%, for frame 11 set alpha to 80%, for frame 13 set alpha to 92% and for frame 15 set alpha to 100%.

Step 12

Go back now on frame 3, take the Free Transform Tool (Q) and enlarge the photo a lot. See the picture below.



Do this also for frame 5 and 9.

We're done!

Download source file (.fla)