When designers think about user experience, we often think of the end product. We ask ourselves: What is a customer’s overall experience with our platforms, websites, and mobile apps? How seamless are their interactions? The best UX happens when the big picture view and the little details work together. Little details should be considered with every single project. It matters where the user clicks. It matters what happens when they do.
So, how can you ensure you’re taking care of all the details? Many designers are zoning in on microinteractions, the small moments that happen inside and around the overall experience.
Today, we’re going to unpack the concept of microinteractions and talk about how UX can be improved by using them.
Microinteractions, UX’s new frontier
We’re constantly interacting with technology. But what defines our experience? How do we get feedback from the platforms and apps that we spend our time with?
The concept of microinteractions was introduced in Microinteractions, a book by Dan Saffer. Saffer believes it’s the little things that turn a good digital product into a great one, and that microinteractions can help revolutionize a product and a brand.
Here’s how Saffer defines microinteractions:
“Microinteractions are contained product moments that revolve around a single use case—they have one main task. Every time you change a setting, sync your data or devices, set an alarm, pick a password, log in, set a status message, or favorite or “like” something, you are engaging with a microinteraction.”
These microinteractions have a purpose– to provide an update on the status of an action. They’re a tiny bit of communication to let the user know that their action had a result.
For example, if you like a photo on Instagram by tapping twice, a large heart will appear in the center of the photo, and the heart underneath the photo will turn red.
Here are a few other examples of microinteractions:
- Showpad – When users click the “Filter by Industry” button, it reverses the direction of the arrow to show the action being taken.
- Chartboost – When clicking on the “Get Started” CTA in the hero area, an animated spinning gear is displayed while the form loads.
How to use microinteractions
You probably use a lot of microinteractions already, but are they delighting your audience? The best microinteractions provide a feeling of satisfaction, and make people feel connected.
Here’s how to improve overall UX with microinteractions:
Catalog each and every touch-point
Whether you’re designing a mobile app, website, or software platform, you can start assessing your microinteractions by cataloging each and every touch-point. What are the actions a user can perform, and what feedback do they get when they perform these actions?
Microinteractions are used when:
- Things are turned on and off
- Comments are made
- Making changes
- Viewing messages
- Receiving notifications
- Liking, sharing, or posting on social media
- Connecting to other platforms and devices (for example, software integrations and Bluetooth)
- Sharing progress along the way
By understanding where are the touch-points are, you can figure out where microinteractions fit in. Are you already using them? Are they accomplishing your goals? How can they be improved?
Both quantitative and qualitative metrics should be considered, so be sure to understand how success will be measured. While fun microinteractions are important, they should be also well-thought out and integrated with the overall strategy to accomplish certain goals.
Decide on a brand voice + tone
Most UX designers use microinteractions to provide user feedback. However, the best experiences come when the microinteractions are designed deliberately to delight, fitting into a greater branded voice and tone.
For example: MyFitnessPal’s brand mission is to be as helpful as possible when someone is trying to track what they’re eating. To be as encouraging as possible (and to make sure they’re not annoying), MyFitnessPal automatically turns off notifications if a user doesn’t respond, and provides updates along the way.
Design to delight
Microinteractions are magical when they delight the user, and many companies are finding ways to upgrade their feedback loops. For example, what happens when a user has to wait while your app has to connect to a server?
Rather than letting the user get bored while they wait, provide them with an update. Uber does this by showing you where your car is located while you wait for it to arrive. Many others do this simply by adding an animated progress update.
Wrapping up
When we start a new UX project, we consider both the big picture and the micro details. After all, what happens once someone starts interacting with our designs? They need feedback to know their actions have an effect, and that feedback should delight them.
If you want to make your audience feel good about the overall experience, you should devote attention to microinteractions. These microinteractions can redefine the user experience and take it from good to great.