Skeleton motion needs one shared cadence; mixed breathing looks cheap
Aliases: skeleton pulse · shimmer cadence · desynchronised placeholder motion
What it is
A skeleton’s job is to say the slots are still alive. The usual evidence is a light breath or shimmer. Blocks on one screen must share a period and a phase reference, with at most a small delay along the reading direction. When each block blows its own wind — some flashing, some swelling, some sweeping, some pulsing — the cadences fail to lock, and the wait slides from “the system is working” into unrelated decoration. Mixed breathing looks cheap not because there is motion, but because the motion is not treated as a single signal for a single wait.
Why it happens
People group “same process or not” by rhythm. Phase-locked micro-motion is coded as one surface brightening; phase-scattered micro-motion is coded as several objects each performing. The skeleton’s task is to give all not-yet-arrived content one heartbeat, proof they belong to one load. Once the heartbeat splits, grouping fails: this block looks like a flashing ad slot, that one like a jittering disabled control, the bar in between like progress. Attention is pulled into tracking several unsynchronised periods; both timing and orientation get more expensive, and the wait’s identity gets dirty.
Cheapness is signal overload. Real content motion has semantics: a row inserting, an image fading, a button pressing. In the skeleton phase those semantics do not exist — only cadence. Once the cadence is ornate, or each row improvises, it is compared with those semantic motions, loses, and reads as unfinished effects rather than restrained placeholder. A unified cadence drops motion back to the minimum dose of “still alive”; clutter promotes it into a show with no plot.
Where it stops holding
A 50–80 ms stagger along the reading direction can still be read as one wave passing through, and can even hint that content will arrive in that order. Stretch the stagger until blocks obviously jump on their own clocks and grouping breaks. Under reduce-motion settings the breath should stop, leaving a static skeleton plus a status string; keeping the flash ignores that channel. On a long wait even a restrained breath habituates and the evidence of life thins — a cousin of channel exhaustion on spinners — which is rescued by a stage change, not by faster or denser breathing. If the skeleton competes with looping ads or other in-page loaders, unity inside the skeleton still leaves the whole page noisy.
Applying it
- Give the page-level skeleton one period and one easing, one opacity or sweep recipe. Do not write separate durations for the avatar circle, the title bar and the image well.
- If direction is needed, allow only a short phase offset along the reading axis, as a translation of the same waveform, not a different waveform.
- Honour reduced motion: turn the breath off, leave the skeleton still, and supply a textual “loading” state.
- How to check: record a skeleton wait and watch it muted. One heartbeat should be readable across the page. If the eyes have to jump among blocks chasing different flashes, the cadence has split — collapse to one period and see whether the cheapness drops.
Related
- Same group: I2.01.1 Use a skeleton when the forthcoming structure is predictable · I2.01.2 When structure cannot be predicted, use an indeterminate indicator · I2.01.3 A skeleton that does not match real structure produces a jump · I2.01.4 Skeletons reduce subjective wait estimates more than spinners · I2.01.5 An indicator on a very short load creates needless flicker · I2.01.6 A spinner carries no progress and, used for long, is read as frozen
- Nearby: E6.07 Skeleton screens · I4.09 Tempo and interaction rhythm · I2.07 Perceived performance
- Search terms:
skeleton shimmer·shared cadence·breathing placeholder
Cards in the same group
- I2.01.1Use a skeleton when the forthcoming structure is predictable
- I2.01.2When structure cannot be predicted, use an indeterminate indicator
- I2.01.3A skeleton that does not match real structure produces a jump
- I2.01.4Skeletons reduce subjective wait estimates more than spinners
- I2.01.5An indicator on a very short load creates needless flicker
- I2.01.6A spinner carries no progress and, used for long, is read as frozen