메뉴
검증 통과한 디자인 팩을 GitHub 공개 레포로 구조화하고, 팩을 탐색·필터·복사할 수 있는 Next.js 카탈로그 웹사이트로 빌드해 Vercel에 배포하는 방법론 스킬. catalog-publisher 에이전트가 사용한다. 레포 레이아웃, README/CONTRIBUTING/LICENSE 구성, 정적 사이트 사양, 배포 절차, 자체 QA 체크리스트를 규정한다.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Claude로 PPT·발표자료나 웹사이트를 만들 때, AI 기본 미감(보라 그라디언트·둥근 카드·천편일률)으로 수렴하지 않도록 80가지 검증된 디자인 스타일 팩 중 하나를 골라 그 명세대로 생성하게 하는 스킬. 사용자가 "PPT/슬라이드/덱/발표자료" 또는 "웹사이트/랜딩페이지/UI"를 만들어 달라고 하면서 "디자인 팩", "특정 스타일로", "다양하게", "뻔하지 않게", "고급스럽게", "○○ 느낌으로", "design-pick" 을 언급하거나, 팩 슬러그(예: web-velvet-dark-boutique, ppt-mckinsey-ghost-deck)를 직접 지정하면 반드시 이 스킬을 사용한다. 무슨 느낌인지 말하면 어울리는 팩 2~3개를 추천하고, 사용자가 고른 팩의 정밀 디자인 명세를 적용해 결과물을 생성한다. 후속으로 "다른 팩으로", "팩 바꿔", "추천 다시"도 이 스킬. 단순 텍스트 작성·요약은 이 스킬을 쓰지 않는다 — 디자인 결과물(슬라이드/웹페이지) 생성에만 쓴다.
디자인 팩의 산출 형식(prompt.md + tokens.json + preview.png + meta.yaml)과 카탈로그 인덱스(catalog.json)를 정의하는 단일 진실 원천(SSOT) 스킬. 팩을 집필·검수·발행하는 모든 에이전트(pack-architect, ppt/web curator, catalog-publisher)가 따른다. 팩 파일 구조·필드·토큰 키·슬러그 규칙·스키마 변경 절차를 규정한다.
PPT/프레젠테이션 고유의 시각 관용을 디자인 팩으로 증류하는 지식 스킬. ppt-pack-curator가 사용한다. 16:9 슬라이드 캔버스, 슬라이드 타입 위계, 그리드·여백, 차트·다이어그램 스타일링, 발표 가독성을 검증 가능한 prompt.md 지시로 옮기는 방법을 규정한다.
Claude가 산출하는 PPT·웹사이트 디자인의 천편일률 문제를 해결하는 '디자인 팩 카탈로그' 제작 오케스트레이터. 공개 디자인 시스템·비주얼 스타일을 수집·증류해, Claude Code에 복붙하면 그 스타일이 재현되는 디자인 팩 (prompt.md + tokens.json + preview.png + meta.yaml)을 만들고, baseline 대조로 다양성을 검증한 뒤 GitHub 공개 레포 + 카탈로그 웹사이트로 발행한다. 7인 에이전트 팀(소싱·스키마·PPT집필·웹집필·렌더·다양성QA·발행)을 파이프라인으로 조율한다. 트리거 — "디자인 다양성", "디자인 팩", "디자인 팩 카탈로그", "디자인 시스템 카탈로그", "PPT 디자인 다양화", "웹 디자인 팩", "프롬프트형 디자인 시스템", "Claude 디자인 천편일률", "디자인 팩 만들어줘". 후속 작업 — "팩 추가", "PPT 팩 N개 더", "웹 팩 추가", "특정 팩만 다시", "다양성 검증 다시", "팩 재집필", "스키마 변경", "카탈로그 사이트 재배포", "레포 갱신", "재실행"도 모두 이 스킬로 처리한다. 단순 PPT 1건 제작은 korean-premium-deck, 단순 웹사이트 1건은 frontend-design을 사용한다.
공개 디자인 시스템·UI 키트·비주얼 스타일 운동을 발굴해 PPT/웹 트랙별 스타일 후보를 만드는 리서치 스킬. design-scout 에이전트가 사용한다. 1차 출처 확인, 스타일 축 매트릭스 기반 다양성 확보, 라이선스 위생, PPT 20 + 웹 20 시드 후보 목록을 제공한다.
팩 적용 샘플을 baseline과 시각 대조해 다양성 점수를 매기고 합격/반려를 판정하는 방법론 스킬. diversity-qa 에이전트가 사용한다. 5축 채점 루브릭, 정량 보조 지표(perceptual hash·색 히스토그램· 엣지 밀도), 두 종류의 실패 정의, 팩 간 유사도 매트릭스 작성법을 규정한다.
| name | catalog-publishing |
| description | 검증 통과한 디자인 팩을 GitHub 공개 레포로 구조화하고, 팩을 탐색·필터·복사할 수 있는 Next.js 카탈로그 웹사이트로 빌드해 Vercel에 배포하는 방법론 스킬. catalog-publisher 에이전트가 사용한다. 레포 레이아웃, README/CONTRIBUTING/LICENSE 구성, 정적 사이트 사양, 배포 절차, 자체 QA 체크리스트를 규정한다. |
catalog-publisher가 디자인 팩 카탈로그를 GitHub + 웹사이트로 발행할 때 따르는 방법.
design-diversity/
README.md ← 프로젝트 목적·사용법·카탈로그 개요
CONTRIBUTING.md ← 새 팩 추가 절차 + 스키마 링크
LICENSE ← 명세·토큰의 재배포 라이선스
catalog.json ← 머신리더블 인덱스
design-packs/{slug}/ prompt.md · tokens.json · preview.png · meta.yaml
site/ ← Next.js 카탈로그 앱
방문자가 30초 안에 "왜·무엇·어떻게"를 알게 한다:
prompt.md를 복사해 Claude Code에 붙여넣고 "이 스타일로 만들어줘"라고 요청. 카탈로그 사이트 링크.CONTRIBUTING.md), 라이선스.LICENSE는 이 레포가 배포하는 것(디자인 명세·토큰·문서)에 적용한다. 권장: MIT 또는 CC BY 4.0.
README·CONTRIBUTING에 명시할 경계: "각 팩은 공개 디자인 시스템·스타일에서 학습한 시각 원리의 명세이며, 특정 제품의 상표·로고·독점 자산을 재배포하지 않는다. 각 팩의 출처는 meta.yaml에 기재한다." 라이선스 모호 팩(license: unclear)은 발행 전 pack-architect와 함께 정리한다.
catalog.json + design-packs/ 폴더에서 정적 생성(SSG). 런타임 DB 없음.prompt.md를 원클릭 복사한다. 복사 버튼이 가장 눈에 띄어야 한다.preview.png 썸네일 + display_name + 트랙 배지 + axes 태그. status가 pass가 아니면 draft 배지를 투명하게 노출.frontend-design 스킬의 미감 원칙을 참고하되 카탈로그는 중립적 톤으로(특정 팩 스타일에 치우치지 않게).site/에서 빌드 — npm run build 통과 확인.배포 보고 전 직접 확인:
npm run build 성공, 콘솔 에러 없음preview.png가 깨지지 않음catalog.json의 팩 수 = design-packs/ 폴더 수draft/escalate/render_failed 상태 팩이 배지로 정직하게 표시됨기존 site/·레포가 있으면 전면 재생성하지 않고 증분 반영(새 팩 카드 추가, catalog.json 갱신). "사이트 재배포"만 요청되면 빌드·배포만 수행한다.