Toolabs DSM : Learn UX Text

Learn

Design Tokens - Microcopy (UX Text)

"The craft of words at a micro level, considering how words can satisfy a functional requirement by aiding and improving design interactions, enhancing interfaces for both function and delight, and helping a user on their journey."

—Christopher Murphy and Nicklas Persson, The Craft of Words

Microcopy, like sounds and animation, is one of the most important element of UI and UX design but is generally left out of design systems.

With Toolabs DSM, tokenizing UX text has all the benefits of using tokens for other visual elements, and even more:

Reusability and consistency
Building and managing a dictionary
Removes guess working by being a single source for content
Multilingual with language states

Multilingual Design with States

Once your microcopy is tokenized, localizing your content is reduced to these steps:

Create a new state for localized overrides and add each locale as a variant in that state
Switch the system to a locale and update microcopy tokens with translated value in that language.

➥

"The goal of localization should be to create a user experience that feels like it has been specifically designed for a language and culture."

—Corinna Maier, How to Create Good Multilingual UX Design

A good localization design should handle different meanings assigned to colors, symbols, or any other visuals by the culture of that locale. This is possible with Toolabs DSM by customizing any token such as colors, images, and icons for each localization variant of the system.

In the example below, primary color, microcopy tokens, and background image tokens are changed for the French state.