Skip to content

Micro animation

Micro animations are small animations that give the user visual feedback. Micro animations can enrich a design, because they can let the user understand better what is going on. For instance, they can communicate if a change has been made. Micro animations are meant to be small, hence the name, because they ideally are functional (visual feedback) and not meant for decoration.

However, there are some people that don’t like viewing animations. This can be because a permanent or temporary impairment can cause them to not process these animations very well. For example, people who are blind or have vision challenges. But also, people on the autistic spectrum might have a hard time processing animations on the web.
There are also people with vestibular disorders, which affect parts of the inner ear and brain which processes sensory information involved with controlling balance and eye movements. Those people might experience motion in web design as unpleasant because it leads to motion sickness, vertigo, nausea, and disorientation.

There are some key take-aways when using animation on the web:

  • Don’t use blinking animations
  • Give the user control over longer animations (play / pause button)
  • Ideally, use short animations which is no longer than 2 seconds (in case of a micro animation)
Icon of micro animation