Scribd
Upload
144 views

Flash Cs3 Animation 3 FX

This document discusses how to animate effects in Flash by creating a simple glowing light bulb animation. It explains how to create a movie clip symbol of a light bulb graphic, apply a glowing filter effect to it, and use motion tweens to animate the strength of the glow over time for a pulsing effect. Additional techniques like copying and pasting frames are covered to smoothly transition the glow effect in and out at the start and end of the animation.

Uploaded by

geongeo
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
144 views

Flash Cs3 Animation 3 FX

This document discusses how to animate effects in Flash by creating a simple glowing light bulb animation. It explains how to create a movie clip symbol of a light bulb graphic, apply a glowing filter effect to it, and use motion tweens to animate the strength of the glow over time for a pulsing effect. Additional techniques like copying and pasting frames are covered to smoothly transition the glow effect in and out at the start and end of the animation.

Uploaded by

geongeo
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 9

Flash CS3 animation basics: Animating effects

In this easy lesson, you will see how to animate effects in Flash. Youll learn how to animate a filter and create a glowing effect and more along the way. The animation that you are going to learn to create can be seen on the web page of this tutorial.

1. Creating a simple movieclip


1.1 Open a new document: choose File > New. Select Flash File (ActionScript 3.0). Click

OK.

1.2 Double-click the fps field below the layers (you can see it in the screenshot below) to access the Document Properties.

Change the speed of your movie (to make your animation more smooth) by typing 24 in the Frame rate field. Click OK. This will speed up your movie to a decent level for a nice
www.FlashExplained.com

animation.

1.3 Select the Oval tool (O).

Set the options for it as follows:

Turn off the stroke (outline) color. Choose some shade of red for the fill color (you will make something similar to a red

alarm light). Check that the Object Drawing option is turned off and let it stay that way (its next to the litle magnet icon).

1.4 Hold down Shift on your keyboard, click and start dragging with the Oval tool to make a circle. Make it about 100 by 100 pixels. Remember that holding down Shift enables you to make a circle right away, and not an oval.

www.FlashExplained.com

1.5 Youll now use the Oval tool (O) again, but to draw an outline of a circle only. With the tool still selected, go to the Properites Inspector below the stage and block the fill color. Select white for the outline color, with a thickness of 4.

1.6 Draw a circle smaller than the previous one. Do it outside the stage, because you are using white to see what you are doing.

1.7 Choose the Selection tool (V). You will cut out 3/4 of the outline circle now. Select the lower half of it by clicking outside it with the Selection tool, dragging and releasing once youve encompassed the desired area. Press Delete or Backspace to erase the selected part.

www.FlashExplained.com

1.8 Repeat the same thing for the right quarter of the circle.

1.9 Select the remaining line by clicking on it with the Selection tool (V). Move it over the red circle so that it appears as a sort of shine on it. You can move it by pressing and holding down Shift on your keyboard and using the arrow keys to move it around. For more precise movement, release Shift and use the arrows only.

1.10 Select the whole drawing now.

1.11 Select Modify > Convert to Symbol. Name your new movieclip bulb. Select movieclip as type, of course. Click OK.

And now save your work before proceeding to the second part (File > Save)!

www.FlashExplained.com

2. Applying effects to a movieclip and animating them


To be able to animate effects like blur, glow and others in Flash, you have to use the motion tween animation technique one of the basic ways to set things in motion in Flash. So, before actually using the effects, you have to create an animation first, by adding a new keyframe and making some modifications. Let me show you how it is easy!
2.1 Right-click on frame 20 of the first and only layer and select Insert Keyframe.

You will see that the new keyframe you have just inserted is displayed in the Properties Inspector.

This is because when you insert a new keyframe in a layer, it becomes selected automatically. But you need to have your movieclip selected. So
2.2 Select your bulb movieclip by clicking on it once with the Selection tool (V). The change will be reflected in the Properties Inspector instantly your movieclip is selected now.

www.FlashExplained.com

2.3 Click on the Filters tab. Then click on the small blue cross to access the effects at your disposal.

2.4 Select the Glow effect from the menu. Select the following values for it:

Blur X and Blur Y: 31 Strength: 230 Quality: Low Color: red (#FF0000) Leave the Konckout and Inner glow options unchecked.

This is the result you should see a nice, red glow appearing around your movieclip.

Effects in Flash can be applied only to movieclip symbols, button symbols and text fields. They cannot be applied to simple vector drawings, images or anything else other than the three aforementioned objects. If you want to apply an effect to a drawing, convert that drawing into a movieclip first and then proceed with the application of effects.
2.5 You should create the animation now to animate the glowing effect. Just right-click on the grey area between the two keyframes and select Create Motion Tween.

www.FlashExplained.com

A continuous, unbroken arrow should appear on a magenta background. I wont delve into details here, because I already explained in exhaustive detail the proper procedures to create a motion tween animation. Check it out if you have any questions. Also check the shape tween animation lesson.

2.6 Select Control > Test Movie. You should see your glow appear, from nothing, to full bright red that you have applied to your movieclip in the second keyframe. 2.7 Now thats fine, but there is that abrupt jump at the end of your animation. There is no smooth transition between the glowing effect at its most visible and the first keyframe where there is no glow visible at all. You are going to change this now, easily.

Right-click on the first keyframe and select the option Copy Frames from the menu that shows up.

www.FlashExplained.com

2.8 You will paste this keyframe onto frame 40. Right-click there and select Paste Frames.

2.9 Do the same thing as you did before right-click between the two keyframes and create a motion tween animation.

2.10 Test your Flash movie again by selecting Control > Test Movie.

You should see now an animation similar to the one demonstrated at the beginning of this tutorial. The rythmical glowing of your bulb movieclip. Yes, it is as easy as that. There is no effect applied in the first keyframe, and there is the glow applied in the second one. Make the motion tween and there you have animated effects in Flash! You can do the same with the Color and Blend options. With filter effects thrown in too. Play and experiment to see what you can achieve!

I will make a lesson which will explain how to use what you have just learned, together with motion tweens and shape tweens to create professional animations. So stay tuned! Subscribe to Flash Explained below!
www.FlashExplained.com

The source file for this lesson is included with this PDF. If missing, get it at http://flashexplained.com/animation/flash-cs3-animation-basics-animating-effects/. Like this Flash lesson? Subscribe to FlashExplained.com to stay up to date on new lessons and tutorials!

www.FlashExplained.com

You might also like