Follow the Swarm is a generative canvas animation built from a chain of phase-shifted particles. The original experiment arranged short marks along one oscillating ribbon and fed the previous canvas image back into the next frame. The Stage preserves that ribbon and extends the idea with vortex and Lissajous paths, luminous connections, adjustable trail persistence, and pointer steering.
Phase-Shifted Motion
For the ribbon mode, particle \(i\) has a fixed horizontal coordinate and an oscillating vertical coordinate. A nested modulation prevents the chain from behaving like one perfectly regular sine wave:
\[ x_i=c_x+\left(\frac{2i}{N-1}-1\right)A_x, \] \[ y_i=c_y+A_y\sin\left(\omega t+i\phi+ \sin(i\alpha)\sin(2\omega t-i\beta)\gamma\right). \]The index-dependent phase \(i\phi\) makes neighboring points follow one another, while the nested product slowly compresses and unfolds parts of the ribbon. The result resembles coordinated movement without simulating agents, flocking rules, or artificial intelligence.
Alternative Parametric Paths
Vortex mode maps the normalized particle index to several turns of an expanding polar curve. Its radius grows along the chain and receives a smaller time-dependent perturbation. Lissajous mode uses two sinusoidal axes with different integer frequencies:
\[ x_i=c_x+A_x\sin(3u_i+\omega_x t),\qquad y_i=c_y+A_y\sin(4u_i+\omega_y t+\pi/2). \]Because 3 and 4 are coprime, the path closes only after both oscillations complete a common cycle. Switching modes changes only the target equation; exponential interpolation moves the existing particles smoothly toward the new path instead of resetting the canvas.
Trails and Color Cycling
The previous frame is retained by painting a translucent solid layer over the canvas before drawing the next positions. If its opacity is \(a\), a pixel contribution remaining after \(n\) frames is proportional to \((1-a)^n\). Lower opacity therefore produces longer trails.
Color moves through a short sequence of RGB keyframes. Linear interpolation between adjacent keyframes keeps the cycle continuous, while an index offset gives neighboring particles related but distinct colors. Additive canvas compositing makes overlapping particles and links brighter without using CSS gradients.