역할 기반 디자인 토큰

지정하신 소스 문서(raw/AI 협업 UI 디자인을 위한 DESIGN.md 작성 가이드 및 모범 사례.md)를 바탕으로 개념 노트 **‘역할 기반 디자인 토큰’**을 작성하였습니다.

생성된 위키 노트 파일: 역할 기반 디자인 토큰.md

---

주요 반영 사항

1. 스키마 및 프론트매터 준수:
   • type: concept, status: draft, core: false, created: 2026-08-27, updated: 2026-08-27 및 sources 출처 표기를 완벽히 적용하였습니다.
2. 역할 기반 디자인 토큰 핵심 체계 정리:
   • 표면적 네이밍(blue, gray-1)과 역할 기반 네이밍(primary, surface, border-subtle)의 대비 분석표 구성
   • 디자인 의사결정 고도화 4단계 프레임워크 (원시 값 → 목적 → 근거 → 제약 및 금지 조건)
   • 컴포넌트 결합 및 상태 전이(State Transitions: Hover, Active, Disabled, Loading, Focus) 명세 기술
3. 구체적 코드 및 실사례 반영:
   • Roxy Tech Modernism 스타일 시스템 기반의 DESIGN.md YAML 프론트매터 및 마크다운 본문 사양 예시
   • 역할 기반 토큰(CSS Custom Properties)을 참조하여 제작된 React/TypeScript ActionButton 컴포넌트 코드 포함
   • Google Stitch, Claude Code, Cursor 등 최신 AI 에이전트 도구 명시
4. 지식 그래프 연동:
   • [[디자인 토큰]], [[DESIGN.md]], [[CSS 사용자 정의 속성 기반 이중 레이어 토큰]], [[미니 디자인 시스템]], [[AI 환각 현상]], [[코딩 에이전트]], [[Google Stitch]] 등의 Obsidian 위키링크를 배치하여 유기적인 지식 연동 유도