UXPA Boston Conference 2024

Have you heard about the endless possibilities of design tokens, but aren’t sure where to start? This presentation lays out the basics of this new technology, and how a new or existing style library can be adapted to use design tokens. By establishing a shared language designers and developers can understand, it addresses how to rethink design styles as individual tokens and provides concrete examples of how to rename existing elements.

Applying these principles, we will explore how this tokenized approach expands out from basic styles like color, size, and type. Using the power of nesting tokens to define the patterns of styles that make up our design libraries, we will dive into the multi-tier naming system that allows our style definitions to expand as deep or wide as we need them to.

After examining what the multi-tier naming system looks like when mapped to an example component library and walking through a style library built out using design tokens, you will better understand how design tokens allow a single style library to quickly cover multiple brands and themes. We finish by addressing how to discuss adopting this new technology with your development partners.