Custom Search

Friday, November 30, 2007

Photo Animation in Flash second part

Step 11

After that, while the rectangle that you just created is still selected, go to the Color Mixer Panel (Shoetcut key: Shift+F9) and choose the following options:

1. Click on the paint bucket icon to select the Fill color.
2. Choose Linear as Type.
3. Click on the small color rectangle that is on the left side and set its color to #6188CD. Alpha property set to100 %
4. Click on the small color rectangle that is on the right side and set its color to #BFD5EA Alpha property set to100 %.
5. Create a new small color rectangle and place it on the ceneter of color scale. Then, set its color to #FFFFFF. Alpha property set to 100 %.



Now, you have this:



Step 12

Click on frame 10 of layer animation and press F6 key. Then, Take the Free Transform Tool (Q) press and hold down Alt+Shift key and do the follwing:



Step 13

Go back on the first frame of layer animation and go again to the Properties Panel (Ctrl+F3) below the stage. On the left side, you will see Tween drop down menu. Choose shape on it. See the picture below.



Step 14

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



Step 15

Click on frame 15 and press F6 key. After that, take the Selection Tool (V) and click once on the rectangle to select it. Then, go to the Properties Panel (Ctrl+F3) below the stage. On the right, you will see the Color menu. Select Birghtenss in it and put it down to 44%.See the picture below.



Step 16

Click on frame 20 and press again F6 key. Then, take again the Selection Tool (V) and click once on the rectangle to select it again. Then, 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 84%.



Step 17

Click on frame 25 and press F6 key. Then, repeat the previous step, but for this time, put the Alpha down to 62%.



Step 18

Click on frame 35 and press again F6 key.After that, repeat again the previous step, but for this time put the Alpha down to 0%. See the picture below.



Step 19

Choose right-click anywhere on the gray area between the frame 11 and 15 frame 15 and 20, frame 20 and 25 and frame 25 an 35 on the timeline and choose Create Motion Tween from the menu that appears.See the picture below.



Test your Movie (Ctrl+Enter).

This is how it looks the hole animation:

Thursday, November 29, 2007

Photo Animation in Flash

Step 1

First of all, downlaod my photo, which we will be use for this lesson to make it quickly.



Step 2

Open a new flash document. Select Modify > Document (shortcut key: Ctrl+J ). Set the width of your document to 426 pixels and the height to 447 pixels. Select any color as background color and set your Flash movie's frame rate to 28 fps. Then, click ok.



Step 3

Choose File > Import > Import to Stage and Import my photo into a flash.

Step 4

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.



Now you have aligned the photo with the background.

Step 5

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



Step 6

After that, click on frame 20,25 and press F6 key, and then, click on frame 90 and press F5 key. See the picture below.

Step 7

Go back on frame 20, take the Selection Tool (V) and click once on the picture 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 Advanced in it, click on Settings button and make the adjustments as follows:



Step 8

Right-click anywhere on the gray area between the frame 20 and frame 25 on the timeline and choose Create Motion Tween from the menu that appears.



Step 9

Double click on layer 1 to rename its name in photo. After that, create a new layer above the photo layer and name it animation.

Step 10

Lock photo layer, select the animation layer and take Rectangle Tool (R). Then, block the Stroke Color, for fill color choose any color and draw a rectangle about 426x447px. While the rectangle is still selected, repeat step 4.

The next steps will be posted in the next post tomorrow

Tuesday, November 27, 2007

In this easy, detailed lesson, you will see how to create on a simple way picture animation using the Brush Tool and mask. To make this lesson, you don't have to use action script code.Let's go!



Step 1

First of all, find any picture that you like to use for this lesson.

Step 2

Open a new flash document.

Step 3

Select Modify > Document (shortcut key: Ctrl+J ). Set the dimensions of your document as the dimensions of picture that you want to use for this lesson.Select any color as background color and set your Flash movie's frame rate to 32 fps. Then, click ok.



Step 4

Choose File > Import > Import to Stage (Ctrl+R) and import any picture into a flash stage.

Step 5

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.



Now you have aligned the picture with the background.

Step 6

Double click on layer 1 to rename its name in picture. After that, click on frame 160 and press F5 key.

Step 7

Create a new layer above the picture layer and name it brush.
Step 8

Lock picture layer and select the brush layer.After that, select the Brush Tool (B) and for Brush size choose the largest. See the picture below.



Step 9

Then, draw a shape beside the picture. See the picture below.



Step 10

Click on frame 20 of layer brush and press F6 key. Then, on the existing shape, draw a new shape over the picture like it is shown on the picture below.



Step 11

Click on frame 40 and draw this shape using the Brush Tool (B).



Step 12

Click on frame 80 and press F6 key. Then, draw this shape over the picture:



Step 13

Click on frame 100 and press F6 key. Then, draw this shape, or better said, continue with picture painting. See the picture below.



Step 14

Click on frame 120 and press F7 key (Blank Keyframe). Then, while you're still on frame 120, take the Rectangle Tool (R). Block the Stroke Color, for Fill color choose any color and draw a rectangle over the picture.



Step 15

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



Step 16

Select brush layer and convert it to a mask by right-clicking on the shape layer and selecting Mask. See the picture below.



Now, you have this:



We're done!

No SmokeAdvertisement Animation

In this tutorial I will explain how to make a no smoke advertisement in flash 8 with no Action Script. You will also learn:

1. How to import an image in Flash,
2. How to convert a bitmap image into a symbol,
3. How to apply a blur effect on the image
4. How to create fade in - fade out text effect and more.

Below is the live Flash example of what you are going to create in this tutorial.



Step 1

Create a new flash document.

Step 2

Choose Modify > Document (Ctrl+J) to open a Document Properties window. Set the movie's width to 324 and movie's height to 194. Set your Flash movie's frame rate to 28 and click ok.

Step 3

Download my image.



Step 4

Go back in Flash. Select File > Import > Import to Stage (shortcut key: Ctrl+R) and import my image.

Step 5

While the picture is still selected, go to the Align Panel (Ctrl+K) and do the following in the Align Panel:

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.



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

Step 6

While the image is still selected, choose Modify > Convert to Symbol (shortcut key: F8 ) to convert this image into a Movie Clip Symbol. See the picture below.



Step 7

Click on frame 30 and after that on frame 60 and press F6 key.

Step 8

While you're still on frame 60, take the Selection Tool (V) and click once on the image (new made Movie Clip) to select. Then, go the Properties Panel (Ctrl+F3) below the stage.

Step 9

Click on the Filters tab in the Properties Panel Click on the plus icon and select the Blur filter. Make the adjustements as follows:

1. Blur X and Y : 8
2. Quality : Medium



Step 10

Right-click anywhere on the gray area between the frame 30 and frame 60 on the timeline and choose Create Motion Tween from the menu that appears.



Step 11

Click on frame 500 and press F6 key.

Step 12

Create a new layer above the image layer and name it shape.

Step 13

Click on frame 30 of shape layer and press F6 key.

Step 14

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 #17283A as color and draw a "rectangle" about 1x30px and place it on the position like it is shown on the picture below.



Step 15

While the rectangle is still selected,choose Modify > Convert to Symbol.In the dialog that appears, do the following:

1. Select Movie clip as Type.
2. Name it shape.
3. Select the middle right little square as the Registration point.
4. Click OK.



Step 16

Click on frame 60 and press F6 key.

Step 17

Take the Free Transform Tool (Q), select the rectangle (new made Movie Clip), press and hold down Alt key and do like it is shown on the picture below.



Step 18

Go back on frame 30, take the Selection Tool (V), click once on the rectangle (Movie Clip) to select it and 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 19

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



Step 20

Click on frame 500 of layer shape and press F5.

Step 21

Create a new layer above the shape layer and name it text.See the picture below.



Step 22

Click on frame 60 of layer text and press F6 key.

Step 23

Take the Text Tool (T), go to the Properties Panel (Ctrl+F3) below the stage and choose the following options:

1. Select a Static Text field.
2. Select a Vedrana font.
3. Choose 14 as font size and bold it.
4. Select white as color.
5. As the rendering option, select Use device fonts.

Icon Animation

See this lesson and learn how to create icon animation in flash 8 with no Action Script.



Step 1

Open a new Flash document.

Step 2

Press Ctrl+J or select Modify > Document to open the Document Properties dialog. Set the width of your document to 250 pixels and the height to 250 pixels. Select white as background color. Set your Flash movie's frame rate to 30 and click ok.

Step 3

Download my icon.



Step 4

Go back in flash and choose File > Import > Import to Stage to import that icon into the flash stage.

Step 5

While the icon 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

While the icon is still selected, press Ctrl+B key on the keyboard to break apart it.



Step 7

Click on frame 45 and press F6 key.

Step 8

Take the Selection Tool (V) and double click on layer 1 to rename its name in icon. After that, create a new layer above layer icon and name it shape.

Step 9

Select shape layer and take the Oval Tool (O). 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 any color and draw a circle above the icon about 300x100px. See the picture below.



Step 10

Click on frame 20 and press F6 key.Then, take the Selection Tool (V), and do like it is shown on the picture below.



Step 11

Click on frame 25 and frame 30 and press F6 key. While you're still on frame 30, take again the Selection Tool (V) and do like it is shown on the picture below.



Step 12

Take the Selection Tool (V), select the shape layer and go to the Properties Panel (Ctrl+F3) below the stage. Then, select Shape from the Tween menu.



Step 13

Select shape layer and convert it to a mask by right-clicking on the shape layer and selecting Mask. See the picture below.



Step 14

Lock shape layer. Click on frame 35 and after that on frame 40 of layer icon and press F6 key.

Step 15

While you're still on frame 40, take the Free Transform Tool (Q),select the icon, press and hold down Shift key and do like it is shown on the picture below.



Step 16

Click on frame 35, go to the Properties Panel below the stage and select Shape from the Tween menu.Do that also for frame 40. See the picture below.



Step 17

Click on frame 70 of layer icon and press F6 key.

Step 18

After that, press Ctrl+C key (Copy). Then, create a new layer above shape layer and name it icon_mc.

Step 19

Clcik on frmae 70 of icon_mc layer and press F6 key. After that, press Ctrl+Shift+V key (Paste in Place).

Step 20

While the icon that you just copied is still selected, press F8 key (Convert to Symbol) to convert this icon into a Movie Clip Symbol. See the picture below.



Step 21

Click on frame 75 and press F6 key

Step 22

While you're still on frame 75, take the Free Transform Tool (Q) and increase the icon a lot. See the picture below.



Step 23

Take the Selection Tool (V) and click once on the icon 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 24

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



We're done!

Test your Movie (Ctrl+Enter)