Simple IDE Particle Systems AS2.0


The idea is to create a particle system tool that can be used inside the Flash IDE which doesn’t rely on heavy ActionScript coding skills; a designer’s tool to achieve a developer’s effects.

I had to give a little tech talk at Wunderman to the designers (a pretty cool bunch of guys). The brief was to inspire so I was looking through the crap I’d made over the years and the coolest things always seemed to be the particle systems. Whether we’re talking about the nice meleculor looking particles or the super violent uzi armed Battle Dots, the joy of knocking something up which is then, to a certain extent, off the leash is very cool.

So I opened Flash (not Eclipse) and essentially made a MovieClip which has all the code in an external class and TweenLite. The MovieClip is controlled like any other MovieClip in Flash with the ability to rotate and scale the funnel of the particle neck. Here’s an example.

Below is a brief tutorial of how to use it:

1. Download

2. Download TweenLite AS2.0 version from here.

3. Extract the files from both zips and put them into a new directory.

4. Start a new Flash document (Actionscript 2.0) and save it in the same directory then open example_01.fla.

5. Copy the folder “Particle Dispatcher” from the library and paste into your new document library. This might be quite difficult to grasp at first but yes, designers, there are folders available inside the Flash library :-p

6. Open the folder and drag the clip particleDispatcher to the stage.

7. Now for the only technical bit. In the ‘Publish Settings’ where it says ActionScript Version : ActionScript 2.0, click the button ‘Settings’. Hit the + button and in the box paste


and on the next line:



8. Click OK and OK again.

9. On the main stage first frame open the actions and paste this:


10. Test your movie.

11. Now go inside the MovieClip and move the textfields off the stage so they can’t be seen in your final movie. Inside the folder ‘Appearance’ you’ll see a clip called particleClip. In here you can change how the particles look. The particleDispatcher picks a random frame depending on how many different frames you are using. For this example there are only 5, so you’ll see that only 5 colours are being spat out of the dispatcher. Don’t limit yourself to circles though, try all sorts of shapes, transparencies, characters etc.  Rotate the angle of the clip named ‘direction’ in the particleDispatcher MovieClip and scale the clip named spray within this. Just play around 🙂

The text boxes on the stage are there to be used. Change the values and this will be reflected in the output.

It’s only a first attempt and I have in mind the idea of adding wind and gravity. But first things first. If you make anything cool with this email me the swf to I’d be interested to see.

The main thing here is to try to bridge the gap between lots of code which can look pretty scary and nice, intuitive, user-friendly interfaces. Please leave me some feedback.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s