How the artwork works
Just Skedaddling is rendered with an HTML5 Canvas. There is no recorded animation to play back. JavaScript creates the visual state, updates it on each animation frame and draws the current state to the canvas.
Particles
On desktop the system creates 180 particles; on mobile it uses 90. Each particle has a position, velocity, size phase, hue index and a few small offsets that keep otherwise similar particles from looking identical.
The particles drift continuously. Their movement is deliberately slow, with small changes in velocity rather than a large simulated physical system. This keeps the image organic without requiring a complex physics engine.
Connections
Nearby particles can be connected with thin lines. The connection distance changes with the artwork's serenity, and the line opacity depends on how close the two particles are. At higher serenity the network becomes more visible and coherent; after disturbance, connections become shorter and quieter.
Background layers
There are two background elements behind the particle field. A collection of small stars twinkles independently, while four radial-gradient nebulae move slowly and change hue with the same global colour drift as the foreground particles.
Colour
Each particle starts with a hue derived from one of several base hues. A small global hue shift moves the palette over time. Serenity then controls how strongly the saturated palette is shown: when the system is disturbed, the colours move toward a more muted range.
Why use Canvas?
The artwork needs many small elements to move and redraw continuously. Canvas gives the page one drawing surface and lets the animation loop update the image directly instead of creating hundreds of DOM elements. It also keeps the project dependency-free.