Simple photo transformation

In this tutorial you will see how to create simple photo transformation. To create this tutorial, you don’t have to use action script code. You can use this transformation for any flash banner, photo presentation...



Step 1

Open a new flash document.



Step 2

Select Modify > Document (shortcut key: Ctrl+J ). Set the width of your document to 350 pixels and the height to 250 pixels. Select white as background color and click ok. Set your Flash movie’s frame rate to 38 and click ok.



Step 3

Save my picture below to quickly create this tutorial.



Step 4

Choose File > Import > Import to Stage (Shortcut key: Ctrl+R) to import my picture into a flash.

Step 5

While the picture is still selected, go to the Align Panel (Shortcut key: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

After that, while the picture is still selected, choose Modify > Break Apart (Shortcut key: Ctrl+B) to break apart this picture.



Step 7

Click on frame 20 and press F6 key. After that, take the Selection Tool (V) and do the following:



Step 8

After that, click on frame 40 and press F6 key. Then, do this:



Step 9

Than, click on frame 50, press F6 key and do this:



Step 10

Click on frame 60, press F6 key and do the following:



Step 11

Click on frame 70 and press F6 again. Then, Select the picture and go again to the Align Panel (Shortcut key:Ctrl+K). Then, repeat step 5.

Step 12

Select layer 1 and go to the Properties Panel (Ctrl+F3) below the stage. Then, for Tween choose Shape.





Step 13

Click on frame 71 and press F6 key. After that, while the picture is still selected, press F8 key (Convert to Symbol) to convert this picture into a Movie Clip Symbol.



Step 14

Click on frame 80 and press F6 key.

Step 15

Go back on frame 71 and go again to the Properties Panel (Ctrl+F3) below the stage. Then, for Tween choose Motion and for Rotate Cw. See the picture below.



We’re done!

Enjoy!

Download example