Microcopy, micro-animation, micro-interaction. These micro's can be just that last push your visitor needs to convert. Are these micro's really so 'small' or can their proper application mean a lot for your website and conversion rate?
These "minis" are not as mini as you might expect. It's not about the finishing touches, but rather the elements that potentially 'make' your entire website. By implementing these subtle elements as well as possible, you ensure a clear website where your visitors are not held back by (technical) obstacles. You probably remember the prezi presentations that shoot in 'space' from slide one to slide two or the old flash sites where every button is animated. These are both good examples where animation and interaction hamper user experience and thus cause a poor user experience. There are too many stimuli and too much to see, distracting the visitor's attention. Micros change that.
Microcopy
Microcopy is the term for small pieces of content that make using a Web site a lot more personal. By changing the word 'Search' to 'Find' or changing '404' to 'Unfortunately, no page was found with this link. Click here to restore the website,' you speak to the visitor more personally. It's content that removes doubt from your visitors, but can also cause your visitors/customers to take action, think call-to-action (CTA) buttons. Good microcopy is a co-creation between a UX designer and a content marketer. Take a look at the example below: great text and UX design are combined.
Micro animation
Micro-animations are small pieces of animation that make the "displacement" of information on your website just a little bit clearer, supporting your visitor. By displacement of information, I mean, for example, a swipe menu, showing your visitor that there is more information than he initially sees. You give the user the illusion that the information is placed off-screen. For example, by briefly illuminating the shopping cart with the number of products just added, you show the customer where he can find the products he selected. Briefly highlighting the search field once when your website loads is also a form of micro-animation. This way you draw attention to the first interaction on the screen and point your visitor in the right direction.
Microinteraction
Subtle interactions linked to a field, button or other interaction element are called micro-interactions. Unlike micro-animations, micro-interactions focus entirely on communication based on input from the user. Not when something has happened, but at the moment something happens, such as choosing a password or 'liking' it. 'Swallowing' an e-mail when it is deleted is an example of micro-interaction. Or the example below:
The diagram below clarifies the difference between these three terms, using the graphics mentioned in microcopy and micro-animation.
Microcopy: | The hamburger icon changes to a text "main menu." |
Micro animation: | The hamburger icon changes to a minus as the menu slides out. |
Microinteraction: | The hamburger icon enlarges the moment the button is pressed. |
Microcopy: | The name field has a label, "My name is" |
Micro animation: | The name field displays three animated dots (...) |
Microinteraction: | The name field does not remain a rectangle but becomes a line as you type. |
The above micros refer to small and subtle pieces of text or animations on the website. They support your visitor and enhance the user experience. But there are other types of micros.
Microcontent
Microcontent is a small piece of text that announces longer text. Its purpose is to get your readers to click on it. Think, for example, of a preview of a news story or search result. Microcontent is often confused with a teaser. The difference with teasers, short pieces of text on the cover of a magazine, for example, is that microcontent aims to inform a reader and a teaser aims to excite the reader.
Microcontent
A micro moment is an intentional moment when people take their mobile or tablet in hand to look something up. These moments are divided into four actions that can be conveniently anticipated: I want to know something, I want to go somewhere, I want to do something and I want to buy something. Many people look up information about a travel destination, for example, in their spare time. By making your website mobile-friendly and showing clear reviews, you can win this micro-moment. In the graphic below you will find questions that Internet users might ask and that relevant companies can respond to.
I want to know something | What will be my next vacation destination? |
I want to go somewhere | Where in the area can I find a hardware store? |
I want to do something | How should I make tagliatelle? |
I want to buy something | How expensive is that lamp? |
Although micros are at first glance small or subtle adjustments or actions, they turn out to have a big effect when you apply them properly. In my opinion, micros should not be underestimated and moreover, big changes are not always better. In addition, all micros can be used at the same time and one does not have to exclude the other. They are tools to help the user and improve his or her experience on your Web site without being overpowering. While a micro will "lure" the Internet user to your Web site, the other forms of micro will allow you to persuade your visitor to take action.