Have you ever used an app that just felt like it got everything right? When you hit the little “Add to Cart” button, a satisfying “pop” happened, giving you feedback that you have actually added something to your cart. Or as you swipe through a list of cards, they dynamically come up to you as the previous card falls away.
The reasons these feel “right” is because they work the way our brains think they should. These are Microinteractions.
What are Microinteractions?
Nielsen Norman Group (a world leading group of UX researchers and experts) define microinteractions as
“trigger-feedback pairs in which (1) the trigger can be a user action or an alteration in the system’s state; (2) the feedback is a narrowly targeted response to the trigger and is communicated through small, highly contextual (usually visual) changes in the user interface.”Resource
From a UI and UX perspective, microinteractions are basically any visual feedback a user receives after interacting with an object in the UI.
What are some examples of Microinteractions?
Microinteractions are used in many apps, even websites. Here are a few examples you might be familiar with:
Reactions in Social Media
Facebook, Instagram, Linkedin. All of these apps have included some type of microinteraction when reacting to a post. Whether it is Instagram’s heart that pops on the screen or Linkedin’s bouncing reactions at the bottom of a post, these are interactions many of us have come to expect.
Pull Down to Refresh
This is another microinteraction that is very commonplace. Is something not loading correctly? Pull down to refresh! This is often a user's first instinct now when they want updated information.
Swipe right, swipe left. No doubt these statements bring to mind an app that has made this microinteration famous! However, many successful apps today use this mechanism to present new information while old information is navigated away from.
These are just a few of the most used microinteractions that are used in UI that really enhance a users experience when using an app. So now that we know what they are, let's talk about why they are so important in design.
Who cares about Microinteractions?
The short answer? Everyone. Most importantly, your users. And since your users care, you should too. The overall user experience of an app relies on microinteractions to feel natural, intuitive and polished. Microinteractions are the aspect that we feel as we use a product. These small details can make engaging with the product easier to understand how to use and more pleasurable to interact with.
Why do Microinteractions matter in product / UX design?
When building a product, even an MVP, first impressions are everything. In a world where there are multiple apps and websites for nearly every purpose or product, competition is stiff.
According to TechCrunch, “Based on data from analytics firm Localytics, and its user base of 37,000 applications, user retention has seen a slight increase year-over-year from 34 percent in 2015 to 38 percent in 2016. However, just because this figure has recovered a bit, that doesn’t mean the numbers are good. Instead, what this indicates is that 62 percent of users will use an app less than 11 times.” In fact, 1 out of every 4 users will only use an app once!
Why is this?
Well, there are many reasons. Some of them are:
- App Feels Slow, Clunky
- Difficult to Complete Intended Task
- Overwhelming Navigation
- Outdated Experience
Thankfully, microinteractions can solve a lot of these problems. And when you solve problems that lead to bad retention rates, you start to improve that retention number.
Imagine a user returning to your app or website twice as often as the competitions? 10 times as often as the competitions? Adding the polished feel we as consumers expect can help with that in a major way.
So when there are reasons for it, try to use some simple, clean microinteractions. Done in the correct way, they can help your users enjoy their experience more, which can mean only good things for you.
A few final thoughts on microinteractions
Microinteractions are great. However, animating just to add it as a feature or wow a customer is NOT what we want our goal to be. If a particular animation adds no value, oftentimes it is best to leave it out.
The goal with microinteractions should be to enhance a user's experience. Gently lead them along the path of your product, help them recognize patterns you use. Microinteractions provide instant feedback to your users, connecting them to your product in a way that few things can. Whenever a user gets that instant feedback, your product feels more user friendly, more responsive and more meaningful.
Microinteractions need to be thought through, and used consistently for that to be their effect. Start by designing one microinteraction and try to implement it tastefully in your product. Get some user feedback and adapt!
Want some help finding the best microinteractions for your users? Tell us about your project and goals and we'll tell you how our squad can help!