educlopez/ui-craft

무엇을 해결하는가

AI 코딩 에이전트는 종종 전문적인 디자인 감각과 사용성이 부족한 일반적이고 품질이 낮은 사용자 인터페이스(이른바 "AI slop")를 생성합니다. UI Craft는 AI 에이전트에게 주관적인 디자인 규칙, 검증 도구 및 구조화된 워크플로우를 제공하여 결과물인 UI가 프로덕션 수준의 디자이너급 품질을 갖추도록 보장합니다.

작동 방식

UI Craft는 AI 코딩 하네스(Claude Code, Cursor 또는 Gemini와 같은)에 기술 또는 CLI 도구로 통합됩니다. 디자인 제어 수준을 확장하기 위해 4단계의 "사다리"를 사용합니다:

• Rung 0 (Ask): 에이전트는 간단한 프롬프트를 기반으로 디자인 지식을 사용하여 결과를 개선합니다.
• Rung 1 (Direct): 사용자는 특정 슬래시 명령(예: /craft, /polish, /animate)을 사용하여 집중적인 디자인 작업을 트리거합니다.
• Rung 2 (Persist): 브리프 및 토큰과 같은 지속적인 디자인 컨텍스트는 세션 간의 일관성을 유지하기 위해 .ui-craft/에 저장됩니다.
• Rung 3 (Enforce): 품질 게이트, MCP 서버 및 CI 디텍터는 UI가 퇴보하지 않고 10가지 항목의 수락 기준을 충족하는지 보장합니다.

또한 기존 프로젝트 스타일을 분석하는 탐색 단계와 디자인 수준, 모션 강도 및 시각적 밀도를 조정할 수 있는 "노브(knobs)" 기능도 특징입니다.

대상 사용자

전문 디자이너가 아니더라도 고충실도(high-fidelity)의 전문적인 UI를 출시하고자 하는 AI 코딩 에이전트 사용자 개발자.

주요 특징

• Scoreable Critiques: Nielsen의 10가지 사용성 휴리스틱과 6가지 고전 디자인 법칙을 기반으로 방어 가능한 점수표를 생성합니다.
• Stack-Agnostic: 다양한 프레임워크와 AI 하네스에서 작동합니다.
• Comprehensive Command Set: 와이어프레임 제작(/shape)부터 프로덕션 강화(/harden)까지 모든 것을 위한 25개의 전문화된 슬래시 명령어가 있습니다.
• Integrated Quality Gates: "AI slop"이 프로덕션에 도달하는 것을 방지하기 위해 MCP 게이트와 리뷰 에이전트를 포함합니다.