검증 체크리스트
AI 시대의 디자인 시스템 핸드북의 한국어/영어 동기화와 근거 점검 기준
이 페이지는 핸드북 자체를 운영하기 위한 검증 기준입니다. 디자인 시스템 문서는 한 번 작성하고 끝나는 산출물이 아니라, AI 도구와 디자인 툴 생태계 변화에 맞춰 계속 교정해야 하는 실행 문서입니다.
자동 검증
핸드북 변경 후 아래 명령을 실행합니다.
pnpm --filter handbook run check:design-systems-ai
pnpm --filter handbook run typecheckcheck:design-systems-ai는 다음 항목을 확인합니다.
| 항목 | 기준 |
|---|---|
| 페이지 구성 | 한국어와 영어 meta.json의 페이지 순서가 일치해야 합니다. |
| 파일 구성 | 등록된 모든 .mdx 파일이 양쪽 언어에 존재해야 합니다. |
| frontmatter | 모든 페이지에 title과 description이 있어야 합니다. |
| 링크 지역화 | 영어 페이지는 /books/design-systems-ai/가 아니라 /en/books/design-systems-ai/ 링크를 사용해야 합니다. |
| 검증 페이지 | 이 페이지가 모든 주요 챕터 slug를 언급해야 합니다. |
챕터 범위
| slug | 검증 관점 |
|---|---|
token-architecture | DTCG, Style Dictionary, Tailwind CSS 토큰 모델이 최신 근거와 충돌하지 않는지 확인합니다. |
component-spec | props, slots, states, variants, accessibility contract가 AI가 읽을 수 있는 구조인지 확인합니다. |
accessibility | ARIA, 키보드, focus, 이름 계산 규칙이 구현 가능한 수준인지 확인합니다. |
prompt-interface | 프롬프트 예시가 컴포넌트 선택, 금지 규칙, 검증 명령까지 포함하는지 확인합니다. |
design-md-interface | DESIGN.md가 브랜드 의도와 시각 규칙을 충분히 전달하는지 확인합니다. |
agentic-design-control | 스크린샷 검토, Playwright 검증, 에이전트 피드백 루프가 명시되어 있는지 확인합니다. |
workflow-strategies | Design-to-code, code-to-design, 양방향 동기화 흐름이 과장 없이 정리되어 있는지 확인합니다. |
ds-evolution | AI를 사용한 리팩터링, 감사, 문서 확장 절차가 운영 가능한지 확인합니다. |
context-injection | AGENTS.md, CLAUDE.md, DESIGN.md, MCP의 역할 경계가 명확한지 확인합니다. |
consistency | grid, spacing, density, responsive behavior가 검증 가능한 규칙으로 표현되어 있는지 확인합니다. |
interaction | 상태 피드백, motion token, loading/error/empty state가 포함되어 있는지 확인합니다. |
forms | validation, error copy, field composition, accessibility가 함께 다뤄지는지 확인합니다. |
agent-ui-protocols | A2UI, AG-UI, MCP Apps 같은 agent UI 논의가 현재 공개 문서와 맞는지 확인합니다. |
generative-ui | 런타임 UI 생성이 schema, registry, guardrail 없이 자유 생성으로 설명되지 않는지 확인합니다. |
spatial-multimodal | spatial, voice, multimodal 규칙이 기존 DS 토큰과 연결되어 있는지 확인합니다. |
playbook | 0 -> 1 실행 순서가 팀이 실제로 따를 수 있는 단위인지 확인합니다. |
migration | 기존 시스템 전환이 big-bang이 아니라 점진적 migration으로 설명되는지 확인합니다. |
governance | ownership, approval, review, quality gate가 문서/코드 양쪽에 연결되어 있는지 확인합니다. |
case-studies | 사례가 도구 홍보가 아니라 재사용 가능한 패턴과 한계로 정리되어 있는지 확인합니다. |
근거 갱신 기준
도구나 표준의 상태를 말할 때는 버전과 날짜를 함께 확인합니다.
| 주제 | 확인 기준 |
|---|---|
| Design Tokens | Design Tokens Format Module의 최신 published report와 DTCG 사이트를 확인합니다. |
| Style Dictionary | DTCG 2025.10 full support 여부는 Style Dictionary 공식 문서를 확인합니다. |
| Tailwind CSS | v4의 @theme와 theme variables는 Tailwind 공식 문서를 확인합니다. |
| Figma MCP | remote/desktop MCP 상태와 beta 여부는 Figma developer docs와 help center를 확인합니다. |
| React | React 19.x 기능은 React 공식 release blog를 확인합니다. |
| MCP Apps | proposal, extension, production readiness 표현은 Model Context Protocol 공식 블로그를 확인합니다. |
수동 리뷰
자동 검증은 구조를 보장하지만 내용의 품질을 보장하지 않습니다. 큰 변경에는 다음 리뷰를 추가합니다.
- 한국어와 영어 페이지가 같은 결론을 말하는지 확인합니다.
- 영어 페이지가 단순 번역을 넘어 글로벌 독자가 이해할 수 있는 설명 밀도를 갖는지 확인합니다.
- 최신 도구 이름을 쓸 때 "정식", "GA", "stable", "production-ready" 표현이 실제 출처와 맞는지 확인합니다.
- AI 워크플로우 항목은 반드시 검증 루프, 실패 모드, 금지 규칙을 함께 포함합니다.