Menu
Pencil Design Harness의 구조를 개선하고 업그레이드하는 스킬. 다음 상황에서 반드시 이 스킬을 사용할 것: - "하네스 업그레이드해줘", "스킬 개선 필요", "harness-creator", "하네스 개선" - 디자인 평가 점수가 낮을 때 개선 방향 안내 - 새 평가 축 추가 또는 워크플로우 변경이 필요한 경우 - "하네스가 뭐야?", "하네스 이용법 알려줘" 등 하네스 사용법 질문 시
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
| name | harness-creator |
| description | Pencil Design Harness의 구조를 개선하고 업그레이드하는 스킬. 다음 상황에서 반드시 이 스킬을 사용할 것: - "하네스 업그레이드해줘", "스킬 개선 필요", "harness-creator", "하네스 개선" - 디자인 평가 점수가 낮을 때 개선 방향 안내 - 새 평가 축 추가 또는 워크플로우 변경이 필요한 경우 - "하네스가 뭐야?", "하네스 이용법 알려줘" 등 하네스 사용법 질문 시 |
| allowed-tools | Read, Write, Edit, Glob, Grep, Agent, WebSearch |
harness/ 3계층 구조를 분석하고 지속적으로 개선한다.
harness/
├── knowledge/ ← Layer 1: 디자인 평가 기준 (design-craft.md)
├── agents/ ← Layer 2: 평가 에이전트 (design-evaluator.md)
└── engine/ ← Layer 3: 워크플로우 (design-journey.md, level-achievement-system.md)
1. harness/logs/*.md 에서 관찰사항 수집
2. harness.config.json 현재 버전 확인
3. 변경 대상 계층 식별 (knowledge → agents → engine 순서)
1. 상위 계층부터 순서대로 변경
2. harness.config.json 버전 범프
3. harness/docs/vX.Y.Z.md 변경 문서 작성
1. 계층 간 참조 정합성 확인
2. 스킬의 upgrade_history 기록 확인
| 변경 유형 | 버전 범프 | 예시 |
|---|---|---|
| 패치 (0.0.x) | 문서 수정, 예시 추가 | design-craft.md 기준 조정 |
| 마이너 (0.x.0) | 새 평가 축, 워크플로우 변경 | Case W에 접근성 축 추가 |
| 메이저 (x.0.0) | 전체 구조 재설계 | 3축 → 5축 변경 |
사용자가 하네스에 대해 질문하면 다음을 안내한다:
하네스(Harness)는 Pencil 디자인 작업의 품질을 측정하고 개선하는 시스템입니다.
주요 기능:
1. Case A 평가: WPF 애니메이션을 조사해서 wpf-animation.pen 템플릿 보강 품질 측정
2. Case B 평가: 템플릿을 참고해서 프로젝트 디자인(정적+애니메이션 가이드) 품질 측정
3. Case C 평가: 웹사이트 애니메이션 분석 → JSON 기법 정의서 → 펜슬 컴포넌트 품질 측정
4. Case W 평가: Pencil 디자인을 HTML로 구현할 때 품질 측정
5. RPG 시스템: 작업마다 XP를 획득하고 레벨업하는 게이미피케이션
6. 자가 개선: 평가 관찰사항을 축적하여 스킬을 업그레이드
사용법:
- "WPF 애니메이션 조사해서 펜슬에 그려줘" → Case A 워크플로우 시작
- "wpf-animation 참고해 OO 디자인해줘" → Case B 워크플로우 시작
- "OO사이트 애니메이션 조사해서 템플릿 강화" → Case C 워크플로우 시작
- "펜슬 참고해서 HTML 만들어줘" → Case W 워크플로우 시작
- "하네스 업그레이드해줘" → 이 스킬(harness-creator) 실행
Pencil Design Harness를 이용한 디자인 작업을 실행하는 스킬. Case A(WPF 조사→템플릿 보강), Case B(템플릿 참고→프로젝트 디자인), Case C(웹 애니메이션→JSON→펜슬 컴포넌트), Case D(DesignMD 영입→펜슬 복제), Case S(컨셉아트→스프라이트 시트), Case M(영상/레퍼런스→Blender 3D 모델링→Three.js 웹), Case W(Pencil→HTML) 워크플로우를 실행하고 평가한다. 다음 상황에서 반드시 이 스킬을 사용할 것: - "WPF 애니메이션 조사해서 펜슬에 그려줘" → Case A - "wpf-템플릿조사 후 템플릿보강해" → Case A - "애니메이션 컴포넌트 추가해줘" → Case A - "wpf-animation 이펙트를 참고해 OO 디자인해줘" → Case B - "펜슬을 이용해 OO 디자인" + wpf-animation 참고 언급 → Case B - "OO사이트 애니메이션 조사해서 템플릿 강화" → Case C - "URL 분석해서 애니메이션 JSON 정리해줘" → Case C - "웹 애니메이션 카피캣" → Case C - "designmd에서 OO 디자인 영입해줘" → Case D - "디자인엠디 디자인 시스템 복제" → Case D - "DESIGN.md 펜슬에 프레임 단위로 복제" → Case D - "악단컨셉 스프라이트 만들어줘" → Case S - "캐릭터별 스프라이트 시트 생성" → Case S - "컨셉아트에서 캐릭터 분리해줘" → Case S - "배경 투명 스프라이트 추출" → Case S - "유튜브 영상 분석해서 블렌더로 모델링하고 웹으로 구현해줘" → Case M - "영상→blend 3d→html 플로우" → Case M - "블렌더로 모델링 먼저 하고 Three.js로 재구축해줘" → Case M - "레퍼런스 영상 보고 3D 씬 만들어 웹으로" → Case M - "펜슬 참고해서 HTML 페이지 만들어줘" → Case W - "디자인을 웹으로 구현해줘" → Case W - "디자인 평가해줘"
Pencil MCP를 이용해 아키텍처 다이어그램, 시스템 설계도, 플로우차트, ERD 등 기술 모델링 스케치를 .pen 파일로 생성하는 스킬. 설계 의도를 시각적으로 표현하는 데 집중하며, 코드가 아닌 다이어그램/설계도 산출물을 만든다. 다음 상황에서 반드시 이 스킬을 사용할 것: - "펜슬을 이용해 OOO 그려줘", "펜슬로 OOO 설계도 그려" - "펜슬 이용해 다이어그램 그려", "펜슬로 아키텍처 그려줘" - ".pen 파일로 OOO 만들어줘", "디자인 파일로 OOO 스케치" - "시스템 구조도 그려줘", "플로우차트 그려줘" (펜슬/pen 언급 시) - "ERD 그려줘", "상태 다이어그램 그려줘" (펜슬/pen 언급 시) - design/ 디렉토리에 .pen 파일 생성이 필요할 때 - "WPF 애니메이션 조사해서 펜슬로 그려줘", "WPF 컨트롤 디자인 아이디어" - "XAML Storyboard 시각화", "WPF Blend 애니메이션 서칭해서 디자인" - WPF/XAML 컨트롤의 애니메이션 상태 전환을 시각적으로 표현할 때 - "WPF 템플릿 마이그레이션", "XAML을 WPF앱에 마이그레이션 해줘" - "Blend에서 편집할 수 있게 변환해줘", "design-wpf-app에 추가해줘" - "WPF 애니메이션 Blend 호환으로 변환", "XAML UserControl로 변환" - design/xaml/sample/ 의 XAML을 design-wpf-app/migrated/ 로 전환 요청 시 - "이미지 생성해줘", "그림 만들어줘", "일러스트 생성", "이미지 그려줘" - "제미나이로 이미지 만들어", "제미나이 이용해 이미지 생성", "Gemini 이미지" - "제트이미지를 이용해 이미지생성", "z-image로 그려줘", "ComfyUI로 이미지", "로컬로 이미지 생성" - "gpt로 이미지 만들어", "gpt2 이미지 생성", "gpt-image로 그려줘", "openai 이미지 생성" - "OOO 내용으로 이미지 생성해줘" 패턴 모두 - "이미지 편집해줘", "이 이미지를
YouTube URL 또는 로컬 영상 파일을 받아 구간별 프레임을 추출하고, 노래·춤·연주 등 인물의 동작과 안무를 시퀀스 단위로 분석하는 스킬. yt-dlp로 영상을 받고 ffmpeg로 타임스탬프가 박힌 콘택트 시트(타일 몽타주)를 만들어, 한 장의 이미지에서 여러 프레임의 자세 변화를 한눈에 읽어낸다. 스프라이트/애니메이션 키프레임 참고에 적합. 다음 상황에서 반드시 이 스킬을 사용할 것: - "이 유튜브 영상 분석해줘", "유튜브 구간별 프레임 분석", "영상 동작 분석해줘" - "이 영상에서 노래부르는 사람 동작 분석", "가수 제스처 분석해줘" - "춤/안무 동작 분석", "댄스 프레임 분석", "이 영상 안무 따줘" - "연주자 동작 분석", "퍼포먼스 동작 시퀀스 분석" - "영상에서 캐릭터 동작을 스프라이트/애니메이션 키프레임으로 뽑아줘" - YouTube URL 또는 로컬 mp4/webm 파일과 함께 "동작/움직임/포즈/제스처" 분석 요청 - "영상 프레임 추출해줘", "콘택트 시트 만들어줘", "영상 타임라인 분석"
Pencil Design Harness를 이용한 디자인 작업을 실행하는 스킬. Case A(WPF 조사→템플릿 보강), Case B(템플릿 참고→프로젝트 디자인), Case C(웹 애니메이션→JSON→펜슬 컴포넌트), Case D(DesignMD 영입→펜슬 복제), Case W(Pencil→HTML) 워크플로우를 실행하고 평가한다. 다음 상황에서 반드시 이 스킬을 사용할 것: - "WPF 애니메이션 조사해서 펜슬에 그려줘" → Case A - "wpf-템플릿조사 후 템플릿보강해" → Case A - "애니메이션 컴포넌트 추가해줘" → Case A - "wpf-animation 이펙트를 참고해 OO 디자인해줘" → Case B - "펜슬을 이용해 OO 디자인" + wpf-animation 참고 언급 → Case B - "OO사이트 애니메이션 조사해서 템플릿 강화" → Case C - "URL 분석해서 애니메이션 JSON 정리해줘" → Case C - "웹 애니메이션 카피캣" → Case C - "designmd에서 OO 디자인 영입해줘" → Case D - "디자인엠디 디자인 시스템 복제" → Case D - "DESIGN.md 펜슬에 프레임 단위로 복제" → Case D - "펜슬 참고해서 HTML 페이지 만들어줘" → Case W - "디자인을 웹으로 구현해줘" → Case W - "디자인 평가해줘", "점수 매겨줘" → 평가 실행
펜슬 디자인 데모 사이트를 GitHub Pages로 배포하고, 블룸펜슬(ai-studio) 저장소의 최신 기능/템플릿/샘플을 현재 프로젝트로 영입하는 스킬. 동기화(Sync) → 배포 준비(Prepare) → 퍼블리싱(Publish) 세 단계 중 필요한 것을 수행한다. 다음 상황에서 반드시 이 스킬을 사용할 것: - "블룸펜슬 동기화해", "블룸펜슬 싱크", "bloom pencil sync" - "ai-studio에서 최신 영입", "상위 저장소 최신 반영", "최신 기능/템플릿/샘플 동기화" - "배포준비 해주세요", "배포 준비", "deploy 준비" - "퍼블리싱 해주세요", "배포해줘", "publish", "디자인 샘플 배포" - "데모 사이트 업데이트", "GitHub Pages 배포" - "샘플 페이지 퍼블리싱", "태그 달아줘"
Pencil MCP를 이용해 아키텍처 다이어그램, 시스템 설계도, 플로우차트, ERD 등 기술 모델링 스케치를 .pen 파일로 생성하는 스킬. 설계 의도를 시각적으로 표현하는 데 집중하며, 코드가 아닌 다이어그램/설계도 산출물을 만든다. 다음 상황에서 반드시 이 스킬을 사용할 것: - "펜슬을 이용해 OOO 그려줘", "펜슬로 OOO 설계도 그려" - "펜슬 이용해 다이어그램 그려", "펜슬로 아키텍처 그려줘" - ".pen 파일로 OOO 만들어줘", "디자인 파일로 OOO 스케치" - "시스템 구조도 그려줘", "플로우차트 그려줘" (펜슬/pen 언급 시) - "ERD 그려줘", "상태 다이어그램 그려줘" (펜슬/pen 언급 시) - design/ 디렉토리에 .pen 파일 생성이 필요할 때 - "WPF 애니메이션 조사해서 펜슬로 그려줘", "WPF 컨트롤 디자인 아이디어" - "XAML Storyboard 시각화", "WPF Blend 애니메이션 서칭해서 디자인" - WPF/XAML 컨트롤의 애니메이션 상태 전환을 시각적으로 표현할 때 - "WPF 템플릿 마이그레이션", "XAML을 WPF앱에 마이그레이션 해줘" - "Blend에서 편집할 수 있게 변환해줘", "design-wpf-app에 추가해줘" - "WPF 애니메이션 Blend 호환으로 변환", "XAML UserControl로 변환" - design/xaml/sample/ 의 XAML을 design-wpf-app/migrated/ 로 전환 요청 시 펜슬이나 .pen 파일이 언급되지 않은 일반 이미지 생성은 image-gen 스킬을 사용한다.