Flash Essential

In this tutorial i'll be showing you how to achieve a smoke effect using flash, no actionscript needed for this effect as we'll be doing it all on our timeline. This effect can be used for smoke or steam in this case I've used it as a steam effect. On the stage we have a coffee cup, we'll use a simple motion tween with some blur filters to give it a nice steam effect so lets get to it.

Download

Starter

Finished

Example

Step 1 - Adding A Brush Effect

First thing we need to do is create a new layer on our Timeline. Now select the Brush Tool, Select the color white and randomly brush inside the cup.

Something like this;

Step 2 - Creating Our Movie Clip

Select the Selection Tool (V) and highlight all the white brush, Press F8 and convert to a Movie Clip.

Step 3 - Create A Steam Effect

Double click on the movie-clip this will take us into another movie-clip. Go down to the Filters Tab at the bottom, press the Plus Sign and select Blur. The Blur properties give you an X and Y scale , notice it has a little Lock next to it click it so we can adjust both the X and Y values independently. Play around with the blur values until you get something that looks like steam.

Note; If you cannot select the plus sign in the filters tab you'll need to highlight the white brush vectors and convert it to a movie clip

Step 4 - Add More Steam

Go to Frame 25 on the timeline and insert a new Keyframe. Select the Movie Clip, add more Blur then select the Free Transform Tool to widen the Movie Clip, finally move the Movie Clip up with arrow key.

Step 5 - Fade It Out

Go to Frame 50 on the timeline and insert a new Keyframe. Select the Movie Clip and go to the Properties Panel select Alpha and set it to 0%.

Step 6 - Create Motion Tween

Select the Keyframes Right Click and create Motion Tween. Finally go to the First Keyframe, Select the Movie Clip and in the Properties Panel set the Alpha to 0%.

Conclusion

In the final example I have created more shapes and layers inside the movie clip to give it a better look. Play around with different shapes and blur values to get the right effect you need, it might take some time but the effect is pretty realistic.

This post is tagged Flash steam effect, smoke effect Flash, Steam Effect Flash

Share This Post