UI Tipsby Praveen Juge

UI Tip #010UX & accessibility

Give every action instant feedback

Respond within 100ms of a tap or click, even when the work takes longer. Change the button's state, show progress, then confirm the result.

Why it matters

When nothing happens after a tap, people can’t tell whether the tap landed. They tap again, and submit twice, or they assume it’s broken and leave. Research on response times puts the limits at about 0.1 second to feel instant, 1 second to keep someone’s train of thought, and 10 seconds to keep their attention at all.

How to do it

  • Within 100ms: show that the input landed. Change the button’s state, with a pressed look, a new label like Saving…, or an indicator.
  • Over a second: show progress. A spinner says something is happening; a progress bar also says how long.
  • Over ten seconds: show how far along it is, and let people do something else in the meantime.
  • When it’s done: confirm the result where people are looking: the item appears in the list, the button says Saved.
  • Guard against double submits, without hiding the button or moving focus away from it.
  • When an action almost always succeeds, like a like or a reorder, update the screen at once and undo it if the server says no.

When it bends

Don’t flash a spinner for work that finishes in a few hundred milliseconds; a spinner that blinks on and off looks like a glitch. Hold it back for about 300–500ms and show it only if the wait runs longer.

Sources