Signal Grid

The hero sits on a field of dots rendered to a 2D canvas. The dots behave like a liquid surface: the cursor pushes them aside and lights them up, a click sends a shockwave through the field, and an intro ripple fires as the page settles in.

How it moves

Each dot has a rest position, an offset, a velocity and an energy value, all held in flat typed arrays. Every frame applies forces, then a spring pulls each dot back toward rest while its light energy decays:

• Pointer — dots within a radius get a radial push and a brightness boost
• Bursts — a click (or the intro) spawns an expanding ring that hits dots as it passes
• Spring + decay — offsets ease back to zero, energy fades, colour ramps blue → cyan → violet

And how it stops

The loop accumulates total activity each frame. Once that falls below a threshold with no recent pointer and no live bursts, it snaps everything to rest, paints one clean frame, and cancels itself. It is perf-tiered (dot spacing and pixel ratio scale with the tier) and renders a single static constellation under reduced motion — no listeners, no loop.