How to enhance your UX design with micro interactions: A guide

How to enhance your UX design with micro interactions: A guide Sarah has helped transform many websites and apps throughout her agency career. And now she oversees the creative process across all of our projects at Sonin. She makes sure that everything is designed and developed with the end user in mind. She’s driven by the fast-paced nature of working in the digital space. Especially from the design side of things. Sarah loves that trends and user expectations are always changing because there’s always something new for her to learn or experiment with. When Sarah isn’t designing she can be found in the swimming pool. As a competitive swimmer since the age of 3 she’s often competing or training. And hopes to make the Europeans in the future.

User experience (UX) is the most important part of any app. If a user finds an app difficult to use then it doesn’t matter how well it’s built or how good it looks – they won’t use it.

There are many areas within user experience, but the one we will focus on is micro interactions, which closely link to motion design and to the user interface (UI). Micro interactions are sometimes overlooked or viewed as a ‘nice to have’, however more and more people are seeing the benefits of spending time implementing them to enhance UX and better engage their end users.

What are micro interactions and why are they so important?

Micro interactions are functional animations at the point when the user and the interface interact, like when you tap a button or pull down to refresh a feed. As users navigate your app, you need to keep them informed about what is happening in the background. This is where micro interactions become important, because they enhance that UX. Once a trigger has been activated, you have to tell the user that their action has been recognised and accepted.

“The system should always keep users informed about what is going on, through appropriate feedback, within reasonable time” – Jakob Nielsen, 1995

What makes a good micro interaction?

When looking at using micro interactions (below), the first thing should be planning, because if you skip the planning phase it will fail. Always ask these three questions:

  • What is the trigger?
  • What happens when the trigger is actioned?
  • What is the user feedback?

For example: what is the trigger? The user taps the heart icon. What happens when the trigger is actioned? The heart animates and changes from a grey outline to solid red. What is the user feedback? The user sees that their action has been acknowledged, thanks to the initial animation, and that it has been accepted (the heart remains solid red).

The next step in planning is defining the rules. This ensures that whenever this trigger is successfully actioned it always does the same thing. But on the other hand, you also need to provide rules for what happens if something goes wrong. There should always be an error plan in place.

Why micro interactions must be simple

Micro interactions are called micro for a reason. They should be subtle and not distract the user from the core product or the journey within it. This is where I would suggest the KISS (keep it simple stupid) principle is used. KISS states that most systems work best if they are kept simple, avoiding any unnecessary complexity. This is the first principle you are taught as a designer and it never stops being relevant.

The more intrusive an animation is, the higher the risk of lowered user engagement and retention. Following the KISS principle means your micro interaction is kept subtle, and the potential for user engagement and retention is higher.

Improving mobile app design with micro interactions

As previously mentioned, micro interactions play into user engagement and retention. You need to understand why people would want to use your app over another. If they’ve been using an app similar to yours for years, what’s going to make them change? Human behaviour leans towards habits, so when pushing your app, you need to change human behaviour by changing habits. You do this by offering the user something extra – constant feedback and an enjoyable experience.

The importance of micro interactions to the app experience

The key to successful micro interactions is to keep them small and subtle. By the time the user has noticed them they should have already disappeared. Anything that could potentially distract the user from their original task will end up frustrating them and stop them from using your app.

User experience is all about the users. Using micro interactions correctly will help enhance the UX and push your app even further into a user-centric state. This is essential for users of today who have such high expectations when it comes to mobile apps. This is the reason why I would recommend the minimum desirable approach to app development. In a time where delighting your users has never been more important, micro interactions are the key to a great user experience.

Interested in hearing leading global brands discuss subjects like this in person?

Find out more about Digital Marketing World Forum (#DMWF) Europe, London, North America, and Singapore.  

View Comments
Leave a comment

Leave a Reply

Your email address will not be published. Required fields are marked *