@kood/claude-code 0.5.1 → 0.5.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (66) hide show
  1. package/dist/index.js +163 -28
  2. package/package.json +1 -1
  3. package/templates/.claude/agents/analyst.md +6 -14
  4. package/templates/.claude/agents/architect.md +6 -14
  5. package/templates/.claude/agents/code-reviewer.md +8 -14
  6. package/templates/.claude/agents/dependency-manager.md +8 -14
  7. package/templates/.claude/agents/deployment-validator.md +8 -14
  8. package/templates/.claude/agents/designer.md +8 -0
  9. package/templates/.claude/agents/document-writer.md +6 -14
  10. package/templates/.claude/agents/explore.md +8 -3
  11. package/templates/.claude/agents/git-operator.md +63 -17
  12. package/templates/.claude/agents/implementation-executor.md +14 -37
  13. package/templates/.claude/agents/ko-to-en-translator.md +8 -13
  14. package/templates/.claude/agents/lint-fixer.md +8 -172
  15. package/templates/.claude/agents/planner.md +6 -14
  16. package/templates/.claude/agents/refactor-advisor.md +8 -14
  17. package/templates/.claude/commands/git-all.md +3 -167
  18. package/templates/.claude/commands/git-session.md +3 -71
  19. package/templates/.claude/commands/lint-fix.md +119 -82
  20. package/templates/.claude/commands/lint-init.md +2 -54
  21. package/templates/.claude/commands/pre-deploy.md +143 -82
  22. package/templates/.claude/commands/version-update.md +171 -66
  23. package/templates/.claude/instructions/agent-patterns/agent-coordination.md +208 -0
  24. package/templates/.claude/instructions/agent-patterns/index.md +264 -0
  25. package/templates/.claude/instructions/agent-patterns/model-routing.md +167 -0
  26. package/templates/.claude/instructions/agent-patterns/parallel-execution.md +91 -0
  27. package/templates/.claude/instructions/agent-patterns/read-parallelization.md +106 -0
  28. package/templates/.claude/instructions/index.md +350 -0
  29. package/templates/.claude/instructions/multi-agent/agent-roster.md +811 -0
  30. package/templates/.claude/{PARALLEL_AGENTS.md → instructions/multi-agent/coordination-guide.md} +27 -336
  31. package/templates/.claude/instructions/{parallel-agent-execution.md → multi-agent/execution-patterns.md} +127 -438
  32. package/templates/.claude/instructions/multi-agent/index.md +282 -0
  33. package/templates/.claude/instructions/multi-agent/performance-optimization.md +456 -0
  34. package/templates/.claude/instructions/tech-stack/design-standards.md +282 -0
  35. package/templates/.claude/instructions/tech-stack/index.md +70 -0
  36. package/templates/.claude/instructions/tech-stack/prisma-patterns.md +352 -0
  37. package/templates/.claude/instructions/tech-stack/tanstack-patterns.md +275 -0
  38. package/templates/.claude/instructions/validation/forbidden-patterns.md +281 -0
  39. package/templates/.claude/instructions/validation/index.md +32 -0
  40. package/templates/.claude/instructions/validation/required-behaviors.md +331 -0
  41. package/templates/.claude/instructions/validation/verification-checklist.md +318 -0
  42. package/templates/.claude/instructions/workflow-patterns/index.md +18 -0
  43. package/templates/.claude/instructions/workflow-patterns/phase-based-workflow.md +250 -0
  44. package/templates/.claude/instructions/workflow-patterns/sequential-thinking.md +217 -0
  45. package/templates/.claude/instructions/workflow-patterns/todowrite-pattern.md +215 -0
  46. package/templates/.claude/skills/bug-fix/SKILL.md +972 -0
  47. package/templates/.claude/skills/docs-creator/AGENTS.md +4 -1
  48. package/templates/.claude/skills/docs-creator/SKILL.md +258 -0
  49. package/templates/.claude/skills/docs-refactor/AGENTS.md +4 -1
  50. package/templates/.claude/skills/docs-refactor/SKILL.md +145 -0
  51. package/templates/.claude/skills/execute/SKILL.md +15 -242
  52. package/templates/.claude/skills/figma-to-code/AGENTS.md +4 -1
  53. package/templates/.claude/skills/figma-to-code/SKILL.md +306 -0
  54. package/templates/.claude/skills/global-uiux-design/AGENTS.md +4 -1
  55. package/templates/.claude/skills/global-uiux-design/SKILL.md +455 -125
  56. package/templates/.claude/skills/korea-uiux-design/AGENTS.md +4 -1
  57. package/templates/.claude/skills/korea-uiux-design/SKILL.md +461 -116
  58. package/templates/.claude/skills/nextjs-react-best-practices/SKILL.md +177 -0
  59. package/templates/.claude/skills/plan/SKILL.md +1102 -98
  60. package/templates/.claude/skills/prd/SKILL.md +367 -66
  61. package/templates/.claude/skills/ralph/AGENTS.md +4 -1
  62. package/templates/.claude/skills/ralph/SKILL.md +83 -0
  63. package/templates/.claude/skills/refactor/SKILL.md +1214 -0
  64. package/templates/.claude/skills/tanstack-start-react-best-practices/SKILL.md +149 -0
  65. package/templates/.claude/commands/bug-fix.md +0 -510
  66. package/templates/.claude/commands/refactor.md +0 -788
@@ -1,3 +1,13 @@
1
+ ---
2
+ name: global-uiux-design
3
+ description: Implement modern, accessible UI/UX design for global audiences. Apply industry-standard patterns from Material Design, Apple HIG, Fluent, and other leading design systems.
4
+ user-invocable: true
5
+ ---
6
+
7
+ @../../instructions/agent-patterns/read-parallelization.md
8
+ @../../instructions/validation/forbidden-patterns.md
9
+ @../../instructions/validation/required-behaviors.md
10
+
1
11
  # Global UI/UX Design
2
12
 
3
13
  <context>
@@ -16,183 +26,503 @@
16
26
 
17
27
  ---
18
28
 
19
- <agent_integration>
29
+ <parallel_agent_execution>
20
30
 
21
- ## 병렬 Agent 활용 (ULTRAWORK MODE)
31
+ ## 병렬 에이전트 실행 (Global UX 특화)
22
32
 
23
- ### 기본 원칙
33
+ ### 핵심 원칙
24
34
 
25
- | 원칙 | 실행 방법 |
26
- |------|----------|
27
- | **PARALLEL** | 독립 작업은 단일 메시지에서 동시 Tool 호출 |
28
- | **DELEGATE** | 전문 에이전트에게 즉시 위임 |
29
- | **SMART MODEL** | 복잡도별 모델 선택 (haiku/sonnet/opus) |
35
+ **Goal:** 독립적인 Global UX 작업을 동시에 처리하여 대기 시간 최소화, 다국어/반응형/접근성 병렬 구현.
30
36
 
31
- ### Phase별 Agent 활용
37
+ **Performance:** 순차 실행 → 병렬 실행으로 5-15배 성능 향상.
32
38
 
33
- #### Phase 1: 탐색 + 디자인 정의
39
+ | 원칙 | 실행 방법 | Global UX 적용 |
40
+ |------|----------|----------------|
41
+ | **PARALLEL** | 단일 메시지에서 여러 Tool 동시 호출 | 다국어 레이아웃 동시 구현 |
42
+ | **DELEGATE** | 전문 에이전트에게 즉시 위임 | designer (UI), code-reviewer (접근성) |
43
+ | **SMART MODEL** | 복잡도별 모델 선택 | haiku (탐색), sonnet (구현), opus (디자인) |
34
44
 
45
+ **핵심 룰:**
35
46
  ```typescript
36
- // 단일 메시지에서 병렬 실행
37
- Task(
38
- subagent_type="explore",
39
- model="haiku",
40
- prompt=`글로벌 디자인 시스템 패턴 분석:
41
- - Material 3, Apple HIG, Fluent 2
42
- - 프로젝트 기존 컴포넌트 구조
43
- - 크로스 플랫폼 일관성`
44
- )
45
-
46
- Task(
47
- subagent_type="designer",
48
- model="opus",
49
- prompt=`[프로젝트명] UI/UX 디자인 방향 정의:
50
- - 미학적 톤: 리퀴드 글래스 (Apple HIG)
51
- - 2026 트렌드: 공간 UI, AI 기반, 적응형 테마
52
- - 글로벌 표준 참조 (global-uiux-design 스킬)`
53
- )
54
- ```
55
-
56
- #### Phase 2: 병렬 구현
47
+ // 순차 실행 (느림)
48
+ Task(...) // 모바일 레이아웃 60초
49
+ Task(...) // 데스크톱 레이아웃 60초
50
+ Task(...) // 태블릿 레이아웃 60초
51
+ // 180초
52
+
53
+ // 병렬 실행 (빠름)
54
+ Task(...) // 모바일
55
+ Task(...) // 데스크톱 → 단일 메시지에서 동시 호출
56
+ Task(...) // 태블릿
57
+ // 총 60초 (가장 긴 작업 기준)
58
+ ```
57
59
 
60
+ ---
61
+
62
+ ### Model Routing (Global UX 특화)
63
+
64
+ | 작업 유형 | 모델 | 에이전트 | 예시 |
65
+ |----------|------|---------|------|
66
+ | **디자인 시스템 탐색** | haiku | explore | Material 3/Apple HIG 패턴 분석 |
67
+ | **UI 구현** | sonnet | designer | 컴포넌트, 레이아웃, 반응형 |
68
+ | **복잡한 디자인** | opus | designer | 공간 UI, 크로스 플랫폼 일관성 |
69
+ | **접근성 검증** | opus | code-reviewer | WCAG 2.2, ARIA, 키보드 네비게이션 |
70
+ | **성능 검토** | opus | code-reviewer | 60fps 애니메이션, 번들 최적화 |
71
+ | **문서 작성** | haiku | document-writer | 디자인 가이드, 컴포넌트 문서 |
72
+
73
+ **모델 선택 기준:**
58
74
  ```typescript
59
- // 크로스 플랫폼 컴포넌트 동시 구현
60
- Task(
61
- subagent_type="designer",
62
- model="sonnet",
63
- prompt="데스크톱 레이아웃 (Material 3 스타일)"
64
- )
65
-
66
- Task(
67
- subagent_type="designer",
68
- model="sonnet",
69
- prompt="모바일 레이아웃 (iOS/Android 적응형)"
70
- )
71
-
72
- Task(
73
- subagent_type="designer",
74
- model="sonnet",
75
- prompt="공간 UI 컴포넌트 (WebGPU 3D 효과)"
76
- )
77
-
78
- Task(
79
- subagent_type="implementation-executor",
80
- model="sonnet",
81
- prompt="API 통합 및 데이터 레이어"
82
- )
83
- ```
84
-
85
- #### Phase 3: 검증
75
+ // 간단한 탐색 haiku
76
+ Task(subagent_type="explore", model="haiku",
77
+ prompt="프로젝트 기존 다국어 지원 구조 분석")
78
+
79
+ // 일반 구현 sonnet
80
+ Task(subagent_type="designer", model="sonnet",
81
+ prompt="모바일 레이아웃 구현 (Material 3)")
82
+
83
+ // 복잡한 디자인 → opus
84
+ Task(subagent_type="designer", model="opus",
85
+ prompt="4개 언어 동시 지원하는 통합 디자인 시스템 설계")
86
+ ```
87
+
88
+ ---
89
+
90
+ ### 패턴 1: 다국어 디자인 병렬 처리
91
+
92
+ **목표:** EN/ES/ZH/AR 레이아웃을 동시에 구현하여 시간 단축, RTL/LTR 일관성 확보.
86
93
 
87
94
  ```typescript
88
- // 병렬 검증
89
- Task(
90
- subagent_type="deployment-validator",
91
- model="sonnet",
92
- prompt="typecheck/lint/build 전체 검증"
93
- )
95
+ // 4개 언어 레이아웃 동시 구현
96
+ Task(subagent_type="designer", model="sonnet",
97
+ prompt=`영어(EN) 레이아웃 구현
98
+ - LTR 기본
99
+ - 짧은 단어 (compact)
100
+ - Material 3 스타일
101
+ - components/en/Header.tsx`)
94
102
 
95
- Task(
96
- subagent_type="code-reviewer",
97
- model="opus",
98
- prompt="글로벌 표준 준수 검토 (WCAG 2.2, 크로스 플랫폼)"
99
- )
103
+ Task(subagent_type="designer", model="sonnet",
104
+ prompt=`스페인어(ES) 레이아웃 구현
105
+ - LTR, 영어보다 20% 긴 텍스트
106
+ - 동적 너비 조정
107
+ - components/es/Header.tsx`)
108
+
109
+ Task(subagent_type="designer", model="sonnet",
110
+ prompt=`중국어(ZH) 레이아웃 구현
111
+ - 세로쓰기 옵션
112
+ - CJK 폰트 (Noto Sans CJK)
113
+ - 컴팩트 레이아웃
114
+ - components/zh/Header.tsx`)
115
+
116
+ Task(subagent_type="designer", model="sonnet",
117
+ prompt=`아랍어(AR) 레이아웃 구현
118
+ - RTL (direction: rtl)
119
+ - 미러링 (아이콘, 레이아웃)
120
+ - 아랍어 폰트 (Noto Sans Arabic)
121
+ - components/ar/Header.tsx`)
122
+
123
+ // 병렬 폰트 시스템
124
+ Task(subagent_type="implementation-executor", model="sonnet",
125
+ prompt=`다국어 폰트 로딩 시스템 구현
126
+ - Next.js Font Optimization
127
+ - 언어별 폰트 스택
128
+ - 폴백 처리`)
100
129
  ```
101
130
 
102
- ### Agent별 역할
131
+ **예상 시간:**
132
+ - 순차 실행: 240초 (60초 × 4)
133
+ - 병렬 실행: 60초 (가장 긴 작업)
134
+ - 개선: 4배 향상
135
+
136
+ **RTL 처리 체크리스트:**
137
+ - [ ] `direction: rtl` CSS 적용
138
+ - [ ] 아이콘 미러링 (화살표, 햄버거 메뉴)
139
+ - [ ] Flexbox/Grid 자동 반전 (justify-content)
140
+ - [ ] margin/padding 논리 속성 (margin-inline-start)
141
+
142
+ ---
143
+
144
+ ### 패턴 2: 반응형 Breakpoint 병렬 구현
103
145
 
104
- | Agent | 모델 | 역할 | 활용 시점 |
105
- |-------|------|------|----------|
106
- | **explore** | haiku | 디자인 시스템 분석, 패턴 조사 | 프로젝트 시작, 기존 구조 파악 |
107
- | **designer** | sonnet/opus | UI/UX 디자인 + 구현 (글로벌 표준) | 컴포넌트, 레이아웃, 디자인 시스템 |
108
- | **implementation-executor** | sonnet | 로직 구현, API 연동 | 비즈니스 로직, 데이터 레이어 |
109
- | **deployment-validator** | sonnet | 배포 전 검증 | 최종 검증 단계 |
110
- | **code-reviewer** | opus | 코드 품질 + 표준 준수 리뷰 | 구현 완료 후 |
146
+ **목표:** Mobile/Tablet/Desktop/4K 레이아웃을 동시에 구현.
147
+
148
+ ```typescript
149
+ // 4개 Breakpoint 동시 구현
150
+ Task(subagent_type="designer", model="sonnet",
151
+ prompt=`Mobile 레이아웃 (< 640px)
152
+ - 단일 컬럼
153
+ - 하단 탭 바
154
+ - Safe Area 고려
155
+ - 44px 터치 타겟
156
+ - components/mobile/Dashboard.tsx`)
157
+
158
+ Task(subagent_type="designer", model="sonnet",
159
+ prompt=`Tablet 레이아웃 (640-1024px)
160
+ - 2컬럼 그리드
161
+ - 사이드바 토글
162
+ - 제스처 지원 (스와이프)
163
+ - components/tablet/Dashboard.tsx`)
164
+
165
+ Task(subagent_type="designer", model="sonnet",
166
+ prompt=`Desktop 레이아웃 (1024-1920px)
167
+ - 3컬럼 그리드
168
+ - 고정 사이드바
169
+ - 호버 인터랙션
170
+ - components/desktop/Dashboard.tsx`)
171
+
172
+ Task(subagent_type="designer", model="sonnet",
173
+ prompt=`4K/Ultra-Wide 레이아웃 (> 1920px)
174
+ - 4컬럼 그리드
175
+ - max-w-screen-2xl 컨테이너
176
+ - 여백 최적화
177
+ - 고해상도 이미지
178
+ - components/4k/Dashboard.tsx`)
179
+ ```
180
+
181
+ **통합 전략:**
182
+ ```typescript
183
+ // 단일 컴포넌트로 통합
184
+ Task(subagent_type="implementation-executor", model="sonnet",
185
+ prompt=`반응형 Dashboard 컴포넌트 통합
186
+ - Breakpoint별 동적 import
187
+ - Tailwind responsive classes
188
+ - 성능 최적화 (code splitting)`)
189
+ ```
190
+
191
+ ---
192
+
193
+ ### 패턴 3: A/B 테스트 변형 병렬 생성
194
+
195
+ **목표:** 디자인 변형을 동시에 구현하여 실험 속도 향상.
196
+
197
+ ```typescript
198
+ // ✅ A/B 테스트 3개 변형 동시 구현
199
+ Task(subagent_type="designer", model="sonnet",
200
+ prompt=`Variant A: 미니멀 디자인
201
+ - 단색 배경
202
+ - 작은 버튼 (h-10)
203
+ - 텍스트 중심
204
+ - components/ab-test/VariantA.tsx`)
205
+
206
+ Task(subagent_type="designer", model="sonnet",
207
+ prompt=`Variant B: 대담한 디자인
208
+ - 그라디언트 배경
209
+ - 큰 버튼 (h-14)
210
+ - 애니메이션 강조
211
+ - components/ab-test/VariantB.tsx`)
212
+
213
+ Task(subagent_type="designer", model="sonnet",
214
+ prompt=`Variant C: 하이브리드
215
+ - A와 B의 중간
216
+ - 조건부 애니메이션
217
+ - 어댑티브 크기
218
+ - components/ab-test/VariantC.tsx`)
219
+
220
+ // 병렬 성능 테스트
221
+ Task(subagent_type="code-reviewer", model="opus",
222
+ prompt=`3개 변형 성능 비교
223
+ - 번들 크기
224
+ - First Contentful Paint
225
+ - Interaction to Next Paint
226
+ - 최적 변형 추천`)
227
+ ```
228
+
229
+ **A/B 테스트 인프라:**
230
+ ```typescript
231
+ Task(subagent_type="implementation-executor", model="sonnet",
232
+ prompt=`A/B 테스트 라우팅 시스템
233
+ - 사용자 그룹 분배 (33/33/33)
234
+ - 쿠키 기반 고정
235
+ - 분석 이벤트 전송`)
236
+ ```
237
+
238
+ ---
239
+
240
+ ### 패턴 4: 접근성 검증 병렬
241
+
242
+ **목표:** WCAG/ARIA/키보드 네비게이션을 동시에 검증하여 접근성 품질 보장.
243
+
244
+ ```typescript
245
+ // ✅ 3가지 접근성 검증 동시 실행
246
+ Task(subagent_type="code-reviewer", model="opus",
247
+ prompt=`WCAG 2.2 AA 준수 검증
248
+ - 색상 대비 (4.5:1 일반, 3:1 큰 텍스트)
249
+ - 포커스 표시 (2px 아웃라인)
250
+ - 텍스트 크기 조정 (200%)
251
+ - 모든 interactive 요소 검토`)
252
+
253
+ Task(subagent_type="code-reviewer", model="opus",
254
+ prompt=`ARIA 속성 검증
255
+ - role, aria-label, aria-labelledby
256
+ - aria-expanded, aria-controls (동적 UI)
257
+ - aria-live (실시간 업데이트)
258
+ - landmark 역할 (navigation, main, aside)`)
259
+
260
+ Task(subagent_type="code-reviewer", model="opus",
261
+ prompt=`키보드 네비게이션 검증
262
+ - Tab 순서 (tabindex)
263
+ - Enter/Space (버튼 활성화)
264
+ - Esc (모달 닫기)
265
+ - 화살표 키 (드롭다운, 슬라이더)
266
+ - 포커스 트랩 (모달 내부)`)
267
+
268
+ // 스크린 리더 테스트
269
+ Task(subagent_type="code-reviewer", model="opus",
270
+ prompt=`스크린 리더 호환성
271
+ - VoiceOver (Safari)
272
+ - NVDA (Firefox)
273
+ - JAWS (Chrome)
274
+ - 의미적 HTML 구조 검증`)
275
+ ```
276
+
277
+ **자동 수정 패턴:**
278
+ ```typescript
279
+ // 검증 후 자동 수정
280
+ Task(subagent_type="lint-fixer", model="sonnet",
281
+ prompt=`접근성 이슈 자동 수정
282
+ - 대비 부족 색상 조정
283
+ - 누락된 alt 추가
284
+ - aria-label 보완
285
+ - tabindex 최적화`)
286
+ ```
287
+
288
+ ---
111
289
 
112
- ### 실전 패턴
290
+ ### 패턴 5: 디자인 시스템 컴포넌트 병렬 구현
113
291
 
114
- **패턴 1: 글로벌 서비스 디자인 시스템**
292
+ **목표:** 여러 컴포넌트를 동시에 구현하여 디자인 시스템 구축 가속화.
115
293
 
116
294
  ```typescript
117
- // Step 1: 병렬 탐색
295
+ // 10개 컴포넌트 동시 구현
296
+ Task(subagent_type="designer", model="sonnet",
297
+ prompt="Button 컴포넌트 (Primary, Secondary, Ghost)")
298
+
299
+ Task(subagent_type="designer", model="sonnet",
300
+ prompt="Input 컴포넌트 (Text, Email, Password, Search)")
301
+
302
+ Task(subagent_type="designer", model="sonnet",
303
+ prompt="Card 컴포넌트 (Default, Interactive, Elevated)")
304
+
305
+ Task(subagent_type="designer", model="sonnet",
306
+ prompt="Modal 컴포넌트 (Dialog, Drawer, Bottom Sheet)")
307
+
308
+ Task(subagent_type="designer", model="sonnet",
309
+ prompt="Toast/Notification 컴포넌트")
310
+
311
+ Task(subagent_type="designer", model="sonnet",
312
+ prompt="Dropdown/Select 컴포넌트")
313
+
314
+ Task(subagent_type="designer", model="sonnet",
315
+ prompt="Tabs 컴포넌트 (Underline, Segment Control)")
316
+
317
+ Task(subagent_type="designer", model="sonnet",
318
+ prompt="Avatar 컴포넌트 (User, Group, Fallback)")
319
+
320
+ Task(subagent_type="designer", model="sonnet",
321
+ prompt="Badge/Chip 컴포넌트 (Status, Label, Removable)")
322
+
323
+ Task(subagent_type="designer", model="sonnet",
324
+ prompt="Skeleton Loader 컴포넌트")
325
+
326
+ // 병렬 문서 작성
327
+ Task(subagent_type="document-writer", model="haiku",
328
+ prompt=`Storybook 문서 생성
329
+ - 10개 컴포넌트 스토리
330
+ - Props 테이블
331
+ - 사용 예시`)
332
+ ```
333
+
334
+ **예상 시간:**
335
+ - 순차 실행: 600초 (60초 × 10)
336
+ - 병렬 실행: 60초
337
+ - 개선: 10배 향상
338
+
339
+ ---
340
+
341
+ ### 실전 시나리오
342
+
343
+ #### 시나리오 1: 글로벌 이커머스 플랫폼
344
+
345
+ **요구사항:** 10개 언어, 5개 통화, 3개 플랫폼 (Web/iOS/Android)
346
+
347
+ ```typescript
348
+ // Phase 1: 병렬 탐색
118
349
  Task(subagent_type="explore", model="haiku",
119
- prompt="Material 3, Apple HIG, Fluent 2 최신 패턴 분석")
350
+ prompt="Shopify Polaris 디자인 패턴 분석")
120
351
  Task(subagent_type="explore", model="haiku",
121
- prompt="프로젝트 기존 컴포넌트 다국어 지원 현황")
352
+ prompt="Amazon/Alibaba 다국어 UI 구조 분석")
353
+ Task(subagent_type="explore", model="haiku",
354
+ prompt="결제 UI 접근성 모범 사례 (Stripe, PayPal)")
122
355
 
123
- // Step 2: 디자인 정의
124
- Task(subagent_type="designer", model="opus",
125
- prompt="크로스 플랫폼 디자인 토큰 시스템 설계")
356
+ // Phase 2: 다국어 레이아웃 병렬 구현
357
+ Task(subagent_type="designer", model="sonnet",
358
+ prompt="영어/독일어/프랑스어 상품 페이지 (LTR)")
359
+ Task(subagent_type="designer", model="sonnet",
360
+ prompt="아랍어/히브리어 상품 페이지 (RTL)")
361
+ Task(subagent_type="designer", model="sonnet",
362
+ prompt="중국어/일본어/한국어 상품 페이지 (CJK)")
363
+ Task(subagent_type="designer", model="sonnet",
364
+ prompt="통화별 가격 포매팅 컴포넌트 ($, €, ¥, ₩)")
365
+
366
+ // Phase 3: 반응형 병렬
367
+ Task(subagent_type="designer", model="sonnet",
368
+ prompt="모바일 체크아웃 (1-step)")
369
+ Task(subagent_type="designer", model="sonnet",
370
+ prompt="데스크톱 체크아웃 (Multi-step)")
126
371
 
127
- // Step 3: 병렬 구현
128
- Task(subagent_type="designer", model="sonnet", prompt="컬러 시스템 (다크 모드 포함)")
129
- Task(subagent_type="designer", model="sonnet", prompt="타이포그래피 (다국어)")
130
- Task(subagent_type="designer", model="sonnet", prompt="컴포넌트 라이브러리 (웹 컴포넌트)")
372
+ // Phase 4: 접근성 검증
373
+ Task(subagent_type="code-reviewer", model="opus",
374
+ prompt="결제 폼 접근성 (WCAG 2.2 AA, 스크린 리더)")
131
375
  ```
132
376
 
133
- **패턴 2: 크로스 플랫폼 애플리케이션**
377
+ **예상 시간:**
378
+ - 순차: 540초 (60초 × 9)
379
+ - 병렬: 60초
380
+ - 개선: 9배 향상
381
+
382
+ ---
383
+
384
+ #### 시나리오 2: 다국어 SaaS 대시보드
385
+
386
+ **요구사항:** 4개 언어, 실시간 데이터, 어댑티브 차트
134
387
 
135
388
  ```typescript
136
- // 병렬 실행 (플랫폼별)
389
+ // Phase 1: 디자인 시스템
390
+ Task(subagent_type="designer", model="opus",
391
+ prompt="SaaS 디자인 토큰 시스템 (Carbon Design 기반)")
392
+
393
+ // Phase 2: 병렬 구현
137
394
  Task(subagent_type="designer", model="sonnet",
138
- prompt=" 인터페이스 (Material 3 기반)")
395
+ prompt="대시보드 레이아웃 (4개 언어 동시 지원)")
139
396
  Task(subagent_type="designer", model="sonnet",
140
- prompt="iOS 인터페이스 (Apple HIG 준수)")
397
+ prompt="데이터 테이블 (정렬, 필터, 페이지네이션)")
141
398
  Task(subagent_type="designer", model="sonnet",
142
- prompt="Android 인터페이스 (Material 3 네이티브)")
399
+ prompt="차트 컴포넌트 (Recharts, 반응형)")
143
400
  Task(subagent_type="implementation-executor", model="sonnet",
144
- prompt="공통 비즈니스 로직 및 상태 관리")
401
+ prompt="실시간 WebSocket 연동")
402
+
403
+ // Phase 3: 접근성
404
+ Task(subagent_type="code-reviewer", model="opus",
405
+ prompt="차트 접근성 (aria-label, 데이터 테이블 대체)")
406
+ Task(subagent_type="code-reviewer", model="opus",
407
+ prompt="키보드 네비게이션 (테이블, 필터)")
145
408
  ```
146
409
 
147
- **패턴 3: 공간 UI 프로젝트 (AR/VR)**
410
+ ---
411
+
412
+ #### 시나리오 3: 모바일 우선 소셜 앱
413
+
414
+ **요구사항:** iOS/Android 네이티브 느낌, 60fps 애니메이션
148
415
 
149
416
  ```typescript
150
- // Step 1: 탐색
417
+ // Phase 1: 플랫폼별 탐색
151
418
  Task(subagent_type="explore", model="haiku",
152
- prompt="WebGPU/WebXR 지원 현황 공간 UI 패턴")
419
+ prompt="iOS Human Interface Guidelines 최신 패턴")
420
+ Task(subagent_type="explore", model="haiku",
421
+ prompt="Material 3 모바일 컴포넌트")
153
422
 
154
- // Step 2: 디자인 + 구현 병렬
155
- Task(subagent_type="designer", model="opus",
156
- prompt="3D 공간 UI 디자인 (Vision Pro 스타일)")
423
+ // Phase 2: 병렬 구현
424
+ Task(subagent_type="designer", model="sonnet",
425
+ prompt="iOS 스타일 피드 (SF Symbols, 네이티브 제스처)")
157
426
  Task(subagent_type="designer", model="sonnet",
158
- prompt="2D 폴백 인터페이스 (점진적 향상)")
427
+ prompt="Android 스타일 피드 (Material 3, FAB)")
428
+ Task(subagent_type="designer", model="sonnet",
429
+ prompt="공통 스토리 컴포넌트 (Instagram 스타일)")
159
430
  Task(subagent_type="implementation-executor", model="sonnet",
160
- prompt="WebXR 통합 센서 처리")
431
+ prompt="60fps 애니메이션 (Framer Motion)")
161
432
 
162
- // Step 3: 검증
433
+ // Phase 3: 성능 검증
163
434
  Task(subagent_type="code-reviewer", model="opus",
164
- prompt="공간 UI 접근성 성능 검토")
435
+ prompt="성능 검토 (FPS, 메모리, 배터리)")
165
436
  ```
166
437
 
167
- ### Designer Agent 상세
438
+ ---
439
+
440
+ #### 시나리오 4: 엔터프라이즈 디자인 시스템 구축
441
+
442
+ **요구사항:** 100+ 컴포넌트, Figma 동기화, 접근성 AAA
443
+
444
+ ```typescript
445
+ // Phase 1: 탐색
446
+ Task(subagent_type="explore", model="haiku",
447
+ prompt="IBM Carbon, Salesforce Lightning 분석")
448
+ Task(subagent_type="explore", model="haiku",
449
+ prompt="Figma Design Tokens 플러그인 조사")
450
+
451
+ // Phase 2: 토큰 시스템
452
+ Task(subagent_type="designer", model="opus",
453
+ prompt="디자인 토큰 시스템 (색상, 타이포, 간격, 그림자)")
454
+
455
+ // Phase 3: 컴포넌트 병렬 구현 (20개씩 배치)
456
+ // Batch 1
457
+ Task(subagent_type="designer", model="sonnet",
458
+ prompt="Form 컴포넌트 (Input, Select, Checkbox, Radio, Switch)")
459
+ // Batch 2
460
+ Task(subagent_type="designer", model="sonnet",
461
+ prompt="Navigation 컴포넌트 (Navbar, Sidebar, Tabs, Breadcrumb)")
462
+ // Batch 3
463
+ Task(subagent_type="designer", model="sonnet",
464
+ prompt="Feedback 컴포넌트 (Toast, Modal, Alert, Progress)")
465
+ // Batch 4
466
+ Task(subagent_type="designer", model="sonnet",
467
+ prompt="Data Display 컴포넌트 (Table, Card, List, Badge)")
468
+
469
+ // Phase 4: 접근성 AAA
470
+ Task(subagent_type="code-reviewer", model="opus",
471
+ prompt="WCAG 2.2 AAA 검증 (7:1 대비, 모든 인터랙션)")
168
472
 
169
- **@designer 에이전트가 제공:**
170
- - 2026 트렌드 통합 (AI 기반, 공간 UI, 키네틱 타이포, 적응형 테마, 마이크로 인터랙션)
171
- - 대담한 미학적 방향 정의 (7가지 톤 중 선택)
172
- - 성능 + 접근성 우선 (WCAG 2.2 AA, 60fps, 배터리/연결 인식)
173
- - 글로벌 디자인 시스템과 조화 (Material 3, Apple HIG, Fluent 2)
473
+ // Phase 5: 문서
474
+ Task(subagent_type="document-writer", model="sonnet",
475
+ prompt="Storybook + 디자인 가이드라인 생성")
476
+ ```
174
477
 
175
- **활용 시점:**
176
- - 글로벌 서비스 디자인 시스템 구축
177
- - 크로스 플랫폼 일관성 필요
178
- - 2026 트렌드 선도적 적용
179
- - 프리미엄 브랜드 경험 구축
478
+ **예상 시간:**
479
+ - 순차: 1200초 (20분)
480
+ - 병렬: 240초 (4분)
481
+ - 개선: 5배 향상
180
482
 
181
- **참조:** `.claude-kr/agents/designer.md`
483
+ ---
182
484
 
183
485
  ### 체크리스트
184
486
 
185
- 작업확인:
487
+ #### 병렬 실행 확인
488
+
489
+ - [ ] 독립적인 작업인가? (의존성 없음)
490
+ - [ ] 같은 파일을 동시 수정하지 않는가?
491
+ - [ ] 컨텍스트 분리 가능한가?
492
+
493
+ #### Global UX 특화 확인
494
+
495
+ - [ ] 다국어 작업 → 언어별 병렬 실행
496
+ - [ ] 반응형 작업 → Breakpoint별 병렬 실행
497
+ - [ ] A/B 테스트 → 변형별 병렬 실행
498
+ - [ ] 접근성 검증 → WCAG/ARIA/키보드 병렬
499
+ - [ ] 디자인 시스템 → 컴포넌트별 병렬 실행
500
+
501
+ #### 모델 선택 확인
502
+
503
+ - [ ] 탐색 작업 → haiku
504
+ - [ ] 일반 구현 → sonnet
505
+ - [ ] 복잡한 디자인 → opus
506
+ - [ ] 접근성 검증 → opus
507
+ - [ ] 문서 작성 → haiku
508
+
509
+ #### 성능 최적화
510
+
511
+ - [ ] 3-10개 작업 동시 실행
512
+ - [ ] 병렬 실행 시간 예상 (순차 대비 5-15배 향상)
513
+ - [ ] 컨텍스트 크기 모니터링
514
+ - [ ] 실패 시 재시도 전략 (3회 제한)
515
+
516
+ #### 완료 후 검증
186
517
 
187
- - [ ] 작업은 독립적인가? 병렬 agent 고려
188
- - [ ] 디자인 시스템 탐색 필요? → explore agent (haiku)
189
- - [ ] 크로스 플랫폼 동시 개발? → 플랫폼별 designer 병렬
190
- - [ ] 공간 UI/AR/VR? designer (opus) + 전문 구현
191
- - [ ] 복잡한 접근성/국제화? → opus 모델 사용
518
+ - [ ] 모든 언어 레이아웃 정상 작동
519
+ - [ ] 모든 Breakpoint 반응형 동작
520
+ - [ ] 접근성 WCAG 2.2 AA 통과
521
+ - [ ] 성능 목표 달성 (60fps, LCP < 2.5s)
192
522
 
193
- **적극적으로 agent 활용. 혼자 하지 것.**
523
+ **적극적으로 병렬 실행 활용. 순차 실행은 의존성이 명확할 때만.**
194
524
 
195
- </agent_integration>
525
+ </parallel_agent_execution>
196
526
 
197
527
  ---
198
528
 
@@ -6,7 +6,10 @@
6
6
 
7
7
  <agents_reference>
8
8
 
9
- 전체 에이전트 조정 가이드: @../../PARALLEL_AGENTS.md
9
+ 다중 에이전트 구조:
10
+ - 에이전트 목록: @../../instructions/multi-agent/agent-roster.md
11
+ - 조정 가이드: @../../instructions/multi-agent/coordination-guide.md
12
+ - 실행 패턴: @../../instructions/multi-agent/execution-patterns.md
10
13
 
11
14
  </agents_reference>
12
15