XD Essentials: Microinteractions and Their Macro Effect on User Experience

by Nick Babich

posted on 04-19-2016

Great products do two things well: features and details. Features are what draw people to the product, and details are what keep them there. Are microinteractions those details? Yes! It is these details that lead to seamless interaction with products. Alternatively, it is the lack of attention to those details that lead to user frustration and eventual dislike of a product.

The Essence of Microinteraction

Basically, microinteractions are contained product moments that do one small task. They are so small, you don’t think about them. When you mute your phone, rate a product, or play music, you are engaging with a microinteraction. It’s likely that you start your day with a microinteraction by turning off the alarm on your mobile phone.

Microinteractions aren’t restricted to just computers, they are absolutely everywhere. You can find them in the mobile devices we use, the appliances in our house, and even embedded in the environments we live in.

In Dan Saffer’s book Microinteractions, he notes these atomic design moments typically serve following essential functions:

Some examples of microinteractions include:

[![micro2](https://hlx.blob.core.windows.net/external/60a1461961cfe1c799caf98be35ea01480b136be)](https://hlx.blob.core.windows.net/external/60a1461961cfe1c799caf98be35ea01480b136be)

Image credit: [Smart Design](http://smartdesignworldwide.com/thinking/microinteractions-chapter-4-feedback-illuminates-the-rules/)

The ’like’ button on social networks which highlights changes by using interactive animations. Such feedback informs users that they are in the list of those who liked the post.

Four Parts of MicroInteractions

According to Dan Saffer, all microinteractions should have a four-part structure.

micro4b

Why Do Microinteractions Work?

In trying to answer this question, all roads lead to a human-centered design approach, where the user is the prime focus. Taking a human-centered design approach means leading with user’s wants, needs and behavior, and here, microinteractions come into play. A direct focus on interactive animations make user interfaces more appealing by:

The most important thing in UX is how you deal with users and how they feel when using the product. If microinteractions are delightful, humane, and effective, then they should improve the app’s user experience and bring the user interface to life.

Conclusion

In today’s world where a typical person encounters a hundred or more different user experiences each day, only the clearest interactions will turn a new user experience into something special. Microinteractions are one of the key things to pay careful attention to in UX design. If you can master the art of creating small, delightful moments in your user’s daily interactions with technology, you will leave a positive, lasting impression.

In my next article (Part 2 – coming soon!), I’ll explain useful techniques for mobile apps and dissect some great examples.

Topics: Creative Inspiration & Trends, Design

Products: Creative Cloud