Micro Interaction; great experience for user engagement “Less is More” — Anonymous
Now-a-days, business needs to stay constantly connected or relevant to their user to be in the competition and one of the best way of doing that is driving customer engagement and creating memorable experience.
As a UI/UX designer I feel that there are many ways to drive users engagement on website/web app/mobile app but the tremendous potential that often get overlooked is “Micro Interaction”
What is micro interaction?
Micro-interaction are the little animation or visual responses users see when they perform certain actions. For Example:
These may seem frivolous at first, but micro-interaction have a significant psychological impact on users. Just like over here, when you click on the heart button it gives you a feedback for your action with little animation.
Micro interaction role on Human Nature
Many of us perform countless micro interaction everyday without realizing it. Anytime you engage in a simple, quick movement ( such as your locked phone screen action ) you are having a micro interaction. With any interaction, there is an action and reaction. A user performs an action to which interface performs a reaction to let user know that they have successfully performed an action.
Now in this examples, when you click on download button you see a process of downloading taking place through an animation. Here, in this long process micro interaction helps user to engage themselves so that they do not get frustrated with the amount of time the downloading takes place.
Four basic elements of micro interaction.
- Trigger: This is what initiates the action. On most interfaces, this includes clicking or touching the specific elements of the interface.
- Rules: Rules prescribe the condition for a micro interaction to happen.
- Feedback: Feedback helps users to understand that the necessary rules were engaged by the trigger and that the micro interaction is successful.
- Loops & Modes: This appear in the last stage of the interaction. The purpose of loop is to determine the duration of interaction while modes takes care of less common action that help users to continue with the process.
Why they work?
- More control through immediate feedback: The user knows that their action was accepted, giving them more confidence in further usability. For Example
If you see in this micro interaction you get an immediate feedback of the action you have performed and that interaction is what eagerly keeping you engaged.
2. Instructions: These interaction can guide users in how to use the system. For Example
Here, the micro interactions helps us realize that on which tab we are in.
3. Visual Rewards: Small but simple satisfying effect enhance the UX and can facilitate a habit that keeps users engaged. For Example
In today’s web design era micro interactions are the essence and their absence can make a site seem bland.
How not to use the micro-interactions
- Don’t over design. Micro interactions should not feel strange or take too much time to load.
- The first time someone experiences the micro interaction, he/she shouldn’t feel the same as when they use it the 10th time or the 100th. Make the micro interactions adaptable to the context.
- Don’t start from nothing. Understand your users, their motivations, and the context by conducting user research.
- Remember, the goal is for these interactions to be subtle and effective. Make sure the style of the micro interaction fits naturally with the style of your overall interface design.
A good interaction can stand up in the overall design of the interface. These interactions are what keep your users engaged on the most basic level and doesn’t bore or distract them. What matters is how you deal with the users and how they feel when they are going through these interactions of your product. Even minor details deserve close attention, because that is what going to help you out in keeping the interactions easy to use for the users.
Thank you 🙂