Digital Product Engineering3.36 Micro-interactions
VOL. III · CH. 3.36 · COMPONENT

Micro-interactions

The small, often unnoticed feedback loops that make an interface feel alive and responsive.

Division
Difficulty
Prerequisites
Related
1 min read · 117 words

3.36.1Definition & Anatomy

A micro-interaction is a small, contained response to a single user action — a hover state, a button ripple, a checkbox animation — providing immediate feedback that the system registered the input.

3.36.2Common Mistakes

  • Missing feedback entirely on interactive elements, leaving users unsure whether an action registered.
  • Overdesigned micro-interactions that draw more attention than the action itself warrants.

3.36.3Best Practices

  • Provide some form of immediate feedback for every interactive element, however subtle.
  • Scale the visual weight of the feedback to the significance of the action.
ExampleA "like" button's brief scale-and-color animation on tap confirms the action instantly, without requiring the page to reload or a separate confirmation message to appear.