Load Swarm
Particles orbiting a centre, tightening and speeding up as the work approaches done.
The canvas in this preview is the file shown here. The surrounding demo shell only provides context and is not part of the copied code.
import { useEffect, useRef } from "react";
/**
* Vibary · Load Swarm
*
* Particles orbiting a centre, drawing in as the work approaches done.
*
* The technique that makes progress legible without a number: angularAbout this effect
A progress indicator for a wait with a known end — an import, an upload, a model finishing a pass. The orbits draw inward as progress advances, but the detail that makes progress legible is that angular speed rises as the radius falls: a shrinking ring at constant speed just looks smaller, while a ring that quickens as it closes reads as nearly finished. Orbit planes are inclined at different angles so the swarm has depth rather than sitting flat, and the drawn progress eases toward the reported value so a number that arrives in jumps still reads as one continuous closing-in.