Colored Perlin Particle Field

I was inspired and wanted to play with perlin particle fields, where perlin noise is used to simulate a particle moving along a force field. I found the excellent tool Processing that makes it really easy to play with stuff like this. As luck would have it, someone had already implemented Perlin Particle Fields, but in black and white.


I wanted color. So a few tweaks later and behold! I create particles of 7 different colors and they behave subtly different – they follow subtly different force fields. The force fields are similar enough to be fairly cohesive, but they strive for separation (see the colored “channels” at the bottom left part of the image below).




Here’s a movie of how a field like the one above is constructed, from the time particles are born until they’ve moved for a couple of thousand updates.

Colored Perlin Particle Field


Cooler movies (?)

But then I found Perlin noise + vectorfield + particles = fun and decided I want to have a go at that too! What he does is run his particles for a set number of iterations, save one (movie)frame, reset with a slightly different Perlin noise field, and then generate a new image – stitching them together to a movie. I’m doing the same below. I randomize the particles using the same random seed, so the particles keep getting spawned in the same locations. Without random spawn points, the movie becomes very chaotic.

All these were created using MakeAVI.

30000 articles, 1000 steps

Particles = colored points, Steps=the particles were drawn and moved.

1000 particles, 1000 steps

200 particles, 1000 steps


Here’s a 3D WebGL version I created at Yet Another Shader Editor. You’ll need a WebGL capable graphics card to run it.


If you liked that one, try Flegm fountain.


About mfagerlund
Writes code in my sleep - and sometimes it even compiles!

One Response to Colored Perlin Particle Field

  1. Robin says:

    This is so wonderful! I really love the 3d one

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 )

Google+ photo

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

Connecting to %s

%d bloggers like this: