Skip to main content

UX Writing. First steps

 

Most buttons simply say “more” or “OK”. That’s a shame, because language has much more to offer. Especially on a user interface. In today’s digital world, mobile app usability is critical. An important part of this is the language used in UI design.

 

UX Writing Style Guide.

To ensure consistent use of language within your app, it is important to define guidelines for handling interaction text within the user interface. A good UX writing style guide is the key to satisfied users. With UX writing specifications, you answer questions like: What is the “Tone of Voice” of your brand? How do you write error messages? How do you handle form field texts? How do you phrase your “call to action”?

The UX Writing Style Guide serves as a tool for your UX designers and interaction designers. You ensure that already in an early wire frame phase the whole design team can work with “real” material. And of course, you’ll also prevent the development team from single-handedly texting unsympathetic, robot-like error messages.
For the inexperienced, creating a UX writing style guide can be challenging.

The list below should show you the best way to go about creating a text style guide in Figma.

Identify the “Tone of Voice” of your brand.
Before you start creating the style guide, you should be clear about the “Tone of Voice” of your brand. This can be serious, serious, playful or humorous.

2. set the rules.
Specify how error messages, form field texts and “Call to action” should be formulated.

3. create templates.
Create a separate file in Figma, with pages for each category. Within the pages you can elaborate each point in detail and build appropriate tokens and components. This allows your UX designers to work with “real” elements at the wireframe stage, testing and ensuring that your UX writing works in practice.

4. give examples.
Give examples of how the rules are applied in different scenarios.

5. test and revise.
Create usability testing scenarios that specifically test the understandability of the language, as well as the acceptability of your chosen tone of voice. This can be done, for example, through tasks such as performing a transaction or troubleshooting an error in the app. This way, you can make sure your UX writing style guide not only looks good in Figma, but also works in practice.”

You can find inspiration for the content of a UX writing style guide at well-known giants like MailChimp, Slack or Starbucks. The links will not take you to the Figma templates, of course. But still give a good overview of what questions you need to ask yourself:

 

Mailchimp

https://styleguide.mailchimp.com/

UX Writing Agency for Mobile App Example

In summary, creating a UX writing style guide in Figma is an important step to ensure consistent application of the “tone of voice” in the user interface. By identifying your brand’s “Tone of Voice,” setting rules, creating a template, and providing examples, you can ensure that your app is easy to use and provides a good user experience.