Toxiclab.org

Photo animation with sound

15.1.2009, 20:54
Submited in: Flash | Total Views: 18114

Using this thoroughly explained, detailed flash lesson, you will see how to create modern photo animation with sound. You don't have to use action script code to make this lesson. Using this lesson, you will also learn how to import any sound file into a flash library and flash stage, how to convert any photo into a Movie Clipy Symbol, how to apply Advanced Color settings on it and much more. Let's start!

>

Step 1

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





Step 2


Call the current layer background. Double-click on its default name (Layer 1) to change it. Press Enter once you have typed in the new name!

Step 3

Take the Rectangle Tool (R). In the Colors portion of the Tool panel, block the Stroke color by clicking on the little pencil icon and then on the small square with the red diagonal line. For Fill color choose white and draw a rectangle shape about 3x3 px like it is shown on the picture below!



Step 4

While the rectangle shape is still selected, press again F8 key (Convert to Symbol) to convert it into a Movie Clip Symbol.



Step 5

While the new made Movie Clip (rectangle) 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 6

Select now the Free Transform Tool (Q) and make the following:



Step 7

Click now on frame 7 and press F6 key. While you're still on frame 7, select agin the Free Transform Tool (Q) and make the following:



Step 8

Click now on frame 20 and press F6 key.

Step 9

While you're still on frame 20, select again the Free Transform Tool (Q) and make the following:



Now, you get this:



Step 10

Click now on frame 17 and press F6 key. Afte that, take again the Free Transform Tool (Q), press and hold down Shift key and do like it is shown on the picture below!



Step 11

Select now frame 35 and press F6 key. After that take again the Free Transform Tool (Q), press and hold down Shift key and do like it is shown on the picture below!



Step 12

Select now background layer and go to the Properties Panel (Ctrl+F3) below the stage. On the left side, you will see Tween drop down menu. Select Motion on it!



Step 13

Select now the first frame, and go again to the Properties Panel (Ctrl+F3). Then, choose the following options:



Repeat this process also for frame 15 and 20

Step 14

Save now the picture below!



Step 15

Create a new layer above the layer background and name it photo.

Step 16

Select now frame 34 and press F6 key on the keyboard.

Step 17

While you're still on frame 34 Choose File > Import > Import to Stage (Ctrl+R) and import the photo into a flash stage.

Step 18

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



Step 19

Repeat now step 5.

Step 20

Select now frame 45 and press F6 key.

Step 21

Go back now on frame 34, Select the Selection Tool (V) and click once on the photo to select it. Then, go to the Properties Panel (Ctrl+F3) below the stage. On the right, you will see the Color menu. Select Advanced in it, click on Settings button and make the adjustments as follow:



Step 22

Select again frame 34 and after that, repeat step 14!

Step 23

Right-click anywhere on the gray area between the two keyframes on the timeline and choose Create Motion Tween from the menu that appear.



Step 24

Create now a new layer above the layer photo and name it sound. It's time for sound, so download first my example file (fla) at the end of tutorial and open it into a flash. After that, open my flash library (Ctrl+L), find my sound file, select it and press Ctrl+C key (Copy). After that, go back on the flash stage of lesson, select sound layer and press Ctrl+V key (Paste).

We're down now!

Test your Movie and enjoy!

Download example

Are you a website owner?
Click here to register and submit your tutorials!

Browse by category


Most popular tutorials