Skip to lesson
Exit
Motion, Interaction & Prototyping1 / 2

1 min lesson

Motion that masks latency

Respond to "Why does a skeleton screen often feel faster than a spinner, even when the actual load time is identical?" Name the reason and the detail behind it.

Step 1 of 2

Motion that masks latencythe gap between click and result is where polish lives

An AI editor is full of operations that take real time: a completion arrives, a diff applies, an agent thinks. You cannot make the network faster, so you manage the perception of waiting.

  • Optimistic UI for reversible actions: apply the change immediately, reconcile when the server confirms, roll back visibly if it fails.
  • Skeletons over spinners when you know the shape of what’s coming - a skeleton that matches the final layout reads as “almost there” rather than “stuck.”
  • Entrance choreography so content does not pop. A 150ms fade-and-rise on arriving results turns a jarring snap into something that feels intentional.
  • Honest progress for long operations: a determinate bar when you have real progress, a calm indeterminate state when you don’t. Never fake a percentage.