What are micro-interactions?
Micro-interactions are small, single-purpose animations or responses to a user's action.
Definition
A button that presses down, a toggle that slides, a heart that fills when tapped: each confirms an action and gives the interface a sense of life.
Why it matters
They make interfaces feel responsive and help people understand what just happened.
How to get it right
- Respond to every tap or click.
- Keep them short, under about 300 milliseconds.
- Use motion to explain, not decorate.
- Respect reduced-motion settings.
Mistakes to avoid
- Long, blocking animations
- Motion with no meaning
- Ignoring accessibility settings
Related terms
Orlume, the design-first AI website builder, gets the details on this page right for you: describe your site in one prompt and it decides the layout, type, colour and structure, builds it in React and Next.js and puts it live in one click.
Free to start · No card required · Live in one click
More design terms
Questions, answered.
The things people ask before they start building.
What are micro-interactions?
Micro-interactions are small, single-purpose animations or responses to a user's action. A button that presses down, a toggle that slides, a heart that fills when tapped: each confirms an action and gives the interface a sense of life.
Why does Micro-interactions matter?
They make interfaces feel responsive and help people understand what just happened.
How do you get micro-interactions right?
Respond to every tap or click. Keep them short, under about 300 milliseconds. Use motion to explain, not decorate. Respect reduced-motion settings.
Still stuck? Email usBuild something that doesn't look AI-made.
Describe the site you want. Watch it get designed, not just generated. Then publish it to its own orlume.site address.
- Free to start
- No card required
- Publish to a live URL
- You own the code