Web
Article

Flash Script – Fire Effect Article

By Georgina Laidlaw


How can you create a great fire effect? Like this!

1. First, create a radial gradient circle object as shown below.

1130_fire1

2. Convert this to a graphic object, and name it ‘flame’.

3. Again convert this graphic object — this time, to a movie clip. Give this movie clip a instance name of ‘fl’.

4. Now, go into the timeline of the movie clip fl. Shrink the size of flame graphic object as shown below.

1130_fire2

5. Extend 4 frames and place a key frame in the fourth frame.

6. Now, scale the flame object as shown below. In the ‘effect’ palletes, I changed the tint color to yellow, and got this:

1130_fire3

7. From the fourth key frame, extend the frame by another 24 frames, and place a key frame at that point.

8. In this frame, I moved the flame object vertically upwards by 150 pixels.

I also scaled the flame object to a very small size, changed the tint color to red, and decreased the alpha to 23%. I also gave motion tweening to the frames.

9. Now, go back to the main timeline. Extend it by 3 frames.

10. Create a new layer above the current layer, and name it actions. Create three blank key frames.

11. In the first key frame, insert the action:

i = 0;
setProperty ("fl", _visible, 0);
xx = getProperty("fl",_x);
19.In the second key frame give action:
if(i < 35)
{
duplicateMovieClip ("/fl", "fl" add i, i);
setProperty ( "fl" add i, _alpha,i*8);
setProperty ( "fl" add i, _x,random(3) + xx);
i = i + 1;
}

12. In the third key frame, insert this action:

gotoAndPlay (2);

You’re done! Test the movie.

Meet the author
Georgina has more than fifteen years' experience writing and editing for web, print and voice. With a background in marketing and a passion for words, the time Georgina spent with companies like Sausage Software and sitepoint.com cemented her lasting interest in the media, persuasion, and communications culture.

No Reader comments

Recommended

Learn Coding Online
Learn Web Development

Start learning web development and design for free with SitePoint Premium!

Get the latest in Front-end, once a week, for free.