Chapter 56. Using Motion for UX

In digital design, it is becoming more and more common to include animation or motion design as part of the UX. It’s a stylish detail, but in UX, you care about more than style. Motion is a tool.

If Motion Makes People Wait, It’s Bad

Before you start designing amazing transitions between screens, and smooth animated buttons, and parallax gravity in your scrolling, think about the user. If the user is trying to navigate, or if they know what is coming, or if they have to see this animation a hundred times every time they use your site or app, you might be doing more harm than good.

Animations take time to show, and making users wait quickly gets frustrating. Even worse than waiting, sometimes animations make things hard to read, or they distract users from the content and buttons you want them to read and click.

Motion Is Noticed First

If you have ever been disturbed by a vibrating banner or a jumping button, then you understand how motion can draw your attention. If you made a list of the things your brain notices, in order of priority, motion would be first. But, a little goes a long way. If you make a vibrating banner or a jumping button (which are really annoying to click, by the way) I will hunt you down and... well... let’s just say it won’t be pretty.

Straight lines point in a direction

Different types of motion will do different things to the user’s eyes. If you make something move in a straight line, the user’s brain will anticipate where it’s going ...

Get UX for Beginners now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.