This lesson will teach you how to create on a simple way very attractive animation using a picture of Bmw 3 series.You don’t have to use action script code to make this lesson. You will also learn how to apply flash filters on any picture, object… You can use this animation for any flash banner, header, picture presentation… Let’s go!

Step 1
First of all, save my picture of Bmw 3 seriese which we will use for this tutorial.

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 color as background color.Set your Flash movie’s frame rate to 33 and click ok. See the picture below.

Step 3
Choose File > Import > Import to Stage (Shortcut key: Ctrl+R) and Import my picture into a flash stage.
Step 4
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 a picture with the background.
Step 5
While the picture is still selected, press F8 key (Convert to Symbol) to convert this picture into a Movie Clip Symbol.

Step 6
Click on frame 15 and press F6 key. After that, while you’re still on frame 15, take the Selection Tool (V) and click once on the picture to select it. Then, go to the to the Properties Panel below the stage. On the right, you will see the Color menu. Select Alpha in it and put it down to 23%.

After that, Select Filters tab from the left side. Click after that on the plus icon and select the Blur filter. Make the adjustments as follows:
1. Blur X and Y : 12
2. Quality : Low

Step 7
Go back on the first frame, select the picture again using the Selection Tool (V) and go again to the Properties Panel (Ctrl+F3). On the right, you will see again the Color menu. Select Alpha in it and put it down to 0%.

Step 8
Choose right-click anywhere on the gray area between the frame 1 frame 15 on the timeline and choose Create Motion Tween from the menu that appears.See the picture below.

Step 9
Select again frame 15 and press F6 key then times. See the picture below.

Step 10
Go back on frame 16, and using the mouse, or by arrows key move the picture a little up. After that, select frame 17, and move it a little down. Then, select frame 18 and move it a little right. After that, select frame 19 and move the picture a little left. Then, select frame 20 and using the Free Transform Tool (Q) rotate the picture a little on the right side. See the picture below.

Select aftera that frame 21 and rotate it a little on the left side.

Step 11
Select frame 22 and move the picture again a little up. After that, select frame 23 and move it a little left. Then ,select frame 24 and move it a little right.
Step 12
Click on frame 30 and press F6 key. After that, while you’re still on frame 30, take the Selection Tool (V) and click once on the picture to select it. Then, go again to the Properties Panel (Ctrl+F3). On the right, you will see again the Color menu. Select Alpha in it and put it down to 48%.

Then, select again Filters tab from the left side. Click after that on the plus icon and select the Blur filter. Make the adjustments as follows:
1. Blur X and Y : 10
2. Quality : Medium

Step 13
Choose right-click anywhere on the gray area between the frame 25 frame 30 on the timeline and choose Create Motion Tween from the menu that appears.
Step 14
Select frame 30 and press F6 key five times.

Step 15
Go back on frame 31 and move the picture a little up. After that, select frame 32 and move the picture a little right. Then, select frame 33 and usign the Free Transform Tool (Q) rotate it a little right. Select after that frame 34 and move the picture a little left.
Step 16
Click on frame 45 and press F6 key. Afte that, take the Selection Tool (V) and click once on the picture to select it. Then, go again to the Properties Panel (Ctrl+F3). On the right, you will see again the Color menu. Select Alpha in it and put it down to 78%.

Then, select again Filters tab from the left side. Click after that on the plus icon and select the Blur filter. Make the adjustments as follows:
1. Blur X and Y : 5
2. Quality : Medium

Step 17
Choose right-click anywhere on the gray area between the frame 35 frame 45 on the timeline and choose Create Motion Tween from the menu that appears.

While you’re still on frame 45, press F6 key again five times.
Step 18
Go back on frame 46 and rotate the picture a little on the right side using the Free Transform Tool (Q). After that, move it also a little on the left side. Select frame 47 and move the picture a little up. Select after that frame 48 and move the picture a little right. Then, select frame 49 and move the picture a little down.
Step 19
Click on frame 60 and press F6 key. After that, take again the Selection Tool (V) and click once on the picture to select it. Then, go again to the Properties Panel (Ctrl+F3). On the right, you will see again the Color menu. Select Alpha in it and put it down to 100%.

After that, select again Filters tab from the left side. Click after that on the plus icon and select the Blur filter. Make the adjustments as follows:
1. Blur X and Y : 0
2. Quality : Medium

Step 20
Click on frame 100 and press F6 key.
Test your animation (Ctrl+Enter).
We’re done!
Download example

::GFXZoOM|source:toxiclab.org::

See this tutorial and learn how to rotate letters in series using some special flash tricks. You don’t have to use action script code to make this lesson.This tutorail is very simple to create but in the same time, you can use it for some text effect, banner, text animation…

Step 1
Create a new flash document.
Step 2
Press Ctrl+J key on the keyboard (Document Properties) and set your dimensions as whatever you like. Select any color as background color.Set your Flash movie’s frame rate to 28 and click ok.

Step 3
Take the Text Tool (A) and type any text on the stage. For this example I have typed “flashfridge”.

Step 4
While the text is still selected, press Ctrl+B key (Break Apart) to break apart it. See the picture below.

After that, choose Modify > Timeline > Distribute to Layers (Ctrl+Shift+D). Now you get this:

Step 5
Take the Selection Tool (V) and click on frame 5 of layer of the first letter and press F6 key. In my example that is letter “f”. See the picture below.

Step 6
Take the Selection Tool (V) again and click once on the first frame.Then, go to the Properties Panel (Ctrl+F3). On the Left side for Tween drop down menu choose Motion, for Ease set 0 and for Rotate choose CW. See the picture below.


Step 7
Click on frame 3 of layer of the second letter, in my example that is letter “l”, and press F6 key. After that, click on frame 8 and press again F6 key.

Step 8
Go back on the frame 3, and go again to the Properties Panel (Ctrl+F3).Then, repeat step 6. See the picture below.

Step 9
Click on frame 8 of layer of the first letter and press F5 key.

We’re done with the first two letters. Repeat this process also for every other letters in text. Finally you have to get this:

Have a nice day!
Download source file (.fla)

::GFXZoOM::source:flashfridge.com::

Flash has created an era of Highly interactive and eye catching wedesign techniques.Of course the design of the web site also plays and important role in its promotion.Here we are going to create a glossy round button in flash..

• Open a new flash document by pressing Control + N.
• In the first frame of layer one draw a circle with the oval tool .You can adjust the width and height of the circle so that its uniform.as shown in the figure

• Double click on the circle so as to select it as a whole.
• Now open Color mixer panel (shift + F9) and select the fill option as linear
• Set the left side color to 0×0000FF and right side color to )x00FFFF as shown in the figure

• Select the fill transform tool from the tools panel.

• Click on the circle and transform the fill colors as shown in the figure

• Now rotate the mouse so that filled colors get transformed like this

• Now press F8 and covert it in to a button.Now we are in the button edit mode.

• Add a new layer to the movie by Selecting Insert >>Timeline>>New layer.
• Using the oval tool draw an oval shape in the top layer that we have created just now. the shape for creating the glossiness as seen in the button
• The oval shape must be smaller than the circle .

• Drag it over the circle shape
• Now select the shape by double click and go to the color mixer panel

• Reduce the alpha on right side to 0.
• Now select the fill transform tool and click over the oval shape
• Transform the filled colors so as to get the image as shown.

• Click on the layer below i.e. the circle layer and insert a new layer above it by selecting Insert >>Timeline>>New layer
• Using the text tool type in the text for your button I have written “GO” .

• Select the top layer and click on the 4th frame i.e. the “Release” frame and press F5
• Do the same in the lowest layer and middle layers also.
• Now select the middle layer containing the text..Click on the second frame i.e. the ” over” frame of button and press F6
• Press Control + T to open the transform tool .
• Increase the height and width % to 105 and press Enter.
• Go back to the main timeline and your glossy button is ready

So enough for the introduction, here you can see how to make a gear in flash, then animate it so it rotates, make a couple of copies and the result might seem a bit hypnotic as I think it did.

Start by making an oval on the stage as shown below, then make 4 more ovals, smaller and place them as shown below.

Select all the four small ovals, make a copy and rotate it so we now a 8 following around the big oval shape.

Now if you delete all the small ovals, your shape should look like below.

One last thing to do with the shape is to make on big hole in the middle using the same method as before.

Right click your new gear shape and convert it to a movie clip.

In the timeline make a new keyframe at frame 10, right click between frame 1 and 10, choose motion tween.

Go to the properties panel and change the rotation from auto (default) to CW (clock wise).

Once again right click your shape and convert it to a movie clip, (so we have an movie clip animation in a movie clip).

Make a copy of your gear, double click it and go to the properties, change the rotation from CW to CCW.

That last thing I did was make a lot of copies, placing them next to each other, testing and testing, so they rotate in oppisit direction to make it look right.

If you have a hard time making it work, here is the Flash project file to help you get the gear rotation working.

::GFXZoOM |source:blog.0tutor.com::

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!

Preview

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.
#advertising#
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!

Download example

.:GFXZoOM|source: toxiclab.org::.