It doesn’t matter if you work in the design field or not – the standard truth is that design by itself can solve various kinds of problems, and those little things that come with design have a tremendous amount of impact on user experience.
Microinteractions are the small and basically unnoticeable moments in UX that can be boring, easy to forget, sometimes even over-complicated or on the other hand – exciting and engaging. Even if you don’t always notice them, micro-interactions are everywhere around you: in the gadgets, you carry with you, in the appliances, you use in your house, in the apps on your phone and desktop, in the city you’re living and even in the interior around you.
It is a vast topic indeed, although those “little things” of all your forthcoming web and app design projects are the key to making them as user-friendly as possible. So read through this article, and you’ll know what micro-interactions are, why and when you should use them, and, most importantly, how they can make your design or a product better.
In a digital user interface environment (yes, there are others, but that’s for another article), micro-interactions are small, single-use case events that:
While this sounds awfully formal and boring, the purpose of the micro-interaction is, more often than not, to introduce the warm and human-like experience to the user.
An excellent example of a simple micro-interaction would be a form Submit button. If you’ve ever interacted with a mediocre one, you remember that after pressing it, nothing really happens. It stayed the same after you hovered on it, pressed it down, and released.
A proper Submit button doesn’t leave you hanging like that. It indicates when you’re interacting with it, and even after you’ve done so. Form submission can take a couple of seconds, so a genuinely great button would also indicate the status of that process with a progress bar or wheel.
What if something went sideways and the form didn’t send? A separate micro-interaction (in this case, an error message) would pop-up to inform the user.
Microinteractions usually have these four parts:
Let’s break them down one by one.
Triggers are precisely what they sound like. They initiate (or start) the micro-interaction. They can do so on the whim of the user OR the system. This depends on the purpose of the action and the end goal.
Rules define what happens when the trigger goes off. Does the button turn blue? Does a notification pop up? Does another trigger initiate?
Feedback is an alert for the user: it lets him or she know what’s happening in the process. Feedback can be visual, audio format, and haptic. The visual is the most predominant because we tend to look at what we’re interacting with. And note, that good feedback can add personality to your micro-interactions.
Loops and modes are like road signs for the interaction. Think if “this then that” or “if/else.” These rules determine what happens if the conditions change.
Here are some solid arguments if you’re trying to convince someone of the awesomeness of the micro-interaction:
Making an artificial, robotic-like interaction as human as possible is the best you can do for your product’s user.
While not necessarily the primary goal, micro-interactions are in and of themselves an indication of genuine empathy for the user.
Here are some tips to consider when thinking of how to improve your UX: