XtremeSkill.com

Browse XTREME

Browse Tutorials

Friends

Surreal GFX.com

GrandWallpapers.com

FinalPrestige.net

picture playing flash tutorial

This, step by step flash lesson will show you how to create cool and practical photo animation. You can use this animation for any flash header and banner. You don't have to use action script code to make this lesson! Using this lesson, you will also learn how to import any picture into a flash stage, how to convert it into a Movie Clip Symbol, how to animate it using a Free Transform Tool (Q) and much more!

Step 1

First of all, save a picture below!

Step 2

Create a new flash document. Press Ctrl+J key on the keyboard (Document Properties) and set the width of your document to 400 pixels and the height to 300 pixels. Select white as background color. Set your Flash movie's frame rate to 22 and click ok.

Step 3

While the picture 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 4

While the picture is still selected, press F8 key (Convert to Symbol) to convert this picture into a Movie Clip Symbol.

Step 5

Click now on frame 5, 10 and 15 and press F6 key.

Step 6

Go back now on the first frame, take the Free Transform Tool (Q) and do like it is shown on the picture below!

Step 7

Then, place that shape of picture, on the position like it is shown on the picture below!

Step 8

Select now frame 1 and press Ctrl+C key (Copy). After that, select frame 5 and press delete key on the keyboard. Then, while you're still on frame 5, press Ctrl+Shift+V key (Paste in place).

Step 9

After that, place that shape of picture on the position like it is shown on the picture below!

Step 10

Select now frame 10, take again the Free Transform Tool (Q) and do like it is shown on the picture below!

Step 11

After that, palce that shape of picture on the position like it is shown on the picture below!

Step 12

Right-click anywhere on the gray area between frame 1 and 5, frame 5 and 10 and frame 10 and 15 on the timeline and choose Create Motion Tween from the menu that appears. See the picture below!

Step 13

Click now on frame 65 and 70 and press F6 key. While you're still on frame 70, take the Selection Tool (V) and click once on the picture to select it. After that, go 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 14

Right-click again anywhere on the gray area between frame 65 and 70 on the timeline and choose Create Motion Tween from the menu that appears. See the picture below!

Now, we're done!

Test your Movie and enjoy!

Download source file (.fla)