orbit-flow
Orbit diagram animation: labelled steps riding orbits around a headline, for workflow explainers. Three dashed orbits round a line of type, with three labelled stops riding the inner one. The scene settles in from 0.86x while the line rises, clears and sharpens a word at a time; the outer orbits drift apart at a constant 0.187 degrees a frame, and the inner one coasts down from its entrance and then winds up until its dashes, markers and labels are a blur. Nothing is left to the browser's rasteriser: the rings are the fitted stroke model evaluated at every pixel on a canvas (a Gaussian across the ring, a square wave along it blurred by the capture and by the shutter), and the labels and line are drawn at 4-8x and averaged down, so every baseline moves by fractions of a pixel. The line is Archivo at weight 350, picked by fitting all 1,804 Google families to the recording. Built frame by frame against a screen recording: 0.37 of 255 mean per pixel over all 77 frames.
orbit-flow
Orbit diagram animation: labelled steps riding orbits around a headline, for workflow explainers. Three dashed orbits round a line of type, with three labelled stops riding the inner one. The scene settles in from 0.86x while the line rises, clears and sharpens a word at a time; the outer orbits drift apart at a constant 0.187 degrees a frame, and the inner one coasts down from its entrance and then winds up until its dashes, markers and labels are a blur. Nothing is left to the browser's rasteriser: the rings are the fitted stroke model evaluated at every pixel on a canvas (a Gaussian across the ring, a square wave along it blurred by the capture and by the shutter), and the labels and line are drawn at 4-8x and averaged down, so every baseline moves by fractions of a pixel. The line is Archivo at weight 350, picked by fitting all 1,804 Google families to the recording. Built frame by frame against a screen recording: 0.37 of 255 mean per pixel over all 77 frames.