Categories
Design Tips Featured UX Design

A brief guide to UX microcopy

A brief guide to UX microcopy

Illustration inspiration
Illustration by Ouch.pics

hen it comes to design, most people would immediately link it to visuals and appearances and they’re not entirely wrong. But UX design isn’t that simple, it’s more than just aesthetically pleasing interfaces. There’s only so much your design can convey without any written copy.

Think about it, there’s no point in designing a super cool button when the call-to-action is missing — the user will have no idea of its purpose.

“Don’t ever diminish the power of words. Words move hearts and hearts move limbs.” — Hamza Yusuf

Though it isn’t a new term, the role microcopy plays in design is something many UX designers need to become more aware of. A few words are all it takes to have an impact on the user’s experience. With just a few words, you can either encourage your users to complete a purchase or drive them away from your product.

Microcopy vs Copy

Microcopy refers to all the little bits of copy that are not content. These short sentences or words tell a user what to do, address user concerns, and provide context to a component that requires a different approach than traditional marketing-oriented copywriting.

The target audience is where the major difference lies. With content marketing, the greater focus is on the customer — their desires, the problems that they wish to solve with your particular product or service.

In contrast, microcopy focuses on the user, who is the same entity, just at a different stage of their digital journey. Microcopy steps in once the customer becomes the user and now needs some help with adequately using the product or service and getting their desired benefit out of it.

Designers = Writers?

Traditionally, microcopy has always been done by the UX designer; maybe with help from the marketing team. Yet writing and language proficiency are not typically something designers are well-versed in. It’s outside the scope of our expertise and responsibilities, and tasking us to come out with stellar copy alongside a great design might lead to burnout or subpar results.

This is why we’re witnessing a rise of a new position and job scope that focuses exclusively on microcopy — the UX writer. Whereas the UX designer focuses on the visual aspects of the design, the UX writer takes care of its linguistic peculiarities.

A UX writer’s job is to help the user have a positive experience while using the product. They need to understand the user’s pain point and behavior, in order to craft engaging microcopy and improve the product’s overall usability.

UX writers are an integral part of the UX team, and they work closely with business development, strategy, marketing, and sales to understand their perspectives and incorporate them into the product experience.

The benefits of microcopy

An effective microcopy seeks to understand and anticipate the user’s expectations. It allows the user to feel like they are having a conversation with the interface. Users desire more than just pretty colors and nice illustrations on their screen, they want to be understood.

We must keep in mind that the copy is often the most human part of the entire interaction with our product. It is the element which allows the product to speak with its users, answering their questions, giving them directions, and prompting them to take action

Below are some key benefits of an effective microcopy:

Removing doubt and confusion

Users drop out of the conversion funnel for all kinds of reasons. I’m not saying that UX writing would solve all your problems but it would definitely help if your users drop out due to the following reasons:

  • Ambiguous or confusing messages
  • Too many jargons
  • Unclear shipping charges
  • Not enough information is given about the product
  • Uncertainty on how to proceed

Mailchimp

Mailchimp does a good job by explicitly telling their users the requirements for their password which prevents them from encountering multiple errors.

UX microcopy

This example from Dribbble shows how a few sentences can not only provide context into what the product is about, but also prompt action with a call-to-action button.

A brief guide to UX microcopy

When it comes to microcopy, less is more. Keep it simple and straight to the point. WeTransfer’s microcopy is short and concise, yet it clearly explains the benefits of using it.

 

Foster relationships and connection

Blending emotions into your microcopy creates an energy-filled atmosphere where trust grows and users are more willing to act. It will also add a human element to your product, which could make a difference between a positive and generic experience.

Always remember to be empathetic and use the correct tone at the right time. If an error occurs or the user needs help, using the wrong words could backfire and leave a negative impression on the user.

UX microcopy

Muzzle does a great job of being fun and delightful by showing a list of notification messages with cheeky content to illustrate their point and show the benefit of their feature — blocking notifications from your screen.

A brief guide to UX microcopy

Microcopy provides brands with further opportunities to convey personality. Dollar Shave Club, which is known for its sarcastic and humorous tone of voice, adds extra bullet-points to product descriptions purely for entertainment purposes.

Builds trust and confidence

Digital products tend to raise some inherent concerns, such as security and privacy. If a product isn’t transparent, it may cause users to hesitate, think twice, and ultimately abandon it. From the user’s point of view, these are some of the questions they might ask themselves — can be extracted through user research:

  • Why are you asking for my phone number?
  • Will you spam me with marketing emails?
  • Why do you need my credit card when it’s free?
  • What do I have to do to not get charged?
  • Is this process secure?

Microcopy can be used to respond to those questions, giving users the confidence they need to see the process through to completion.

UX microcopy

Linkedin builds trust by explaining why it requires the user’s credit card for a free trial — eliminating any doubt or fears that the user will be charged for it. It’s better to be upfront to your user, especially if you require them to give you confidential information; or if payment is part of the process.

 

“Small words can have a significant impact”

The benefits of effective UX microcopy are substantial; increased user engagement, brand loyalty, trust, and frictionless product experiences. When used correctly, good microcopy can help your product stand out in a highly competitive market.

————————————–

Related articles:

————————————–

A brief guide to UX microcopy

Via Jeremiah Lam

Categories
Design Tips UI Design UX Design

What is UI/UX design? What’s the difference?

What is UI/UX design? What’s the difference? UI design and UX design are two of the most often confused and conflated terms in web and app design. And understandably so. They’re usually placed together in a single term, UI/UX design, and viewed from the surface they seem to be describing the same thing. It’s often hard to find solid descriptions of the two that don’t descend too far into jargon. But fear not!

What follows is an easy-to-digest primer on these terms.

By the end of this article, you’ll have a good understanding of what differentiates them and how they relate to each other. So let’s dive in!

What is UI Design?

The “UI” in UI design stands for “user interface.” The user interface is the graphical layout of an application. It consists of the buttons users click on, the text they read, the images, sliders, text entry fields, and all the rest of the items the user interacts with. This includes screen layout, transitions, interface animations and every single micro-interaction. Any sort of visual element, interaction, or animation must all be designed.

This job falls to UI designers. They decide what the application is going to look like. They have to choose color schemes and button shapes — the width of lines and the fonts used for text. UI designers create the look and feel of an application’s user interface.

 

UI design process
UI design process by Ramotion

UI designers are graphic designers. They’re concerned with aesthetics. It’s up to them to make sure the application’s interface is attractive, visually-stimulating and themed appropriately to match the purpose and/or personality of the app. And they need to make sure every single visual element feels united, both aesthetically, and in purpose.

What is UX Design?

“UX” stands for “user experience.” A user’s experience of the app is determined by how they interact with it. Is the experience smooth and intuitive or clunky and confusing? Does navigating the app feel logical or does it feel arbitrary? Does interacting with the app give people the sense that they’re efficiently accomplishing the tasks they set out to achieve or does it feel like a struggle? User experience is determined by how easy or difficult it is to interact with the user interface elements that the UI designers have created.

What is UX Design
Photo by CareerFoundry

So UX designers are also concerned with an application’s user interface, and this is why people get confused about the difference between the two. But whereas UI designers are tasked with deciding how the user interface will look, UX designers are in charge of determining how the user interface operates.

They determine the structure of the interface and the functionality. How it’s organized and how all the parts relate to one another. In short, they design how the interface works. If it works well and feels seamless, the user will have a good experience. But if navigation is complicated or unintuitive, then a lousy user experience is likely. UX designers work to avoid the second scenario.

Designing in a vacuum leads to less than ideal results.

There’s also a certain amount of iterative analysis involved in UX design. UX designers will create wireframe rendering of their interface interactions and get user feedback. They’ll integrate this into their designs. It’s important for UX designers to have a holistic understanding of how users prefer to interact with their applications.

How They Work Together

So a UX designer decides how the user interface works while the UI designer decides how the user interface looks. This is a very collaborative process, and the two design teams tend to work closely together. As the UX team is working out the flow of the app, how all of the buttons navigate you through your tasks, and how the interface efficiently serves up the information user’s need, the UI team is working on how all of these interface elements will appear on screen.

Let’s say at some point in the design process it’s decided that extra buttons need to be added to a given screen. This will change how the buttons will need to be organized and could require changing their shape or size. The UX team would determine the best way to lay out the buttons while the UI teams adapt their designs to fit the new layout. Constant communication and collaboration between UI and UX designers help to assure that the final user interface looks as good as it can, while also operating efficiently and intuitively.

User Interface Design Inspiration
Magic store app. By Yi Li  | this is part of User Interface Design Inspiration post

Research is Key

Research is vital for both UI and UX designers. It’s important for both disciplines to gather as much good information as possible to assist them in crafting appropriate designs, and both follow a similar approach.

Both will research what users want. What they expect from applications of the sort being developed. This research is often iterative, involving usability sessions, where real users will interact with scaled versions of certain functionality or visual designs being tested to determine whether the designers are moving down the proper path. Feedback is integrated with each iteration.

This process involves generating low fidelity prototypes, like wireframe renderings of interface elements in order to gauge a user’s response strictly to the functionality being tested. This can also involve fast visual prototypes and A/B tests of different possible versions of the look and feel of the interface to determine which one users prefer.

In all cases research helps guide the steps designers take as they build their contributions. However, the information UI and UX designers are looking for is very different.

What is UI/UX design
All Screens By Surja Sen Das Raj  | this is part of User Interface Design Inspiration post

Research in UI Designs

UI designers need to make sure the visual language they choose fits the class of application they’re writing. They’re trying to predict user expectations. If your team is designing a travel app, it’s important to research how other travel apps have been developed in the past. Which ones worked? Which ones didn’t? There are design lessons to be learned from the work others have done before.

Research might indicate that people prefer outlined icons instead of bold shapes. This is a visual shorthand that people are comfortable with and enjoy. UI designers would then do well to incorporate that lesson.

The exact aesthetic they choose is up to them, but the basic “rules,” or the need to conform to user expectations, is something designers ignore at their own risk.

Not to say risks shouldn’t be taken. UI designers want their interface designs to stand out and be memorable. But this must be balanced against making sure people recognize the purpose of the elements you’re placing on screen.

UIUX Inspiration
Tourism Service — Mobile App By Anastasia | this is part of User Interface Design Inspiration post

Research for UX Design

UX design is particularly interested in user expectations. All of the experiences and interactions that users have had with every application they’ve used in their lives have helped set their expectations for how interfaces are supposed to work. If a UX designer isn’t intimately familiar with these expectations, they could inadvertently design an interface interaction that seems logical to them but breaks commonly accepted conventions. Users don’t like when an interface behaves very differently than they were expecting, and this could negatively impact their experience.

If a UX designer decides to do something different, they need to have a very good reason, because breaking a deeply trained expected behavior will likely cause people to do the wrong thing frequently.

As an example, most people are comfortable with the idea that you click twice on a file to open it and once to select it. This is an interface behavior that has existed almost as long as there have been graphical user interfaces.

UI Design Inspiration
Touch Panel for Smart Shower By Ivan Balog | this is part of User Interface Design Inspiration post

UI vs. UX: Two Very Different Disciplines that Work in Harmony

UI design and UX design involve very different skill sets, but they are integral to each other’s success. A beautiful design can’t save an interface that’s clunky and confusing to navigate, and a brilliant, perfectly-appropriate user experience can be sunk by bad visual interface design that makes using the app unpleasant. Both UI and UX designs need to be flawlessly executed and perfectly aligned with pre-existing user expectations to create an excellent user interface/experience. And when those stars align the results can be astounding.

————————————–

Related articles: