In the past, we have always shouted from the rooftops that your website needs to follow a user-centred design. We still follow this rule, but we have yet to mention the more subtle details that can influence the way visitors interact with your page and how you can move them that bit closer towards your goal.
If the title hasn’t given away what we’ll be talking about, it’s microcopy UX.
It’s not really small sized text…
We’ve mentioned before about Micro-Interactions, which are tiny, enjoyable design elements that are implemented to enhance user experiences when they click, scroll or hover over parts of the website.
Microcopy UX on the other hand, are small snippets of, enjoyable content details that are used across websites and landing pages to enhance user experiences with subtle brand narratives to provide:
- Motivating messages to encourage engagement.
- Addressing any issues or concerns they may have.
- Personality to sections of your website.
If you want to write good microcopy, keep it short and sweet. Don’t ramble on and get straight to the point. It’s engaging and should provide the users with a reason to read it – If it doesn’t provide a purpose, then it shouldn’t be there.
When to use Micro-copy.
Microcopy UX can be used in a variety of ways that can often be overlooked because it can be so subtle, but it can create such an impact. To help guide a user, micro-copy is usually located Before, During and After the action.
Before the action
Typically, these are used to motivate users to your specific goals.
Improve your Call-to-Actions: Small prints are perfect for call to actions and can actually improve conversions if you show your users the benefits of taking the next action. Amazon uses micro-copy to upsell and emphasise the benefit of ordering the kindle from their free app.
Reducing online fears: When purchasing online or signing up to a new organisation, there is always the fear of becoming a victim fraudulent behaviour. From spam emails, hidden charges or misuse of sensitive data, these fears are often reduced when the user is greeted by microcopy that reassures visitors that they are using a trustworthy and transparent business.
Don’t you hate it when you go to fill out a free subscription, and they hit you with those bank card detail forms?
Spotify is one of the platforms that offer both free and paid subscriptions, so to ensure their potential customers are informed that there are no hidden charges, they reassure in their caption above that there is no credit card requirement. Additionally, setting a clear action within the button copy for the user to follow which tells them that they can get Spotify for free.
During the Action
Control labels, assistive copy, hints, tooltips or button micro-copy are all used to help guide the users through to the final steps.
Something that both users and business have in common throughout these processes is that we all want the desired action to be completed successfully. Microcopy can be added to simply guide customers through form submissions, demo trials or purchases to help them get from A to B as quickly and easily as possible.
Covering each and every aspect: GOV.uk has outlined helpful micro-copy through each online banking section so all customers are aware of which cards can be used, how the expiry date must be written, and where the card security code is located exactly on the card (even showing a diagram).
Reduce stress with diagrams: It’s always good to remember that customers may not always understand the product fully. A lot of the time, when you require some information, they won’t know where to find it which can easily result in them simply giving up avoiding the stress.
HP has supplied a beneficial microcopy link which produced a diagram which shows the customer exactly where they can locate the Product name and number on their device.
Additionally, they have also stated the format in which the product should be written which helps the user complete the form without getting any frustrating error messages along the way:
After the action
Once the action from the user has been completed, microcopy can be used to inform the users of any error that may have occurred, or successions such as confirmed email submissions.
Helpful errors: When a customer created an error, this can turn off conversions with many new users just giving up. To prevent this, write error state microcopy that helps users correct their errors to help users proceed. It is not enough to just define the error, explain how users can solve it.
For example, Mailchimp informs users exactly where they have gone wrong and provides helpful suggestions for improvement whilst also keeping to their brand personality.
Friendly notifications: Your users have completed the action you wanted, now what? You don’t want them simply to go away, do you? No, you want to keep them engaged with your brand and increase in-product activity. Microcopy can prevent dead-end pages.
For example, Mailchimp has used microcopy to update the users that their emails are successfully scheduled, but also placed within the button to encourage users to remain and engage more on their platform.
How can you write good microcopy?
Be more human
We are glad you’re asking this because the best way to talk to your visitors is to make it human.
Yes, you did hear us correctly.
Something that the majority of our examples have in common is the style that the microcopy is written, which is actually known as Conversational Design. This means moving away from the originally formal, complex typing and embracing the ‘say what you speak’ way of writing.
Online users are more likely to positively engage with an online business who are friendly and creates an emotional connection. In 2018, a study conducted from PWC showed that around 86% of online users are more likely to take action after a great customer experience.
Writing as a human, rather than a formal robot can help create this emotional connection.
For example, Microsoft Office uninstallation message showcases this perfectly. Users can easily understand what has been done by Microsoft and receive a friendly recommendation on what they should do next.
Create enjoyable journeys
As much as we do enjoy writing fun content for users to laugh at, microcopy should still fairly serious. As outlined previously, microcopy aims to help users, answer their questions, and motivate them to take action.
If your brand is meant to be playful and funny, then you can get away with it. If you’re a super serious company, then don’t force it as it’ll just feel out of place and give off the wrong message.
However, if your business can get away with having some fun, your microcopy UX can help make your customers feel better about themselves. This may help them start loving your brand more because you make them smile and feel good. If they’re feeling good about themselves and you, they’re more motivated to take action.
For example, a cookie consent form can be very informative but a slightly intimidating, full-page pop-up like this one:
Or it could follow this one:
E-Commerce company Vintageria addresses the super-serious Cookie consent form in a playful manner which made it both enjoyable to read, but still informed the visitor that their information will be collected, how it will be used and even gave them the option to manage their cookies.
Motivation is key
If you’re not enthusiastic about getting your users to take action, then they won’t be either.
Microcopy is an amazing User Experience element because it actually shares some traits with acquisition marketing. Marketing and microcopy both share the same goal, which is to get users to take action.
But how do you actually do this?
Ensuring there are no dead ends in the experience is essential to increasing the traffic around your website. If users visit a page with no internal links, they aren’t motivated to flow through your website and see what you have to offer. Always present the next step or give an alternative page to visit.
For example, PrettyLittleThing does inform users that their bag is empty, and also provides a text link to continue shopping…
It’s not exactly inspiring, is it?
E-commerce sites can benefit greatly from microcopy which motivates their users to start browsing through products. When users are happy or excited, they want to act.
Vintageria’s combination of text and an image works well here; Keeping to their brand, Vintageria provides an open-door for the next step that users can take by prompting them to Start Shopping, opposed to a boring “Your bag is empty”.
Due to high demand on products, ASOS checkout process provides a small informative text to let users know that their shopping bag items will only be reserved for 60 minutes.
This microcopy UX provides a sense of urgency for the user and motivates them to take action before it unreserved. Additionally, alongside this time limit is also a product limit with microcopy notifying the user that it is the last item left.
Note: Although time and product limits can create a sense of urgency to encourage the user to purchase, or inform them on the stock levels, this can be deemed as an e-Commerce Black Hat tactic that may create bad user experiences.
Microcopy UX has one purpose: to help users take action and reach the intended goal. If the microcopy doesn’t have a purpose, it doesn’t need to be there.
Understanding whether there are any points within your processes that may need microcopy to assist users is essential as this can make or break their commitment to choosing your business. In any business, you must always remember to think about your customers:
- Will they understand what you’re asking from them?
- Are there points which may cause your user to give up?
- Is there anything that they may find suspicious?
- Are you using any terms that newbies may not understand?
- Do they know how things should be written?
When we ask users for their personal information, they’ll always be concerned with their privacy. Inform your users to alleviate any concerns that they may have in regard to data protection and whether their email address will be sold on to a third party or used for other marketing campaigns.
Plus, the form states exactly what the user will be receiving – Free tips!
Good microcopy calms the negativity within a situation. If a user reaches an error page, the response must be short, friendly, and provide informative instructions on what the user should do next.
AirBnB’s 404 page shows exactly this. No-one wants to be greeted with “Page not found”. So AirBnB made sure this wasn’t the case by turning it into a moment of joy with an animated image, and even listed their important pages for users to navigate to, rather than reaching a dead-end.
And finally, where microcopy UX is not educating the user on what has happened, then this is just going to make them hate you.
Anyone remember these error notifications from Windows?
Error messages should always be clear and helpful. And thankfully, Windows realised the immense frustration they were causing and decided to jazz up their error messages with a bit more detail:
Our final points
We have outlined the user experience benefits that your business can enjoy. Now, how about the actual appearance:
- Don’t make your font too small (keep in mind accessibility)
- Don’t use too many styles across the site (don’t be an attention seeker)
- Consider colour association (Green for progress, Red for errors)
- Colour contrast can also be great for bringing the attention.
- Make sure there is enough white space around your micro-copy.
With any new technique, we always suggest split testing to see what works for your customers. You may want to trial different styles of writing (serious vs. humorous), or you might think that different colours can affect your conversions. Every business if different, and you won’t know unless you try!
Microcopy UX is so important to help guide your users to take action. You’re showing them that you are not a machine, and that you do actually care about them being there and engaging with your business. You can show off your brand a lot better and give your customers a good reason to stay 🥳