Austin Z. Henley

Associate Teaching Professor
Carnegie Mellon University


Home | Publications | Teaching | Blog

Particle playground

8/6/2023

My most recent useless programing project is a particle emitter engine with an interactive playground. It involves a nice combination of mathematics and creativity that results in a visual reward. I've lost quite a bit of time by unintentionally getting sucked into tinkering with this!

It enables you to create animated patterns from thousands of particles using a few lines of code. It works by automatically producing new particles every few frames, and you just specify the initial properties and the update behavior in JavaScript. The engine does the rest!

Try it for yourself below. You can see the canvas, parameters, code snippets, and documentation. If you come up with any cool designs, click the Share Code button and email it to me so I can add it as a preset. You can also look at the source on GitHub.


FPS: , Particles:








Documentation

The Init event runs once for each particle when it is created. The Update event runs for each particle once per frame. Each particle will be moved by its speed in the direction of its rotation. You can modify all individual particle's properties through the p object, like p.speed. You can even store your own variables, like p.foobar. The other properties of particles include:

Any changes to the code requires clicking Restart. You can modify Burst Size and Burst Delay anytime with the sliders. There are also globals (treat them as read-only):


You can find the source on GitHub. Special thanks to Joseph Lormand for presets.