Microinteractions: Small Scope, Big Impact

Microinteractions are the individual tasks within designs –something like signing up for an account, moments that tend to be invisible unless something goes wrong. The discussion on the subject comes from Dan Saffner, author of the book on the subject, and it is focused on the idea that these small details are crucial to successful design. These moments are present in all aspects of our lives –whether you’re liking somebody’s photo on facebook, or pressing a button on the elevator, and designers are increasingly seizing on them in order to connect with users.

Task-focused design is not necessarily a new subject, but the idea behind microinteractions shifts the focus away from the overall design to the single moment. By focusing attention on the singular task, designers can create seamless, surprising, or delightful moments for users by turning necessary interactions into opportunities for engagement. As an example try to recall some of the old “404: Page not found” errors, and look at how they’ve been transformed in all sorts of ways that are creative, playful, and importantly, not scary.

One of Google’s new 404 errors.

Saffner argues that the individual interactions create the user experience, and successful ones add up to form one positive image of the product, brand, etc. It is an idea that is becoming increasingly popular within the broader mobile-first design trend, as haptic interactions are becoming more and more of the norm. Within the trends of UX practices, the fast, iterative process known as “Lean UX” is well suited to the idea of focusing on small details while designing.

Parts of a microinteraction.

Saffer’s microinteractions are broken up into four parts: the trigger, rules, feedback, and the last part he calls “loops & modes”. The trigger is the initial phase, the one that sets the interaction in motion, be it a button, mouseover, or sign, anything that serves as a call to action. This is something that designers are always trying to improve, by directing users to certain tasks through visual cues, or by seamlessly integrating anticipated user needs (yes Gmail, I’d like to send this report to that same group of people).

The rules lay out the foundation for how these interactions can occur, in forms such as required text fields, a limited presentation of options, installation steps, amongst others. Understanding the rules of an interaction helps designers imagine what their users may or may not be going through to accomplish the task, allowing them to frame their work appropriately.

Feedback is the cornerstone of UX practice, and optimizing ways to collect it is fundamental to design. By thinking about feedback through this lens of microinteractions, designers are able to collect information in a way that is in touch with users, by engaging them on their own terms (instead of those dreaded, clinical phone surveys).

Loops & modes dictate how we think about the microinteractions: what is the timeframe of this interaction? is this something a user will encounter once? a hundred times? a thousand times? Thinking about how this will function over time is helpful in building a relationship between the user and the design, by integrating feedback over time (see: autocorrect), or by making infrequent interactions memorable and rewarding (see: below).

Email can be fun, too!

The science of microinteractions boils down to small, important design, an idea that we will likely be seeing communicated in more and more ways. So the next time an email newsletter makes you smile, or setting up an account is surprisingly painless, just think: nice microinteraction!


John Pavlus: The Future of UX Design: Tiny, Humanizing Details

Dan Saffer: Improve your websites with microinteractions