huashu-design
무엇인가
huashu-design은 AI 코딩 에이전트가 HTML을 매개로 고해상도 프로토타입·슬라이드·모션 그래픽·인포그래픽을 산출하도록 설계 절차를 주입하는 스킬이다. 규율하는 영역은 디자인 산출물의 품질 관리다. 브랜드 자산이 주어졌을 때 그것을 읽어내는 순서, 요구가 모호할 때 방향을 좁히는 절차, 결과물이 AI가 만든 티가 나는 시각적 최대공약수로 수렴하지 않도록 막는 규칙을 담는다.
어떻게 동작하나
동작 방식은 파일 묶음이다. SKILL.md 단일 파일이 아니라 references/, assets/, scripts/, demos/ 네 하위 디렉터리에 흩어진 99개 참조 자원을 함께 요구한다. 슬래시 명령이나 훅이 아니라 에이전트에 자연어로 요청할 때 로드된다. 핵심 규칙은 세 갈래다. 특정 브랜드가 걸리면 질문→검색→다운로드→색값 grep→brand-spec.md 작성의 5단계를 강제하는 브랜드 자산 프로토콜, 가정과 플레이스홀더를 먼저 적고 초기에 사용자에게 보여준 뒤 반복하는 주니어 디자이너 워크플로, 보라색 그라디언트·이모지 아이콘·Inter 디스플레이 같은 AI slop 패턴을 금지하는 시각 규칙이다. 요구가着手 불가능할 만큼 모호하면 60종 HTML 네이티브 스타일 라이브러리를弹药로 삼아 세 가지 방향의 실제 시안을 병렬 생성하는 설계 방향顾问으로 분기한다.
무엇과 다른가
프롬프트를 직접 작성하는 방식과의 차이는 자산과 스크립트가 동봉된다는 점이다. 60종 HTML 네이티브 스타일 라이브러리, DOM computedStyle을 PowerPoint 객체로 옮기는 html2pptx.js, Playwright 클릭 테스트, MP4/GIF 내보내기 명령이 규칙 파일과 함께 배포된다. Figma 플러그인이나 별도 그래픽 도구를 거치지 않고 브라우저에서 렌더되는 HTML을 산출물로 삼는다. Claude Design이 그래픽 도구 자체를 개선하는 방향이라면 이 스킬은 도구 계층을 에이전트 안으로 흡수한다.
어떻게 쓰나
설치는 npx skills add alchaincyf/huashu-design 한 줄이다. 설치 후 ~/.claude/skills/huashu-design/ 같은 디렉터리에 SKILL.md 외 하위 디렉터리가 있는지 확인한다. skills CLI 1.5.15 이하에 단일 파일만 동기화하는 버그가 있어 1.5.19 이상으로 올린 뒤 다시 설치하거나, git clone으로 저장소를 skills 디렉터리에 직접 복제한다. 첫 사용은 에이전트에 「AI 심리학 강연 PPT를 만들고 스타일 방향 3개를 제안해줘」 같은 문장을 넣는 것으로 시작한다.
전제와 한계
Claude Code, Cursor, Codex, OpenClaw, Hermes 등 skills를 읽는 에이전트에서 동작한다. 디자인→렌더→MP4/PDF/PPTX 내보내기 경로는 로컬에서 돌고 네트워크와 키를 요구하지 않는다. 클라우드 기능(음성 합성, AI 리뷰)은 scripts/cloud/에 분리되어 있고 사용자 키와 명시적 확인이 필요하다. 레이어 단위로 편집 가능한 PPTX를 Figma로 넘기는 것은 지원하지 않고, 3D·물리 시뮬레이션·입자 시스템 수준의 애니메이션은 범위 밖이다. 브랜드 자산이 전혀 없는 백지 상태에서는 품질이 60~65점으로 떨어진다.