Mastering Design Tokens in Barcelona: A Workshop Recap

On November 7th, DOOR3 brought its Mastering Design Tokens workshop to sunny Barcelona, marking another successful installment in its series of hands-on UX training events. Held in the heart of Spain’s vibrant tech community, the workshop drew a diverse group of designers, developers, and product managers eager to enhance their skills and bring new efficiencies to their workflows. Led by seasoned UX professionals Jon Allen and Tom McClean, the event provided a deep-dive into the practical application of design tokens, covering everything from basic setup to advanced techniques for building a design-to-development pipeline.

Breaking Down the Basics

Design tokens have become an essential component of modern design systems, serving as the connective tissue between design and development. They encapsulate core design properties like color, typography, and spacing in a format that can be easily shared across platforms and teams. However, the concept can be daunting for those unfamiliar with it.

The workshop began with a clear, accessible overview of what design tokens are and why they matter. Jon and Tom emphasized how tokens ensure consistency, scalability, and efficiency in design systems, helping teams avoid costly misalignment between design and development.

Tom McClean, workshop co-lead, shared a key takeaway:

"The beauty of these in-person workshops is getting really hands on with the group. The group was really engaged, asked a lot of tough questions, which led us to improvise and switch up the agenda on the fly. That was fun, adapting the needs of the audience, and hopefully giving them value."

Tools of the Trade: Tokens Studio and Figma Variables

A significant portion of the workshop was dedicated to exploring the tools that make tokenization possible. Participants worked extensively with Tokens Studio and Figma Variables, two leading tools in the industry. These platforms allow for seamless integration between design and development environments, simplifying the process of maintaining large-scale design systems.

Attendees learned how to define, organize, and manage tokens in Tokens Studio, then sync those tokens with Figma Variables to ensure their designs remain consistent across multiple projects. The instructors also demonstrated how to export tokens for use in development, transforming them into platform-specific formats that developers can easily implement.

Real-World Application: Hands-On Exercises

One of the workshop’s most praised aspects was its hands-on approach. Participants weren’t just passive learners—they were actively applying what they learned to real-world scenarios. Guided exercises allowed attendees to experiment with setting up tokens, linking them across components, and troubleshooting common issues.

For many, this was a transformative experience. Marc Perello, Senior Designer at Toptal recounted how:

“It was an insightful immersion into the world of design tokens, where we learned to use current tools to bridge design and development. A highly useful workshop for anyone interested in finding resources to streamline the digital design process and create efficiencies between designers and developers. Highly recommended!”

The workshop encouraged participants to bring challenges from their own projects, creating a collaborative atmosphere where solutions were tailored to specific needs. This practical, problem-solving focus ensured that attendees left with actionable insights and strategies they could implement immediately.

Overcoming Common Pitfalls

No tokenization journey is without its challenges, and Jon and Tom were candid about the potential pitfalls. They shared lessons learned from their years of experience, covering topics like:

• Inconsistent Naming Conventions:How poor naming can lead to confusion and errors across teams.
• Token Overload:Strategies for managing large token libraries without overwhelming users.
• Cross-Team Collaboration:Ensuring smooth handoffs between design and development.

By addressing these common issues like naming conventions, the workshop equipped participants with the foresight to avoid them in their own workflows. The instructors emphasized the importance of governance—establishing clear guidelines for how tokens should be created, maintained, and used.

The Road Ahead: More Workshops and Learning Opportunities

For those who missed the Barcelona event, there’s good news: DOOR3 has more workshops planned. Each session builds on the success of previous ones, continually refining the curriculum to meet the needs of design professionals at all levels. Whether you’re new to design tokens or looking to refine your existing practices, these workshops offer invaluable opportunities to learn from the best in the industry.

Upcoming Events Include:

• New York City: February 6th, 2025
• London: Spring 2025 (Date TBA)

In addition to our live workshops, DOOR3 continues to expand its library of online resources, including our blog series on building your own design-to-development pipeline. These resources are designed to complement the workshops, offering participants a chance to deepen their understanding and stay updated on the state of the field.

Conclusion: Empowering the UX Community

The “Mastering Design Tokens” workshop in Barcelona was more than just a learning event—it was a step toward building a stronger, more unified UX community. By sharing their expertise, Jon Allen and Tom McClean have empowered participants to drive meaningful change within their organizations.

As the field of UX continues to evolve, staying ahead requires more than just keeping up with trends—it means mastering the tools and techniques that will define the future. This workshop series is a testament to DOOR3’s commitment to innovation in our design and development work.

For those ready to take their design systems to the next level, DOOR3’s workshops are an opportunity not to be missed. Whether you’re joining the next session in New York or catching up through the blog series, there’s never been a better time to dive into the world of design tokens.