핵심 아이디어
Primitive, Semantic, Component-specific의 3단계 토큰 구조를 활용하여 디자인과 개발 간 단절을 해소하고 유연한 디자인 시스템을 구축할 수 있다.
요약
Figma의 Variables 기능과 Storybook을 연계하여 디자인 리소스를 코드와 일관되게 관리하며, HeadlessUI를 활용해 커스터마이징 용이성을 확보했다. 컴포넌트 상태값(Hover, Disabled 등)을 공통 규칙으로 표준화하여 토큰의 수를 67% 줄이고 관리 효율성을 높였다.
견해
최소한의 리소스(디자이너 한 명, 개발자 두 명)로도 효율적인 디자인 시스템을 구축할 수 있다는 점이 매우 현실적이며, 특히 MVP 개발 환경에서 활용 가치가 높아 보인다.