Thinking Orb
A cloud of points that changes shape to say whether it is waiting, thinking, or answering.
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 · Thinking Orb
*
* A sphere of points that changes shape to say what it is doing: a
* tilted ring while it waits, a connected web while it thinks, a
* flowing ribbon while it answers.About this effect
A status indicator for an assistant, where the shape carries the state: a tilted ring while it waits, a connected web while it works, a winding ribbon while it answers. What makes it read as one object rather than three separate animations is that the point count never changes — every form is the same points rearranged, matched nearest-neighbour to their new positions, so nothing is created or destroyed and the orb becomes the next shape rather than dissolving into it. Rotation speed carries the state too: a quarter speed while idle, full speed once it is working.