How To Incorporate Micro-Mini Interactions In Your Website Designs

A few years ago, microinteractions burst onto the scene in force when apps cranked up our exposure to them in everyday life. Since then, every time you do something as simple as open Facebook or visit LinkedIn, you’re subconsciously engaging with dozens of microinteractions at every turn.

Sometimes they’re too small to even notice or too subtle to point out, but ultimately, microinteractions save users' time by instantly communicating information in a way that doesn’t bore them or cause unnecessary distractions.

However, in recent times there has been a shift towards an increasingly definitive world, primarily consisting of mobile-based apps and services, making emphasis on well-planned microinteractions even more lucrative in app design, website design and overall user experience. 

Microinteractions vs. Micro-Mini Interactions

Before we dive into how to utilize microinteractions, it's important to understand exactly what they are -- after all, we already know that many go unnoticed in daily life. Microinteractions typically exist to help someone complete a lone task -- changing your password or liking an image on Instagram, for example.

Everything from apps to appliances contains tons of microinteractions, but a different and potentially easier way to think of them more concretely is to remember a time when something went askew. Ever attempt to change a setting on your work computer, only to have to call in the big guns (aka the IT team) to finish the job? That's likely a microinteraction gone wrong. (But let's focus on ensuring they go right.)

Since the inception of the microinteraction, the atomization of microinteractions has broken down individual interactions into even smaller chunks. As a consequence, overall interaction with an online destination has increased.

This exemplifies the difference between the two tiny interactions we're discussing: Microinteractions and micro-mini interactions. The latter defines those smaller pieces we're seeing in today's world. Ultimately, micro-mini interactions are the various tiny interactions that form a larger microinteraction.

Whether you notice it or not, you’re passively participating in -- and engaging with -- thousands of micro-mini interactions each day. Luckily, user experience designer Chase Buckley gave a few examples to put it all in perspective:

  1. If pairing two devices together using Bluetooth is a microinteraction, then a micro-mini interaction in that sequence could be turning the Bluetooth setting on.
  2. Similarly, if you’ve ever connected with someone on LinkedIn, that is a microinteraction, but literally clicking the connect button on a person's profile is a micro-mini interaction that forms part of the wider interaction.

The Benefits of Micro-Mini Interactions

From a business perspective, micro-mini interactions can help you meet your business goals just like a change in strategy or higher-level process can. The difference is simply that you’re operating on a micro scale, tweaking minute interactions that often can be altered in a number of days. Thus, it can be an incredibly fast and agile approach which could result in immediate impact for the company at large.

Do you utilize microinteractions in your designs? Tell us how in the comments!

For example, if you were to tweak the format and design of an online submission form by reducing the fields and changing the animation of the buttons, you might be able to increase the conversion rate of that form. What's better? Your designers should be able to make those changes fairly quickly.

Another significant benefit of micro-mini interactions relates to the mentality of the designer. As I'll discuss in the next section, it’s important for designers to understand why their users chose to act in a certain way. Until they do, they will be limited in terms of how many micro-mini interactions they can optimize. Additionally, designers who work with micro-mini interactions will not only be building and using their technical skills but also their mental capacity to understand their audience -- something that’s incredibly important from a UX perspective.

How Can Designers Optimize Micro-Mini Interactions?

Consumers have historically made online decisions, like completing a purchase, in the blink of an eye, and as such, the importance placed on ensuring that every little part of the process is up to scratch has only increased in recent years. For example, an abandoned online shopping cart could be due to something as little as a customer not being able to find a button or having an issue inserting their credit card’s expiration date.

Therefore, these tiny micro-mini interactions hold significant weight in the grand scheme of things, and that’s why designers have to understand exactly what irritates, pleases -- and everything else in between -- their prospective user base. Plus, while it’s one thing to implement a micro-mini interaction, it’s another trying to optimize it.

There are a few key things designers should keep in mind when both designing and optimizing micro-mini interactions, which include:

1. Analyze Current Consumer Trends

The user is always the most important part of the wider process, and users will generally change the way in which they interact -- or even how they expect to interact -- with products and services over time. There are various things that can influence consumer trends, but if you think to times when masses of users have been influenced -- such as when Apple released the iPhone -- you can then assess their behavior to determine what trends occurred in the immediate aftermath of that event.

2. Don’t Underestimate The Importance Of Entertainment

Micro-mini interactions will vary greatly and, depending on the purpose of each interaction, less or more entertainment may be a stronger choice. That said, designers might find that adding a little touch of animation -- like the subtle roll-over effect Made In Space employs on homepage images -- can help smoothen out a rigid or boring process.

Designers will find it easy to downplay entertainment as a lesser element in UX design. However, entertained customers are not only more likely to stay interested and engaged in a current process, but they’re also more likely to return to that brand or website in the future -- both of which are fundamentally good for any product, service or business.

3. Make Sure You’re Giving The User Feedback

In short, you need to figure out a way in which you let your users know “Yes, you completed the action you were to trying to do,” or indeed, “no, that’s not right, change your choice.” Giving users validating feedback when they’ve completed an action is an important aspect of any design, but particularly for micro-mini interactions.

Take ‘liking’ a Facebook page for example. Without the bottom ‘Like’ button turning into a blue hue, instantly it would be confusing for a user whether they’ve actually completed the interaction they set out to achieve. This same principle can be applied to a number of features throughout social networks, such as following someone on Twitter. 

4. Opt For A Mobile-First Mentality

This is a no-brainer by now, but all design should take into consideration the impact it has for users on mobile devices, and place that ahead of desktop users. Framing the user experience on every platform with the same approach used for mobile devices ensures that this is achieved, and it generally results in overall improved micro-mini interactions.

All in all, micro-mini interactions -- and, for that matter, microinteractions -- are an increasingly important aspect of user experience design, and we expect to see much more attention to detail in the new year. By taking note of the small actions users will take on your website or mobile app, you'll be able to create a more beautiful design that each and every user will truly enjoy interacting with on a daily basis. And ultimately, this will boost your business's bottom line in the long run. 

Want to learn more about emerging technologies in design? Sign up for our newsletter.