UI & Design

Session Synopsis

Tired of manually updating colors, fonts, and spacing across your projects? Discover how design tokens can revolutionize your front-end workflow by becoming the single source of truth for design decisions. In this session, we’ll explore how integrating design tokens with Storybook, Figma, and Drupal creates a seamless, scalable, and collaborative design system.

You’ll learn how Storybook’s interactive environment bridges the gap between design and development, enabling real-time collaboration and reducing inconsistencies. We’ll walk through practical implementation strategies, best practices, and real-world examples to help you build efficient, adaptable, and future-proof design systems.

Whether you're a designer, developer, or product owner, this session will equip you with the tools and insights to streamline your workflow, enhance team collaboration, and deliver consistent user experiences at scale.

Key Takeaways

  • Consistency Across Projects: Establish a uniform design language with design tokens as the authoritative source.
  • Enhanced Collaboration: Improve communication between designers and developers using Storybook and Figma.
  • Scalability: Extend design systems across large projects while maintaining coherence.
  • Efficiency: Reduce time and effort through reusable components and streamlined workflows.
  • Adaptability: Respond quickly to design changes with a modular, token-driven approach.
  • Design System Management: Simplify updates and maintenance of design systems.

Learning Objectives

  • Understand how design tokens serve as a central source of truth for scalable and consistent design systems.
  • Learn how Storybook’s interactive environment fosters seamless collaboration between design and development teams.
Session Track
Experience Level
Intermediate