Motion as a tool on Purpose

Image from

Motion design as a profession is a bit of a muddy topic. There are a lot of components that make up what motion design is, and so a lot of times the actual “design” aspect gets lost in the process. There are a lot of avenues to discover with this tool, both in UX/UI and branding. Motion can create an atmosphere, and it can inform your layouts or interaction models.

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 micro-interactions, rather than to induce delight or entertain users. In this article, we explore the purposes of use, unobtrusive feedback animation. In a second (forthcoming) article, we will 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 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).

When animation is used in a subtle way, it can help users build mental models about how the system works and how they can interact with it. Animations are less critical for user experience when they are simply time-filling visual stimulations during moments of transition (in fact, it’s these down-time animations that often frustrate participants in usability testing). Instead of using animations to provide surface-level delight (that quickly sours), animations can be leveraged for usability: as clues about what is currently happening with the system, as signifiers for how UI elements will behave, and as easily understandable spatial metaphors for the user’s location in the information space.

Do you have a new product or service you need to introduce to your audience? A motion graphics explainer video could help you achieve this in a matter of seconds. Comoshen can assist you in your motion design endeavors, Get in touch with us!

Static graphic design alone couldn’t achieve the same effect, not without the animation. Static graphics include infographics that use visuals and written copy to tell a story or break down intricate information. Motion graphics breathe life into the static world of infographics. You have the freedom to use sound and motion to tell your story in a more engaging way.

the journey of a mind set free. Product Designer & Creative Director