Subatomic Design Tokens Course: Chapter 2 now live!

We’re thrilled to announce that Chapter 2 of our Subatomic Design Tokens Course is now live! This chapter provides 74-minutes of video diving deep into design token architecture and foundations. We cover a ton of ground, including:

  • What an MVP token system looks like
  • The three-tiered token architecture that serves as the backbone of a sound design token system
  • In-depth color systems, detailing how brand, visual, UX, and accessibility best practices are delivered through the three-tiered color token system
  • In-depth typography systems, including how composite tokens are used to ensure related tokens always travel together
  • Spacing systems and the importance of an 8-point (or 4-point) grid
  • The nuances of border, shadow, and animation tokens

The three-tiered token system consists of three tiers:

  • Tier 1 tokens define all of the ingredients available to the design token system
  • Tier 2 tokens map Tier 1 tokens to specific roles in a user interface
  • Tier 3 tokens are reserved for component-specific and other special use cases

We then detail how color, typography, spacing, border, shadow, and animation all flow through this three-tiered architecture in order to create the flexibility your design system needs to power a multitude of products, brands, color modes, and more.

We also discuss important concepts like how composite tokens are used for typography, shadow, and animation.

Holy smokes, it feels so good to finally be able to dive deep into these topics that we’ve worked through again and again and again.

And it’s all coming together! In addition to the first two completed chapters, the course also has over 2 hours of preorder-exclusive video content, dozens of links, and actionable steps you can take while we develop the full course content. Our Slack instance and fun Figjam board are full of design token (and music!) enthusiasts; it’s been a ton of fun to grow a vibrant and positive community.

If any of this sounds good, we hope you consider preordering the course. If you’re on the fence, just listen to this great (and unsolicited!) initial feedback from people who have preordered the course:

It’s been amazing to watch your preview content and know that you’ll be addressing the code implementation side of tokens. There are plenty of resources out there talking about the basic concepts of design tokens, which I get, but having the words like code package managers, package import to target applications, npm, yarn, etc are the real important stuff to get the tokens working. I love how you’re empowering designers like myself to be on the same playing field with the engineers so we can collaborate.Angie Badillo

From the very first finished chapter, I was hooked. The way you break down the history, the roles, and the perspectives of both designers and developers—it’s like finally getting a nutrient-packed meal after years of snacking on half-baked Design Systems content. Most other courses I’ve taken either cater exclusively to designers or feel like they’re built for the 1% of Design System royalty—neither of which is particularly useful when you’re just trying to build something solid. Paul Papagiannis

Between that high praise and all of the great and thoughtful feedback we’ve gotten that will make the course the best it can be, we’re energized as we blast out the next chapter! We hope you consider preordering! You’ll get over 25% off the full price, receive first access to everything, and join a growing community of wonderful design tokens nerds.

If you have questions, need help convincing your boss, or want to know if what we’re covering will address your teams’ needs, don’t hesitate to reach out!