
Is one year of design token struggles really worth it?
About
The story of long and painful 12 months of introducing design token into one of my project.
- Why it took so much time?
- Why we after all didn't ship it?
- What blockers did we face along the road?
- Is it REALLY worth it?
I will more or less orbit around below bullet points to construct the final storytelling:
1. Phases description - selected phases of the journey, explanation of the general idea and execution plan
2. Good intentions, bad outcome - what went bad, why we didn't spot that we are doing circles for 12 months
3. Lessons learned - what have i learned during that period of time
4. It is still worth it - conclusion on my 12 months crusade that help me build next design tokens within a 1 month and ship it.
Watch the full talk
Watch this WaysConf session, then continue with related talks or explore the current programme.
Talk in brief
In this WaysConf 2024 session, Lead Product Designer Daniel Wodziczka shares insights gained from a year of implementing design tokens following the launch of Figma variables. Base claims evaluate whether the organizational effort required to adopt tokens delivers proportional value. Wodziczka balances key technical benefits—such as easy setup, automated dark mode, and responsive scaling—against significant organizational red flags, including adoption friction and the hidden costs of retrofitting legacy codebases. The talk highlights why token systems thrive when built alongside new products with cross-functional support, but often struggle when forced into established systems without leadership buy-in. Ultimately, Wodziczka characterizes design tokens as a high-risk, high-reward methodology that demands early alignment, clear timing, and active team education.
Key takeaways
- 01
Native Tooling Lowers the Learning Threshold
Native software features like Figma variables make experimenting with primitive and semantic abstraction levels accessible without custom plugins. Designers can validate token architecture in real time using minimal setup.
Watch from 2:41 - 02
Organizational Buy-In Is Mandatory for Deployment
Token initiatives developed in isolation struggle to gain traction if decision-makers and engineering partners are not actively involved. Grassroots efforts without dedicated timeline allocation often stall before reaching production.
Watch from 7:30 - 03
Semantic Tokens Automate Adaptive Layouts and Themes
Setting up semantic aliases simplifies complex design requirements, such as generating dark modes or adjusting responsive font scales. Automated inheritance reduces manual style swapping across component variants.
Watch from 10:52 - 04
Timing Token Integration Matches System Maturity
Building tokenized foundations works best when a new product has stabilized its initial screens and functional UI patterns. Attempting to tokenize too early during exploratory phases creates unnecessary maintenance overhead.
Watch from 17:42 - 05
Retrofitting Legacy Codebases Incurs High Re-work Costs
Replacing established styling architectures with tokens requires overriding existing Figma libraries and refactoring production code. Teams should carefully evaluate if the refactoring overhead justifies the operational disruption.
Watch from 18:47
Video chapters
- 0:34Introduction and Talk Overview
Daniel introduces his background as an agency designer and outlines the session agenda evaluating design tokens after one year.
- 2:21Accessible Entry into System Foundations
Native tool support like Figma variables significantly lowers the learning curve for setting up tokenized foundations.
- 5:40Systemic Collaboration Requirements
Grassroots token initiatives fail when key cross-functional partners and organizational decision-makers are excluded.
- 9:11Operational Speed and Automated Consistency
Semantic tokens streamline design workflows by automating dark mode theming and responsive typography across breakpoints.
- 12:22Team Onboarding and Timeline Pressures
Rushed delivery deadlines and insufficient training block broader organizational adoption of newly deployed token systems.
- 15:42Initial Setup Timing for New Products
Tokenization works best when applied after a new product moves beyond early exploration into initial functional patterns.
- 18:43Architectural Friction in Refactoring Legacy Systems
Injecting token structures into established codebases and existing Figma libraries introduces heavy re-work and delivery risks.
- 21:54Evaluating Token Investment and Final Verdict
Design tokens offer high returns but demand early recognition of organizational red flags to avoid wasted effort.
Read edited transcript highlights
These concise notes were edited from automatic captions and checked against the talk structure. They are not a verbatim transcript.
Lowering the Entry Barrier for Design Tokens
Reflecting on a year of working with design tokens following the launch of Figma variables, the entry barrier for building advanced systems has never been lower. Native tool support eliminates the need for custom plugins or complex workarounds, allowing designers to move directly from theoretical concepts like semantic levels and primitive structures to live testing. While initial terminology around taxonomy and governance can feel overwhelming, hands-on experimentation quickly reveals a structured, logical methodology. Tokenizing core foundations such as color palettes, border radii, and breakpoints provides robust flexibility while keeping the base system manageable.
Watch from 2:41Why Token Systems Need Early Alignment
Building token foundations requires broad cross-functional involvement rather than working in isolated design scratchpads. Successful adoption depends on securing dedicated time from developers, collaborating with fellow designers, and gaining explicit support from team leads or executive decision-makers. In an early attempt to introduce tokens, the structural work was completed in isolation without leadership buy-in or developer alignment, resulting in the initiative getting deprioritized in project backlogs. Design tokens represent an operational model for the entire team, meaning single-person implementations rarely succeed without shared ownership from the start.
Watch from 7:30Streamlining Dark Mode and Typography
The practical value of semantic tokens becomes clear through the elimination of tedious manual styling tasks, particularly surrounding dark mode and responsive design. Rather than creating separate component variants and tracking color changes manually, semantic mapping allows components to re-theme automatically based on active variable modes. Similarly, typography tokens can be linked to responsive breakpoints so that a single header style automatically scales down from desktop to mobile screens. Establishing these rules at the foundational level guarantees speed and visual consistency throughout all downstream components.
Watch from 10:52Training Teams Amid Delivery Deadlines
Reaching production deployment with a tokenized system is only half the battle; ensuring team adoption requires dedicated onboarding time. During a second implementation effort, tokens successfully landed in both design files and production code, yet full adoption stalled due to aggressive project deadlines. Team members lacked the time and bandwidth to learn the updated token structure, preventing them from applying the variables correctly in daily work. Technical deployment must be paired with structured training and operational support, or teams will default to familiar legacy habits.
Watch from 13:43Determining the Ideal Phase for Tokenization
Introducing design tokens yields the highest return on investment when applied to newly emerging products that lack an established design system. During early product exploration, heavy system construction should be paused until core UI patterns and initial screens solidify. Once a product passes this preliminary stage and functional flows take shape, building tokenized foundations alongside growing features creates a clean, scalable setup with minimal risk. Aligning system growth directly with product maturity ensures low overhead and smooth adoption across engineering and design.
Watch from 17:42The Hidden Costs of Refactoring Legacy Systems
Retrofitting an established design system with tokens presents severe technical and organizational challenges. Replacing existing foundations in a live project demands extensive re-work across complete Figma libraries, full component sets, and uncomponentized code instances. Unless an organization deliberately halts feature development to focus entirely on refactoring, forcing tokens into mature codebases generates frustration, breaking changes, and wasted effort. Teams should weigh these substantial migration risks carefully before attempting to tokenize existing legacy systems.
Watch from 18:47

