design-systems

Installation
Summary

Framework-based guidance for building and scaling design systems from product leaders at Figma and Airbnb.

  • Covers four core principles: separating conceptual design from production output, leveraging design systems for organizational scaling, creating self-teaching assets, and evolving beyond flat design toward dimensional interfaces
  • Provides assessment questions to determine scope (component library, tokens, documentation), adoption strategy, and success metrics
  • Flags common pitfalls including premature systematization, over-engineering for non-designers, lack of ownership, poor adoption, and treating systems as static rather than evolving
  • Guides users through staged rollout, from defining the smallest viable version to planning long-term maintenance and evolution
SKILL.md

Design Systems

Help the user build and scale design systems using frameworks from 4 product leaders who have built design systems at companies like Figma and Airbnb.

How to Help

When the user asks for help with design systems:

  1. Assess the need - Determine if they need consistency, speed, or both, and whether they're at the right stage for a design system
  2. Define the scope - Clarify whether they need a component library, design tokens, documentation, or all three
  3. Design for adoption - Help them make the system easy enough that non-designers can use it correctly
  4. Plan for evolution - Guide them on how to maintain and evolve the system over time

Core Principles

Separate concept from production

Bob Baxley: "Once we locked down on the block frames, we could send it to an agency and they could do the full high-res comps in a day, because they knew exactly what they were doing." Use low-fidelity 'block brain diagrams' to lock down conceptual logic, then apply the design system for rapid high-fidelity output.

Design systems drive enterprise expansion

Related skills
Installs
1.3K
GitHub Stars
890
First Seen
Jan 29, 2026