UX writing guide – part two: how to use text in product design
In part one, we talked about UX writing basics for creating understandable text. But writing clearly is not quite enough for product design — you also need to collaborate with marketing, developers, and other teams to get the text exactly right. The writing needs to blend with the rest of the design to create a cohesive experience.
Here are some ways to make sure your well-crafted UX writing integrates with the rest of the product design.
Not all UX writing needs to have a boring, neutral voice. Understandable text can have personality too, as long as it fits with the product’s overall personality.
Of course, be mindful of what is appropriate. Who is the audience and what is an appropriate reading level or experience level? Is humor okay? Is the product voice friendly and playful, or informative and serious? As mentioned in Part 1, what jargon is appropriate or inappropriate?
Consider the error messages on Mailchimp, a newsletter service known for their cheeky personality. First, notice in the example below that the button labeled “Return To The Dashboard” is clear and concise, so the important action is understandable without anything cute. But Mailchimp also uses clever, appropriate humor in their microcopy that works well here.
Obviously, the same personality that Mailchimp uses would not fit a serious, trusted product like a healthcare or government website.
The internet is full of examples of horrifically inappropriate messages given their context — for example, social media sites congratulating users for a ‘popular”\’ post in which they expressed the grief of losing a loved one. (Sara Wachter-Boettcher’s book Technically Wrong is full of such examples of bad design decisions and I recommend reading it!) Consider the different contexts in which people may interact with your UX writing to avoid these mistakes in tone.
To summarize: when you are writing product text with personality, know the users, the context, and the product voice.
Use consistent terminology
In most kinds of writing, using the same words repeatedly is tiresome. In the case of UX writing though, be sure that the specific terminology you use is consistent throughout the product, even if it feels a little redundant.
For example, don’t alternate between calling something a ‘homepage’ and a ‘dashboard’. Or a ‘cart’ and a ‘shopping bag’. Or switch between labels that say ‘delete’ and ‘remove’. Make sure the words are consistent, so users know what’s what.
Follow a visual hierarchy
A visual hierarchy is a way to create a sense of order on a page using design elements like font size, font style, color, and white space. A page’s design should clearly communicate which information is the most important by how ‘important’ it looks.
So, you should make sure that text fits into a visual hierarchy so the information is cohesive. UX writing is useful only when it exists in a context that is easy to follow, where users have the text when they need it (and in the order they need it).
You might want to design the few most important buttons — like Log In and Save-type stuff — to visually contrast with the rest of the page to make them more noticeable. The same goes for important writing, like warning messages or important instructions.
Visual hierarchies can be simple, too. In UserZoom articles, as with most articles, we use headings and subheading to create a visual hierarchy. The different-sized headings help organize the content on the page and group information in a logical way.
For complex experiences or products, consider how to best present information in pieces, providing more specificity as users get deeper into the process. Users are less likely to get confused or overwhelmed when they only see as much information as they need. This process of gradually introducing information is called progressive disclosure.
For example, you can show users only a short description and a few options to get them started. Then provide more specialized information and choices later in the experience.
Duolingo, an app for teaching languages, uses progressive disclosure to gradually introduce learners to lessons and other features. The first thing a user does after choosing a language to learn is choose whether to start a language from scratch or start with a placement test. As wonderfully understandable as the text itself is, it also shows up at the right time: when users are setting up their path for language learning. Then, more options appear later.
After looking through some basics in Part 1 and some tips for integrating text into design here in Part 2, you are poised to write clear, concise, and consistent content to support a good product experience. Again, there is a lot to learn, so here are a few additional resources:
- Dan Brown wrote a great article full of UX writing tips
- Nick Babich wrote a list of 16 Rules of Effective UX Writing on UX Planet
- For more in-depth learning, Scott Kubie wrote a helpful book called Writing for Designers
Becca Kennedy is a Human Factors Psychologist and co-founder of Kennason, a UX consulting company in Upstate New York. Say hello on Twitter: @becca_kennedy