---

$350^.00 $450^.00 Register for this workshop → 5 × 2h live sessions + Q&A. Apr 8–23.
With all video recordings & slides. Get a ticket.

“Light and dark mode across five brands, with unique requirements for web and native apps, plus classic and cozy style options.”

Sound familiar? Modern design systems are asking more from designers than ever before. While today’s tools give us the power to work faster with fewer resources, organizing these design decisions across platforms, brands, and accessibility requirements has become increasingly complex.

The result? Design tokens that are rigid and hard to scale, component libraries bursting with variants, and frustrated team members who can’t find what they need.

In this workshop, you’ll learn to strategically structure your design tokens for scalable, multi-dimensional theming. Gain practical skills to streamline your design system and bridge the gap between design and development.

---

What You Will Learn

The workshop focuses on practical skills you can apply immediately.

Working in small, collaborative groups, you’ll learn how to transform complex system requirements into a scalable token structure that can adapt to future needs. Through hands-on exercises and real-world scenarios, you’ll practice mapping design decisions as visual representations of future-friendly themes.

Once your themes are shaped, you’ll learn to craft intuitive token names that bridge the gap between design and development workflows. Your token structure will be robust enough to power automation while remaining user-friendly for cross-functional team members who need to find the right color, font, or spacing for their project.

You will gain practical skills to create future-friendly themes and manage scalable design systems:

• Identifying business goals and objectives that can measure the success of your future friendly theming efforts
• Transform wishes and requirements from cross-functional team members into functional design decisions within a design system
• Map complex design requirements into flexible, scalable token structures that support future growth
• Visualize multi-dimensional themes that can handle multiple brands, products, platforms, or visual styles based on past, present and future system requirements
• Build maintainable token naming conventions that support automated workflows between design and development and are user-friendly for non-technical team members
• Use visual mapping techniques to plan, document, and communicate design decisions
• Token and Theme organization strategies that improve adoption across cross-functional teams
• Practice giving and receiving feedback and presenting ideas in a safe space
• Stress test and iterate on Tokens and Themes based on feedback and shifting priorities from an organization
• Strategies for implementation, maintenance, and version control in design tools and code repositories

By the end of the workshop, you will know how to apply systems thinking to solve real-world problems common in scaling organizations and learn how to present your design system solutions to cross-functional team members and stakeholders with clarity and confidence.

Why You Should Attend?

Gone are the days of themes = light and dark. Today’s systems designers are now facing challenges like:

• “How do we structure our components to handle light mode, dark mode, AND high contrast mode across 5 brands?”
• “Where should themes live in our token structure when we need to support both web and native apps?”
• “How do we organize these decisions so marketing can find the right brand colors, product designers can use component libraries that don’t have 1000 variants, and developers aren’t pulled into another QA meeting because the spacing on a button is off?”

If you’re wrestling with questions like these, you’re not alone. Many designers jump straight into creating tokens or variables in Figma without visualizing how their design decisions should flow through their system. This leads to rigid token structures that become difficult to expand as the system scales and priorities shift.

This workshop teaches you how to step back and visualize your system’s needs before diving into implementation. You’ll learn proven approaches to organizing themes and tokens that scale with your organization, whether you support multiple brands, clients, products, platforms, accessibility requirements, or all of the above.

Building these foundations now pays off in a big way down the line. Instead of constantly rebuilding your token structure as new requirements come in, you’ll have a flexible system that can adapt to future needs while remaining simple enough for everyone to understand and use.

---

Who Should Attend

This workshop is ideal for anyone who wants to build a system where they “flip a few switches” to change existing designs, components and patterns when project needs change without needing to rebuild.

• Designers wanting to understand how and where their design decisions should “live” in their system to support future-friendly themes.
• People working in Design Systems or building component libraries who want more flexibility without building more components.
• Agency, freelance, or in-house designers who need to support multiple brands, products, or white-label solutions with efficient theme management.
• Product designers ready to level up their system design skills to better support scaling teams, organizations, and products

Experience with design tools like Figma is helpful but not required. We’ll be using visual mapping techniques that work for any design tool or platform. For the more hands-on implementation days (Days 5-6), Sam will demonstrate examples using Figma, Tokens Studio, and Github, but the principles can be applied to any token management workflow.

If you have specific workflow or tool requests, let Sam know, and she will try to accommodate them!

A basic understanding of design tokens, design systems, and how components are built in code will help you get the most out of this workshop. Some additional learning resources will be sent out ahead of the workshop so everyone has the same baseline knowledge.

What hardware/software do you need?

• A free Figma account to use FigJam to participate in group activities.
• Access to Zoom to attend the live workshop sessions.
• Access to Smashing’s Slack to ask questions during live workshop sessions.

Optional Tools Demonstrated by Sam:

• Paid Figma account to use Variables and Modes
• Free Tokens Studio licence to use the plugin for Figma
  • Free allows read-only access to shared workshop files.
• Free Github account to sync design tokens from Tokens Studio to a code repository.
  • Instructions for other Gitlab, Bitbucket and Azure Dev Ops are also available.
• Spreadsheet tool (Airtable is shown, but Excel or Sheets will work).
• Free GPT account to access a custom agent built by Sam to speed up Token Naming

About Sam

Sam is a Design Systems expert with a Design Tokens obsession.

As part of the Tokens Studio Team, she’s made it her mission to flatten the learning curve for designers and engineers to adopt new technologies in the Design Systems space.

From life-or-death design to genetic testing for psychedelic-assisted therapy, Sam’s career as a Design Team of One in tech innovation has given her a unique perspective on ways of working in small teams to build big things. She’s known for sharing her pro tips and experiences as Sam I am Designs as a speaker, host of design systems events, and educational content creator.

Time & Schedule

This workshop is split over five days. Our virtual doors open at 8:45, we start at 9 AM PT.

The workshop sessions will run on the following days:

• Tue, April 8, 09:00 – 11:30 AM PT
• Wed, April 9, 09:00 – 11:30 AM PT
• Tue, April 15, 09:00 – 11:30 AM PT
• Wed, April 16, 09:00 – 11:30 AM PT
• Wed, April 23, 09:00 – 11:30 AM PT

$350^.00 $450^.00 Register for this workshop → 5 × 2h live sessions + Q&A. Apr 8–23.
With all video recordings & slides. Get a ticket.

---

Day 1

8:45 am PT
Virtual doors open, registration, chat and introductions.

9:00 am – 9:50 am
Creative warm-up, interactive exploration of the fundamentals of future-friendly theming, design tokens, and systems thinking.

9:50 am – 10:00 am
Break

10:00 am – 10:50 am
Guided working session — mapping system requirements and design decisions as a high-level diagram.

10:50 am – 11:00 am
Break

11:00 am – 11:30 am
Small group activities — Think through the past, present, and future needs of a case study to create a design system requirements map that provides the foundations for future-friendly theming.

This project plan will be used throughout the rest of the workshop sessions as your end-to-end case study!

11:30 am – 12:00 pm
Q&A with Sam on the day’s material. Networking!

Day 2

8:45 am PT
Virtual doors open, registration, chat and introductions.

9:00 am – 9:50 am
Creative warm-up, review of day 1, master the concepts of systems thinking diagrams and structuring design decisions for future-friendly theming.

This is sometimes known as Token Structure or Token Hierarchy.

9:50 am – 10:00 am
Break

10:00 am – 10:50 am
Guided working session — Using the project plan from Day 1, we will create a high-level map of your themes.

This map is used to visualize how you will set up your design decisions and files in your design tool of choice.

10:50 am – 11:00 am
Break

11:00 am – 11:30 am
Small group activities — To simulate what it is like to get feedback from cross-functional team members, you’ll review each other’s work and collect suggestions on what might need to change to ensure your themes are future-friendly.

You can make some final adjustments in prep for next week’s sessions on naming your themes and design tokens so they can be migrated into a design tool to be worked with.

11:30 am – 12:00 pm
Q&A with Sam on the day’s material. Networking!

Day 3

8:45 am PT
Virtual doors open, registration, chat and introductions.

9:00 am – 9:50 am
Creative warmup, recap of week 1, interactive deep dive into crafting future-friendly names for themes and design tokens living within a system.

9:50 am – 10:00 am
Break

10:00 am – 10:50 am
Small group activities — Transform the high-level visualization of your design system created in week 1 into reusable templates for naming design tokens that cross-functional team members can actually find and use!

10:50 am – 11:00 am
Break

11:00 am – 11:30 am
Guided working session — Expect some unexpected requirements to come from your “organization” that will test your token structure and naming templates.

11:30 am – 12:00 pm
Q&A with Sam on the day’s material. Networking!

Day 4

8:45 am PT
Virtual doors open, registration, chat and introductions.

9:00 am – 9:50 am
Creative warmup, recap of day 3, guided tour of working with Design Tokens and Themes in Figma/Penpot using Tokens Studio.

You’ll receive files to follow along in real-time if you’d like.

9:50 am – 10:00 am
Break

10:00 am – 10:50 am
Guided working session — Migrate your naming templates from Day 3 into Tokens Studio and organize your Tokens to support the future-friendly themes from the maps you created in Week 1.

Option to set up a Git sync provider to version control your work outside of your design tools.

10:50 am – 11:00 am
Break

11:00 am – 11:30 am
Small group activities — Collaborate with your project team to create a design mockup using your Tokens and watch your future-friendly themes in action.

11:30 am – 12:00 pm
Q&A with Sam on the day’s material. Networking!

Day 5

8:45 am PT
Virtual doors open, registration, chat and introductions.

9:00 am – 9:50 am
Creative warmup, recap of day 3, guided tour of working with Design Tokens and Themes in Figma/Penpot using Tokens Studio.

You’ll receive files to follow along in real-time if you’d like.

9:50 am – 10:00 am
Break

10:00 am – 10:50 am
Guided working session — Migrate your naming templates from Day 3 into Tokens Studio and organize your Tokens to support the future-friendly themes from the maps you created in Week 1.

Option to set up a Git sync provider to version control your work outside of your design tools.

10:50 am – 11:00 am
Break

11:00 am – 11:30 am
Small group activities — Collaborate with your project team to create a design mockup using your Tokens and watch your future-friendly themes in action.

11:30 am – 12:00 pm
Q&A with Sam on the day’s material. Networking!