@kood/claude-code 0.5.0 → 0.5.3

package/templates/.claude/skills/execute/SKILL.md

@@ -1,3 +1,15 @@
+---
+name: execute
+description: 계획 실행 또는 간단한 작업을 즉시 구현하는 스킬. 옵션 제시 없이 최적 방법으로 바로 실행.
+user-invocable: true
+---
+
+@../../instructions/workflow-patterns/sequential-thinking.md
+@../../instructions/agent-patterns/parallel-execution.md
+@../../instructions/agent-patterns/model-routing.md
+@../../instructions/validation/forbidden-patterns.md
+@../../instructions/validation/required-behaviors.md
+
 # Execute Skill
 
 > 계획 실행 또는 간단한 작업을 즉시 구현하는 스킬. 옵션 제시 없이 최적 방법으로 바로 실행.
@@ -26,153 +38,6 @@
 
 ---
 
-<parallel_agent_execution>
-
-## 병렬 Agent 실행
-
-**목적:** 독립적인 작업을 여러 Agent가 동시에 실행하여 생산성 향상.
-
-### 권장 Agents
-
-| Agent | Model | 용도 |
-|-------|-------|------|
-| @implementation-executor | haiku/sonnet/opus | 작업 구현 |
-| @designer | sonnet | UI/UX 작업 |
-| @document-writer | haiku | 문서화 |
-| @code-reviewer | haiku | 구현 후 검증 |
-
-### Model Routing
-
-| 복잡도 | Model | 작업 예시 |
-|--------|-------|----------|
-| **LOW** | haiku | 파일 수정, 설정 변경, 문서화 |
-| **MEDIUM** | sonnet | 기능 추가, 컴포넌트 구현 |
-| **HIGH** | opus | 아키텍처 변경, 다중 파일 리팩토링 |
-
-### 병렬 실행 패턴
-
-**독립적 기능 병렬 구현:**
-
-```typescript
-// ✅ 독립적인 API 엔드포인트를 각각 구현
-Task({
-  subagent_type: 'implementation-executor',
-  model: 'sonnet',
-  prompt: 'User API 엔드포인트 구현 (GET /users, POST /users, PATCH /users/:id)'
-})
-
-Task({
-  subagent_type: 'implementation-executor',
-  model: 'sonnet',
-  prompt: 'Product API 엔드포인트 구현 (GET /products, POST /products, DELETE /products/:id)'
-})
-```
-
-**구현 + 문서화 병렬:**
-
-```typescript
-// ✅ 구현과 문서화 동시 진행
-Task({
-  subagent_type: 'implementation-executor',
-  model: 'sonnet',
-  prompt: 'Payment 통합 (Stripe API 연동, 결제 처리 로직)'
-})
-
-Task({
-  subagent_type: 'document-writer',
-  model: 'haiku',
-  prompt: 'Payment API 문서 작성 (엔드포인트, 요청/응답 스키마, 에러 코드)'
-})
-```
-
-**UI + API + 문서 병렬:**
-
-```typescript
-// ✅ 전체 기능을 역할별로 분산
-Task({
-  subagent_type: 'designer',
-  model: 'sonnet',
-  prompt: 'User Profile UI 구현 (프로필 편집 폼, 프로필 카드, 반응형 디자인)'
-})
-
-Task({
-  subagent_type: 'implementation-executor',
-  model: 'sonnet',
-  prompt: 'User API 구현 (GET /users/:id, PATCH /users/:id, 이미지 업로드)'
-})
-
-Task({
-  subagent_type: 'document-writer',
-  model: 'haiku',
-  prompt: 'User API 문서 및 컴포넌트 사용 가이드 작성'
-})
-```
-
-**구현 후 검증:**
-
-```typescript
-// ✅ 구현 완료 후 코드 리뷰
-Task({
-  subagent_type: 'implementation-executor',
-  model: 'sonnet',
-  prompt: 'Authentication 리팩토링 (Better Auth 마이그레이션)'
-})
-
-// 구현 완료 대기 후
-Task({
-  subagent_type: 'code-reviewer',
-  model: 'haiku',
-  prompt: '보안 점검 (인증/인가 로직, XSS/CSRF 방어, 민감 정보 노출)'
-})
-```
-
-### 병렬 실행 시 주의
-
-```text
-✅ 독립적인 작업만 병렬 실행 (의존성 없음)
-✅ Model 복잡도에 맞게 선택 (haiku/sonnet/opus)
-✅ 각 Agent는 Sequential Thinking으로 자율 실행
-✅ 결과 취합 후 통합 검증 (테스트, 빌드)
-
-❌ 의존성 있는 작업은 순차 실행 (A 완료 → B 시작)
-❌ 동일 파일 동시 수정 금지
-❌ 과도한 병렬화 (3-4개 이상 → 관리 복잡)
-```
-
-### 실전 예시
-
-**간단한 작업 (haiku):**
-
-```typescript
-// 설정 파일 수정 + 문서화
-Task({ subagent_type: 'implementation-executor', model: 'haiku',
-      prompt: 'ESLint 설정 업데이트 (.eslintrc.json)' })
-Task({ subagent_type: 'document-writer', model: 'haiku',
-      prompt: 'Linting 규칙 문서화 (docs/linting.md)' })
-```
-
-**보통 작업 (sonnet):**
-
-```typescript
-// 독립적인 컴포넌트 구현
-Task({ subagent_type: 'designer', model: 'sonnet',
-      prompt: 'Header 컴포넌트 (로고, 네비게이션, 사용자 메뉴)' })
-Task({ subagent_type: 'designer', model: 'sonnet',
-      prompt: 'Footer 컴포넌트 (링크, 소셜 미디어, 저작권)' })
-```
-
-**복잡한 작업 (opus):**
-
-```typescript
-// 아키텍처 변경
-Task({ subagent_type: 'implementation-executor', model: 'opus',
-      prompt: 'Monorepo 구조 변경 (apps/, packages/ 분리, Turborepo)' })
-```
-
-</parallel_agent_execution>
-
----
-
 <workflow>
 
 ## 실행 흐름
@@ -184,97 +49,6 @@ Task({ subagent_type: 'implementation-executor', model: 'opus',
 | 3. 최적 접근법 결정 | 가능한 방법 분석 → 최선 선택 | sequentialthinking |
 | 4. 즉시 구현 | TodoWrite → 단계별 구현 → 검증 | Edit/Write + TodoWrite |
 
-### Sequential Thinking 가이드
-
-**복잡도별 전략:**
-
-| 복잡도 | 사고 횟수 | 판단 기준 | 사고 패턴 |
-|--------|----------|----------|----------|
-| **간단** | 2 | 1개 파일, 명확한 변경 | 복잡도 판단 → 즉시 구현 |
-| **보통** | 3-4 | 2-3개 파일, 로직 추가 | 복잡도 판단 → 현재 상태 → 접근 방식 → 구현 |
-| **복잡** | 5+ | 다중 모듈, 아키텍처 변경 | 복잡도 판단 → 심층 분석 → 접근 방식 → 상세 계획 → 단계별 구현 |
-
-**보통 복잡도 패턴 (3-4단계):**
-
-```
-thought 1: 복잡도 판단 및 분석 범위 결정
-thought 2: 현재 상태 분석 (코드, 아키텍처)
-thought 3: 최적 접근 방식 선택 및 구현 계획
-thought 4: 단계별 구현 순서 확정
-```
-
-**복잡한 경우 패턴 (5단계):**
-
-```
-thought 1: 복잡도 판단
-thought 2: 현재 상태 심층 분석
-thought 3: 가능한 접근 방식 탐색 및 최선 선택
-thought 4: 상세 구현 계획 수립
-thought 5: 단계별 실행 순서 및 검증 방법
-```
-
-### Task Subagent 활용
-
-| subagent_type | 용도 | 예시 |
-|---------------|------|------|
-| **Explore** | 코드베이스 구조 파악, 관련 파일 탐색 | "현재 인증 구조 분석" |
-| **general-purpose** | 복잡한 분석, 다중 시스템 연관 | "여러 모듈 간 의존성 분석" |
-
-**단일 탐색:**
-
-```typescript
-Task({
-  subagent_type: 'Explore',
-  description: '현재 인증 구조 분석',
-  prompt: `
-    현재 인증 관련 코드 구조 파악.
-    - 사용 중인 라이브러리
-    - 세션 관리 방식
-    - 수정이 필요한 파일 목록
-  `
-})
-```
-
-**병렬 탐색 (복잡한 경우):**
-
-```typescript
-Task({ subagent_type: 'Explore', prompt: '프론트엔드 인증 구조 분석' })
-Task({ subagent_type: 'Explore', prompt: '백엔드 API 인증 엔드포인트 분석' })
-Task({ subagent_type: 'Explore', prompt: '데이터베이스 세션 스키마 분석' })
-```
-
-### TodoWrite 활용
-
-**복잡도별 사용:**
-
-| 복잡도 | TodoWrite | 이유 |
-|--------|----------|------|
-| **간단** | 선택적 | 1-2개 파일, 명확한 작업 |
-| **보통** | 필수 | 3-5개 파일, 여러 단계 |
-| **복잡** | 필수 | 다중 모듈, 단계별 추적 필수 |
-
-**TodoWrite 패턴:**
-
-```typescript
-TodoWrite({
-  todos: [
-    { content: '현재 구조 분석', status: 'in_progress', activeForm: '현재 구조 분석 중' },
-    { content: 'API 엔드포인트 구현', status: 'pending', activeForm: 'API 엔드포인트 구현 중' },
-    { content: '프론트엔드 통합', status: 'pending', activeForm: '프론트엔드 통합 중' },
-    { content: '테스트 실행', status: 'pending', activeForm: '테스트 실행 중' },
-  ]
-})
-```
-
-### 단계별 구현 원칙
-
-```text
-✅ 한 번에 하나씩: 한 작업 완료 → 다음 작업
-✅ 즉시 완료 표시: 작업 완료 시 바로 completed
-✅ 검증 후 진행: 각 단계 완료 후 동작 확인
-✅ 에러 처리: 실패 시 원인 분석 → 수정 → 재시도
-```
-
 </workflow>
 
 ---
@@ -435,17 +209,16 @@ Task({
 ✅ 최적 접근법 내부적으로 결정
 ✅ TodoWrite로 구현 단계 추적 (보통 이상)
 ✅ 단계별 구현 및 검증
+✅ 병렬 실행 가능 시 Agent 위임
+✅ 적절한 모델 선택 (haiku/sonnet/opus)
 ```
 
-## 절대 금지
+## 스킬별 금지 사항
 
 ```text
-❌ Sequential Thinking 2단계 미만
-❌ 코드 탐색 없이 추측으로 구현
 ❌ 옵션 제시 후 사용자 선택 대기 (바로 실행)
 ❌ TodoWrite 없이 복잡한 작업 수행
 ❌ 단계별 검증 없이 일괄 구현
-❌ 테스트 실패 상태로 커밋
 ```
 
 </validation>

package/templates/.claude/skills/figma-to-code/AGENTS.md

@@ -6,7 +6,10 @@ Figma 디자인을 코드로 변환할 때 에이전트 활용 가이드.
 
 <agents_reference>
 
-전체 에이전트 조정 가이드: @../../PARALLEL_AGENTS.md
+다중 에이전트 구조:
+- 에이전트 목록: @../../instructions/multi-agent/agent-roster.md
+- 조정 가이드: @../../instructions/multi-agent/coordination-guide.md
+- 실행 패턴: @../../instructions/multi-agent/execution-patterns.md
 
 </agents_reference>
 

package/templates/.claude/skills/figma-to-code/SKILL.md

@@ -1,3 +1,13 @@
+---
+name: figma-to-code
+description: Figma 디자인을 100% 정확하게 코드로 변환. Figma MCP로 디자인 토큰/레이아웃/에셋을 추출하여 픽셀 단위 정확도 보장.
+user-invocable: true
+---
+
+@../../instructions/agent-patterns/read-parallelization.md
+@../../instructions/validation/forbidden-patterns.md
+@../../instructions/validation/required-behaviors.md
+
 # Figma → Code (100% Pixel-Perfect)
 
 <context>
@@ -25,6 +35,302 @@
 
 ---
 
+<parallel_agent_execution>
+
+## ULTRAWORK MODE (병렬 에이전트 실행)
+
+### 기본 원칙
+
+| 원칙 | 실행 방법 | 기대 효과 |
+|------|----------|----------|
+| **PARALLEL** | 독립 작업은 단일 메시지에서 동시 Tool 호출 | 5-15배 속도 향상 |
+| **DELEGATE** | 전문 에이전트에게 즉시 위임 | 컨텍스트 격리, 품질 향상 |
+| **SMART MODEL** | 복잡도에 따라 haiku/sonnet/opus 선택 | 비용 최적화 |
+
+**핵심 룰:**
+```typescript
+// ❌ 순차 실행 (느림)
+Task(...) // 60초 대기
+Task(...) // 60초 대기
+// 총 120초
+
+// ✅ 병렬 실행 (빠름)
+Task(...) // 단일 메시지에서
+Task(...) // 동시 호출
+// 총 60초 (가장 긴 작업 기준)
+```
+
+### Phase별 에이전트 활용
+
+| Phase | 작업 | 에이전트 | 모델 | 병렬 실행 |
+|-------|------|---------|------|----------|
+| **0** | 환경 탐색 | explore | haiku | ❌ (단일) |
+| **1** | Figma 데이터 추출 | designer | opus | ❌ (필수) |
+| **1** | 토큰 추출 + 에셋 다운로드 | designer + implementation-executor | opus + haiku | ✅ (독립 작업) |
+| **2** | 컴포넌트 구현 | designer | sonnet | ✅ (여러 컴포넌트) |
+| **2** | 스타일 토큰 병합 | designer | sonnet | ✅ (독립) |
+| **2** | 에셋 압축/구조화 | implementation-executor | haiku | ✅ (독립) |
+| **3** | 반응형 브레이크포인트 | designer | sonnet | ✅ (Mobile/Tablet/Desktop) |
+| **4** | 픽셀 정확도 검증 | code-reviewer | opus | ❌ (순차) |
+
+### 에이전트별 역할
+
+| 에이전트 | 모델 | 용도 | 병렬 가능 |
+|---------|------|------|----------|
+| **explore** | haiku | 프로젝트 구조, globals.css 위치 파악 | ✅ |
+| **designer** | sonnet/opus | Figma MCP 사용, React 컴포넌트 구현, @theme 토큰 생성 | ✅ |
+| **implementation-executor** | sonnet/haiku | 에셋 WebP 압축, public/ 구조화, 로직 구현 | ✅ |
+| **code-reviewer** | opus | 픽셀 정확도 검증, 반응형 품질 검토 | ✅ |
+| **document-writer** | haiku | 컴포넌트 문서, 사용법 가이드 작성 | ✅ |
+
+### 실전 패턴
+
+#### 패턴 1: 환경 분석 → Figma 추출 → 병렬 구현
+
+```typescript
+// Phase 0: 환경 탐색 (단일)
+Task(subagent_type="explore", model="haiku",
+     prompt=`프로젝트 환경 파악:
+     - Vite/Next.js 감지
+     - globals.css 위치
+     - 기존 @theme 토큰 확인`)
+
+// Phase 1: Figma 데이터 추출 (opus로 정확도 보장)
+Task(subagent_type="designer", model="opus",
+     prompt=`Figma MCP로 디자인 데이터 추출:
+     - Variables (색상, 간격, 폰트)
+     - Auto Layout 구조 분석
+     - 에셋 다운로드 링크 생성
+     - 반응형 브레이크포인트 확인`)
+
+// Phase 2: 병렬 구현 (컴포넌트 + 스타일 + 에셋 동시)
+Task(subagent_type="designer", model="sonnet",
+     prompt=`React 컴포넌트 구현:
+     - 정확한 px 값 사용 (근사치 금지)
+     - Auto Layout → Flexbox/Grid 정확한 매핑
+     - 반응형 클래스 포함`)
+
+Task(subagent_type="designer", model="sonnet",
+     prompt=`globals.css @theme 블록 업데이트:
+     - Figma Variables → Tailwind v4 토큰
+     - 기존 토큰 병합 (덮어쓰기 금지)
+     - 자동 클래스 생성 확인`)
+
+Task(subagent_type="implementation-executor", model="haiku",
+     prompt=`에셋 처리:
+     - PNG/JPG → WebP 압축 (품질 75-90)
+     - public/images/[category]/ 구조화
+     - SVG는 압축 없이 public/icons/`)
+```
+
+**효과:** 순차 실행 대비 3배 빠름
+
+---
+
+#### 패턴 2: 반응형 병렬 구현
+
+```typescript
+// Mobile/Tablet/Desktop 동시 작업
+Task(subagent_type="designer", model="sonnet",
+     prompt=`모바일 레이아웃 (320-767px):
+     - 세로 스택 (flex-col)
+     - 폰트 크기 조정
+     - 간격 축소`)
+
+Task(subagent_type="designer", model="sonnet",
+     prompt=`태블릿 레이아웃 (768-1023px):
+     - 2열 그리드
+     - 중간 폰트 크기
+     - 적정 간격`)
+
+Task(subagent_type="designer", model="sonnet",
+     prompt=`데스크톱 레이아웃 (1024px+):
+     - 3-4열 그리드
+     - 큰 폰트 크기
+     - 넉넉한 간격`)
+```
+
+**효과:** 3개 브레이크포인트를 동시 처리
+
+---
+
+#### 패턴 3: 다중 컴포넌트 병렬 변환
+
+```typescript
+// 여러 Figma 컴포넌트 동시 구현
+Task(subagent_type="designer", model="sonnet",
+     prompt=`Header 컴포넌트:
+     - Figma Frame "Header" → React
+     - Auto Layout → Flexbox
+     - 정확한 간격, 색상`)
+
+Task(subagent_type="designer", model="sonnet",
+     prompt=`Footer 컴포넌트:
+     - Figma Frame "Footer" → React
+     - 링크, 아이콘 배치
+     - 반응형 레이아웃`)
+
+Task(subagent_type="designer", model="sonnet",
+     prompt=`Hero 섹션:
+     - 배경 이미지 WebP
+     - 타이포그래피 정확한 값
+     - CTA 버튼 스타일`)
+
+Task(subagent_type="implementation-executor", model="haiku",
+     prompt=`에셋 일괄 처리:
+     - 모든 이미지 WebP 압축
+     - public/images/ 폴더 구조화
+     - 반응형 이미지 (<picture>)`)
+```
+
+**효과:** 4개 작업을 동시 처리
+
+---
+
+#### 패턴 4: 구현 → 다중 검증
+
+```typescript
+// Step 1: 구현 (병렬)
+Task(subagent_type="designer", model="sonnet",
+     prompt="Figma 디자인 → React 컴포넌트")
+
+// Step 2: 여러 관점에서 동시 검증
+Task(subagent_type="code-reviewer", model="opus",
+     prompt=`픽셀 정확도 검증:
+     - 색상: Figma HEX vs 코드
+     - 간격: margin/padding/gap 일치
+     - 폰트: size/weight/line-height`)
+
+Task(subagent_type="code-reviewer", model="opus",
+     prompt=`반응형 품질 검증:
+     - Mobile/Tablet/Desktop 모두 Figma 일치
+     - 브레이크포인트 정확도
+     - 반응형 이미지 사용`)
+
+Task(subagent_type="code-reviewer", model="opus",
+     prompt=`에셋 품질 검증:
+     - WebP 압축 확인
+     - 폴더 구조 적절성
+     - 파일명 명확성`)
+```
+
+**효과:** 3가지 관점에서 동시 품질 검토
+
+---
+
+### Model Routing
+
+| 작업 | 모델 | 이유 |
+|------|------|------|
+| **환경 탐색** | haiku | 빠른 구조 파악 |
+| **Figma 데이터 추출** | opus | 정확한 토큰/레이아웃 분석 |
+| **컴포넌트 구현** | sonnet | UI 코드 변환 |
+| **에셋 처리** | haiku | WebP 압축, 폴더 구조화 |
+| **픽셀 정확도 검증** | opus | 세밀한 비교 |
+| **문서 작성** | haiku | 빠른 문서화 |
+
+### 병렬 실행 체크리스트
+
+작업 시작 전 확인:
+
+- [ ] 이 작업은 독립적인가? → 병렬 에이전트 고려
+- [ ] 여러 컴포넌트 구현? → 여러 designer 병렬 실행
+- [ ] 반응형 필수? → 브레이크포인트별 병렬
+- [ ] 에셋 많은가? → implementation-executor 병렬
+- [ ] 검증 다각도 필요? → 여러 code-reviewer 병렬
+
+**적극적으로 에이전트 활용. 혼자 하지 말 것.**
+
+### 실전 시나리오
+
+#### 시나리오 1: 랜딩 페이지 구현 (병렬)
+
+```typescript
+// Phase 0: 환경
+Task(subagent_type="explore", model="haiku",
+     prompt="Vite/Next.js, globals.css 확인")
+
+// Phase 1: Figma 추출
+Task(subagent_type="designer", model="opus",
+     prompt="Figma MCP: Variables, Auto Layout, 에셋, 브레이크포인트")
+
+// Phase 2: 병렬 구현 (4개 동시)
+Task(subagent_type="designer", model="sonnet",
+     prompt="Hero 섹션: 정확한 px 값, 반응형")
+Task(subagent_type="designer", model="sonnet",
+     prompt="Features 섹션: 3열 그리드, 아이콘")
+Task(subagent_type="designer", model="sonnet",
+     prompt="CTA 섹션: 버튼, 폼 스타일")
+Task(subagent_type="implementation-executor", model="haiku",
+     prompt="에셋 WebP 압축 및 public/images/ 구조화")
+
+// Phase 3: 검증 (병렬)
+Task(subagent_type="code-reviewer", model="opus",
+     prompt="픽셀 정확도 검증")
+Task(subagent_type="code-reviewer", model="opus",
+     prompt="반응형 품질 검증")
+```
+
+**예상 시간:**
+- 순차 실행: 420초 (60 + 60 + 60 + 60 + 60 + 60 + 60)
+- 병렬 실행: 120초 (Phase별 가장 긴 작업)
+- 개선: 3.5배 향상
+
+---
+
+#### 시나리오 2: 디자인 시스템 구축 (병렬)
+
+```typescript
+// Phase 1: Figma Variables 추출
+Task(subagent_type="designer", model="opus",
+     prompt="Figma Variables → @theme 토큰 매핑")
+
+// Phase 2: 병렬 컴포넌트 구현 (5개 동시)
+Task(subagent_type="designer", model="sonnet",
+     prompt="Button: Primary/Secondary/Ghost")
+Task(subagent_type="designer", model="sonnet",
+     prompt="Card: border-radius, shadow, padding")
+Task(subagent_type="designer", model="sonnet",
+     prompt="Input: focus, validation, error")
+Task(subagent_type="designer", model="sonnet",
+     prompt="Modal: overlay, animation, 접근성")
+Task(subagent_type="designer", model="sonnet",
+     prompt="Dropdown: 키보드 네비게이션, 포지셔닝")
+
+// Phase 3: 문서화 (병렬)
+Task(subagent_type="document-writer", model="haiku",
+     prompt="Button 문서: 사용법, props, 예시")
+Task(subagent_type="document-writer", model="haiku",
+     prompt="Card 문서: 레이아웃 패턴, 변형")
+Task(subagent_type="document-writer", model="haiku",
+     prompt="Input 문서: 검증, 에러 처리")
+```
+
+**효과:** 5개 컴포넌트 + 3개 문서 동시 작업
+
+---
+
+### Critical Rules (병렬 실행 시)
+
+**DO:**
+- 환경 탐색 우선 (Vite/Next.js, globals.css)
+- Figma MCP로 정확한 값 추출 (opus)
+- 독립 컴포넌트 병렬 구현 (여러 designer)
+- 에셋 처리 별도 에이전트 (implementation-executor)
+- 반응형 브레이크포인트별 병렬 (3개 designer)
+- 픽셀 정확도 검증 필수 (code-reviewer)
+
+**DON'T:**
+- 순차 실행 (독립 작업인데 대기)
+- 근사치 사용 (`gap-4` 대신 `gap-[18px]`)
+- AI 생성 에셋 (Figma 실제 파일만)
+- 반응형 생략
+- 기존 토큰 덮어쓰기
+
+</parallel_agent_execution>
+
+---
+
 <prerequisites>
 
 ## 사전 준비

package/templates/.claude/skills/global-uiux-design/AGENTS.md

@@ -6,7 +6,10 @@
 
 <agents_reference>
 
-전체 에이전트 조정 가이드: @../../PARALLEL_AGENTS.md
+다중 에이전트 구조:
+- 에이전트 목록: @../../instructions/multi-agent/agent-roster.md
+- 조정 가이드: @../../instructions/multi-agent/coordination-guide.md
+- 실행 패턴: @../../instructions/multi-agent/execution-patterns.md
 
 </agents_reference>