The Role of Animation and Motion in UX

Summary: Animation in UX must be unobtrusive, brief, and subtle. Use it for feedback, state-change and navigation metaphors, and to enhance signifiers.


In UX, motion and animation can be helpful and communicative, if used with restraint. Motion is most often appropriate as a form of subtle feedback for microinteractions , rather than to induce delight or entertain users. In this article, we explore the purposes of useful, unobtrusive feedback animation. In a second article , we discuss the details in timing and movement to make these animations appear smooth and natural.

The big advantage (and also drawback) of UI motion is that it attracts user attention . Our peripheral vision (specifically, through the rod-shaped photoreceptors in the human retina) is responsible for detecting motion.  Evolutionarily, the fact that we can detect a movement outside the center of our field of vision is, of course, an advantage: we can discern danger and protect ourselves. But that means that we are sensitive and prone to be distracted by any type of motion (meaningful or not). That’s why motion in user interfaces can easily become annoying: it’s hard to stop attending to it, and, if irrelevant to the task at hand, it can substantially degrade the user experience (as any web user who has encountered a moving advertisement can attest).

Although animations can be useful and can build user expectation s about the UI, they should be used with a light touch — primarily as a tool for providing users with easily noticeable, smooth feedback.

Read Full Article

from NN/g latest articles and announcements https://www.nngroup.com/articles/animation-purpose-ux/