정의
AI를 디자인 결과물의 ‘완성’이 아닌, 디자이너의 의사결정 병목을 해소하고 검증 속도를 높이는 도구로 사용하는 워크플로우 방법론. Figma Make, Claude Code + Figma MCP, 사내 데이터 MCP를 조합하여 초안 탐색, UT 데이터 세팅, 정책 커뮤니케이션 단계의 시간을 극적으로 단축한다.
핵심 속성
- 목표 전환: AI로 화면을 직접 그리는 대신, ‘검증하고 확정하는 흐름’에 집중
- 도구 구성: Figma Make (인-피그마 프로토타입), Claude Code + Figma MCP (HTML 프로토타입), 사내 MCP (데이터 연동)
- 적용 단계:
- 초안 방향: 여러 갈래의 시안을 동시에 생성하여 빠른 방향 결정
- UT 데이터: 유저 ID 기반으로 실제 데이터를 자동 주입 (2시간 → 15분)
- 정책 전달: 조건부 UI를 토글 가능한 인터랙티브 스펙 문서로 변환
- 측정된 효과:
- 시안 작업: 3~4일 → 반나절
- UT 데이터 세팅 (5명): 2시간 → 15분
- 정책 커뮤니케이션 반복 질문: 0건
- 제약 조건:
- 디자인시스템(ODS) 컴포넌트 자동 적용 불가 → 핸드오프 전 사람의 손길 필요
- 프롬프트 품질이 디자이너의 도메인 이해도에 의존
- 피그마 파일과 AI 프로토타입 이중 관리 부담
관계
- 20260512-ai-design-bottleneck-not-completion — 구체적 적용 사례 (의사결정 병목 해소에 집중)
- 20260512-interactive-spec-eliminates-repeated-questions — 인터랙티브 스펙의 효과를 별도 분석
- mcp-protocol — MCP(Model Context Protocol)가 이 워크플로우의 핵심 인프라임
인용
“AI가 피그마에 완벽한 화면을 바로 그려주길 기대했지만, 진짜 효과적이었던 건 AI에게 모든 걸 맡기는 게 아니라, AI로 빠르게 검증하고 확정된 방향을 피그마에서 완성하는 흐름을 만든 것이었습니다.”