Shining black and white image animation

Date: 12.10.2007, 1:52    Total views: 35235

In this easy Flash lesson, I will show you how to create very practical and trendy shining image animation. To make this lesson, You have to use black and white image and adjust color filter. You don't have to use action script code to make this lesson. You can use this lesson for any presentation, for some flash banner, animation, header...



Example:



Step 1

First of all, donwload my image to make this tutorial quickly.



Step 2

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



Step 3

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

Step 4

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



Step 5

After that, while the new made Movie Clip (image) is still selected, go to the Info Panel (Ctrl+I) and for Width set 250px and for Height 300px, the dimensions as background.See the picture below.



Step 6

Then, while the image 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.



Now you have aligned a photo with the background.

Step 7

Double click on layer 1 to rename its name in image.

Step 8

Click on frame 15 and press F6 key. Then, enlarge the image a little using the Free Transform Tool (Q). After that, take the Selection Tool (V) and click once on the image. Then, go to the Properties Panel (Ctrl+F3) below the stage and click on Filters tab. After that, click on the plus icon and select Adjust Color filter. Then, make the adjustements as follows:



Step 9

Click on frame 25 and press F6 key. Then, enlarge the image again a little using the Free Transform Tool (Q) and move it a little down, using the arrows key or by mouse.

Step 10

Take again the Selection Tool (V) and click again once on the image. Then, go again to the Properties Panel (Ctrl+F3) below the stage and for Adjust Color filter, make the adjustements as follows:

1.Brightness: 6
2.Contrast : 44
3.Saturation:-9
4.Hue:30

Step 11

Click on frame 35 and press F6 key. Then, move the image a little up using the arrows key or by mouse.

Step 12

Click again once on the picture with the Selection Tool and in the Properties Panel for Adjust Color filter, make the adjustements as follows:

1.Brightness: -13
2.Contrast : 26
3.Saturation:-9
4.Hue:30

Step 13

Click on frame 55 and press F7 key (Blank keyframe). Then, go back on the first frame and press Ctrl+C key (Copy). After that, select again frame 55 and press Ctrl+Shift+V key (Paste in Place).

Step 14

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



We're done with animation!

Have a nice day!

Download source file (.fla)