@kood/claude-code 0.5.0 → 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 +179 -33
  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: korea-uiux-design
3
+ description: 한국 사용자 대상 앱/웹 UI/UX 디자인 구현. shadcn/ui 기본 스타일 대신 토스/카카오/배민/플렉스 등 국내 앱 스타일 적용.
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
  # 한국형 앱 UI/UX 디자인
2
12
 
3
13
  <context>
@@ -16,173 +26,508 @@
16
26
 
17
27
  ---
18
28
 
19
- <agent_integration>
29
+ <parallel_agent_execution>
30
+
31
+ ## 한국형 UI/UX 병렬 에이전트 실행
32
+
33
+ ### 핵심 원칙
34
+
35
+ | 원칙 | 한국 서비스 적용 | 기대 효과 |
36
+ |------|----------------|----------|
37
+ | **PARALLEL** | 본인인증 + 결제 + 주소입력 동시 구현 | 5-10배 속도 향상 |
38
+ | **LOCALIZED** | 날짜/통화/전화번호 형식 병렬 처리 | 지역화 품질 극대화 |
39
+ | **COMPLIANT** | 법규 검증 병렬 실행 (개인정보보호법/전자금융거래법/웹접근성) | 법적 리스크 사전 차단 |
40
+
41
+ **한국 서비스 특화 병렬 패턴:**
42
+ ```typescript
43
+ // ❌ 순차 실행 (느림)
44
+ Task("본인인증 구현") // 60초
45
+ Task("결제 구현") // 60초
46
+ Task("주소입력 구현") // 60초
47
+ // 총 180초
48
+
49
+ // ✅ 병렬 실행 (빠름)
50
+ Task("본인인증 구현") // 단일 메시지에서
51
+ Task("결제 구현") // 동시 호출
52
+ Task("주소입력 구현") // 동시 실행
53
+ // 총 60초 (가장 긴 작업 기준)
54
+ ```
55
+
56
+ ---
57
+
58
+ ### 한국형 UI 병렬 패턴
59
+
60
+ **패턴 1: 본인인증 + KYC 동시 구현**
61
+
62
+ ```typescript
63
+ // 이커머스/핀테크 필수 컴포넌트
64
+ Task(subagent_type="designer", model="sonnet",
65
+ prompt=`휴대폰 본인인증 컴포넌트 구현
66
+ - NICE/KCB 인증 모듈 연동
67
+ - 인증번호 입력 UI
68
+ - 타이머 (3분 제한)
69
+ - 한국형 전화번호 형식 (010-XXXX-XXXX)`)
70
+
71
+ Task(subagent_type="designer", model="sonnet",
72
+ prompt=`신분증 인증 컴포넌트 구현
73
+ - 주민등록증/운전면허증 촬영
74
+ - OCR 연동 UI
75
+ - 개인정보 마스킹 (주민등록번호 뒷자리)`)
76
+
77
+ Task(subagent_type="implementation-executor", model="sonnet",
78
+ prompt=`본인인증 Server Functions
79
+ - NICE/KCB API 연동
80
+ - 세션 관리 (인증 상태 저장)
81
+ - 개인정보 암호화 (AES-256)`)
82
+ ```
20
83
 
21
- ## 병렬 Agent 활용 (ULTRAWORK MODE)
84
+ **패턴 2: 결제 시스템 병렬 구현**
22
85
 
23
- ### 기본 원칙
86
+ ```typescript
87
+ // 한국 주요 PG사 통합
88
+ Task(subagent_type="designer", model="sonnet",
89
+ prompt=`결제 수단 선택 UI
90
+ - 카드/계좌이체/간편결제 (토스/카카오페이/네이버페이)
91
+ - 할인/포인트 적용
92
+ - 최종 금액 표시 (원화 3자리 콤마)`)
24
93
 
25
- | 원칙 | 실행 방법 |
26
- |------|----------|
27
- | **PARALLEL** | 독립 작업은 단일 메시지에서 동시 Tool 호출 |
28
- | **DELEGATE** | 전문 에이전트에게 즉시 위임 |
29
- | **SMART MODEL** | 복잡도별 모델 선택 (haiku/sonnet/opus) |
94
+ Task(subagent_type="implementation-executor", model="sonnet",
95
+ prompt=`PG 연동 Server Functions
96
+ - 토스페이먼츠/KG이니시스 API
97
+ - 결제 승인/취소/환불
98
+ - 전자금융거래법 준수 (거래 로그 7년 보관)`)
30
99
 
31
- ### Phase별 Agent 활용
100
+ Task(subagent_type="code-reviewer", model="opus",
101
+ prompt=`결제 보안 검토
102
+ - PCI-DSS 준수
103
+ - 카드번호 비저장 (토큰 방식)
104
+ - 개인정보 처리방침 확인`)
105
+ ```
32
106
 
33
- #### Phase 1: 탐색 + 디자인 정의
107
+ **패턴 3: 주소/배송 병렬 구현**
34
108
 
35
109
  ```typescript
36
- // 단일 메시지에서 병렬 실행
37
- Task(
38
- subagent_type="explore",
39
- model="haiku",
40
- prompt=`한국형 앱의 기존 디자인 패턴 분석:
41
- - 색상 시스템
42
- - 컴포넌트 구조
43
- - 타이포그래피`
44
- )
45
-
46
- Task(
47
- subagent_type="designer",
48
- model="sonnet",
49
- prompt=`[서비스명] UI/UX 디자인 방향 정의:
50
- - 미학적 톤: 테크 미니멀리즘 (토스/플렉스)
51
- - 2026 트렌드: 키네틱 타이포, 적응형 테마
52
- - 한국형 패턴 참조 (korea-uiux-design 스킬)`
53
- )
54
- ```
55
-
56
- #### Phase 2: 병렬 구현
110
+ // 한국 주소 시스템
111
+ Task(subagent_type="designer", model="sonnet",
112
+ prompt=`주소 입력 컴포넌트
113
+ - Daum 우편번호 API 연동
114
+ - 도로명주소 + 지번주소
115
+ - 상세주소 입력 (필수)`)
116
+
117
+ Task(subagent_type="designer", model="sonnet",
118
+ prompt=`배송 추적 UI
119
+ - 택배사 연동 (CJ대한통운/우체국/로젠)
120
+ - 실시간 위치 표시
121
+ - 배송 상태 (배송준비/배송중/배송완료)`)
122
+
123
+ Task(subagent_type="implementation-executor", model="sonnet",
124
+ prompt=`배송 Server Functions
125
+ - Daum Postcode API
126
+ - 택배사 API 연동
127
+ - 배송지 변경/반품 로직`)
128
+ ```
129
+
130
+ ---
131
+
132
+ ### 지역화 요소 병렬 처리
133
+
134
+ **패턴: 한국 형식 동시 구현**
135
+
136
+ ```typescript
137
+ // 날짜/통화/전화번호/주민등록번호
138
+ Task(subagent_type="implementation-executor", model="sonnet",
139
+ prompt=`날짜 형식 한국화
140
+ - YYYY년 MM월 DD일 (일, 월, 화)
141
+ - 24시간 형식 (HH:mm)
142
+ - day.js 한국어 로케일`)
143
+
144
+ Task(subagent_type="implementation-executor", model="sonnet",
145
+ prompt=`통화 형식 한국화
146
+ - 원화 표시: 15,000원
147
+ - 3자리 콤마 (toLocaleString)
148
+ - 소수점 제거 (정수만)`)
149
+
150
+ Task(subagent_type="implementation-executor", model="sonnet",
151
+ prompt=`전화번호 형식 한국화
152
+ - 010-XXXX-XXXX
153
+ - 02-XXX-XXXX (서울 지역번호)
154
+ - 입력 시 자동 하이픈`)
155
+
156
+ Task(subagent_type="implementation-executor", model="sonnet",
157
+ prompt=`주민등록번호/사업자등록번호 처리
158
+ - 형식: XXXXXX-XXXXXXX / XXX-XX-XXXXX
159
+ - 마스킹: XXXXXX-*******
160
+ - 암호화 저장 (AES-256)`)
161
+ ```
162
+
163
+ ---
164
+
165
+ ### 타이포그래피 병렬 최적화
166
+
167
+ **패턴: 한글 + 영문 폴백 동시 설정**
168
+
169
+ ```typescript
170
+ // Pretendard + 영문 폴백
171
+ Task(subagent_type="designer", model="sonnet",
172
+ prompt=`한글 타이포그래피 설정
173
+ - 주 폰트: Pretendard (가변 폰트)
174
+ - 크기: 14px/16px (모바일/데스크톱)
175
+ - 행간: 1.5-1.7 (한글 최적)
176
+ - 자간: -0.02em (밀도 조절)`)
177
+
178
+ Task(subagent_type="designer", model="sonnet",
179
+ prompt=`영문 폴백 설정
180
+ - Inter/SF Pro (영문 전용)
181
+ - font-family: Pretendard, -apple-system, Roboto, sans-serif
182
+ - 숫자: tabular-nums (정렬)`)
183
+
184
+ Task(subagent_type="designer", model="sonnet",
185
+ prompt=`웹폰트 최적화
186
+ - woff2 포맷
187
+ - font-display: swap
188
+ - subset: 한글 2,350자 + 영문/숫자`)
189
+ ```
190
+
191
+ ---
192
+
193
+ ### 법규 준수 병렬 검증
194
+
195
+ **패턴: 개인정보보호법 + 전자금융거래법 + 웹접근성 동시 검증**
57
196
 
58
197
  ```typescript
59
- // 여러 컴포넌트 동시 구현
60
- Task(
61
- subagent_type="designer",
62
- model="sonnet",
63
- prompt="대시보드 메인 레이아웃 구현 (벤토 그리드)"
64
- )
198
+ // 3가지 법규 병렬 검토
199
+ Task(subagent_type="analyst", model="sonnet",
200
+ prompt=`개인정보보호법 요구사항 분석
201
+ - 수집 항목 명시 (최소 수집 원칙)
202
+ - 동의 절차 (필수/선택 구분)
203
+ - 개인정보 처리방침 필수 표시
204
+ - 제3자 제공 동의 별도`)
205
+
206
+ Task(subagent_type="analyst", model="sonnet",
207
+ prompt=`전자금융거래법 요구사항 분석
208
+ - 거래 내역 7년 보관
209
+ - 오류 정정 요구권 안내
210
+ - 이용약관 명시
211
+ - 전자서명/공인인증서`)
65
212
 
66
- Task(
67
- subagent_type="designer",
68
- model="sonnet",
69
- prompt="네비게이션 컴포넌트 구현 (키네틱 타이포)"
70
- )
213
+ Task(subagent_type="code-reviewer", model="opus",
214
+ prompt=`웹접근성 (KWCAG 2.2) 검증
215
+ - 키보드 접근성 (Tab 순서)
216
+ - ARIA 레이블 (스크린 리더)
217
+ - 색상 대비 4.5:1 (WCAG AA)
218
+ - 대체 텍스트 (이미지)`)
71
219
 
72
- Task(
73
- subagent_type="implementation-executor",
74
- model="sonnet",
75
- prompt="Server Functions 데이터 페칭 로직 구현"
76
- )
220
+ Task(subagent_type="code-reviewer", model="opus",
221
+ prompt=`보안 검증
222
+ - XSS/CSRF 방어
223
+ - SQL Injection 방지 (Prisma)
224
+ - 비밀번호 암호화 (bcrypt)
225
+ - HTTPS 강제`)
77
226
  ```
78
227
 
79
- #### Phase 3: 검증
228
+ ---
229
+
230
+ ### 반응형 병렬 구현
231
+
232
+ **패턴: 모바일 우선 + 데스크톱 동시 구현**
80
233
 
81
234
  ```typescript
82
- // 병렬 검증
83
- Task(
84
- subagent_type="deployment-validator",
85
- model="sonnet",
86
- prompt="typecheck/lint/build 전체 검증"
87
- )
235
+ // 한국 모바일 사용률 80%+ 고려
236
+ Task(subagent_type="designer", model="sonnet",
237
+ prompt=`모바일 UI 구현 (우선)
238
+ - 화면: 375px (iPhone SE 기준)
239
+ - 터치 타겟: 44-48px (접근성)
240
+ - 하단 네비게이션 (엄지 영역)
241
+ - Safe Area (iOS 노치)`)
242
+
243
+ Task(subagent_type="designer", model="sonnet",
244
+ prompt=`데스크톱 UI 구현
245
+ - 화면: 1440px
246
+ - 사이드바 네비게이션
247
+ - 마우스 호버 상태
248
+ - 키보드 단축키`)
88
249
 
89
- Task(
90
- subagent_type="code-reviewer",
91
- model="opus",
92
- prompt="UI/UX 구현 품질 리뷰 (접근성, 성능, 2026 트렌드)"
93
- )
250
+ Task(subagent_type="designer", model="sonnet",
251
+ prompt=`반응형 테스트
252
+ - 브레이크포인트: 375/768/1024/1440
253
+ - 크로스 브라우징 (Chrome/Safari/Samsung Internet)
254
+ - 다크모드 대응`)
94
255
  ```
95
256
 
96
- ### Agent별 역할
257
+ ---
97
258
 
98
- | Agent | 모델 | 역할 | 활용 시점 |
99
- |-------|------|------|----------|
100
- | **explore** | haiku | 코드베이스 탐색, 패턴 분석 | 프로젝트 시작, 기존 구조 파악 |
101
- | **designer** | sonnet/opus | UI/UX 디자인 + 구현 | 컴포넌트, 레이아웃, 디자인 시스템 |
102
- | **implementation-executor** | sonnet | 로직 구현, API 연동 | 비즈니스 로직, Server Functions |
103
- | **deployment-validator** | sonnet | 배포 전 검증 | 최종 검증 단계 |
104
- | **code-reviewer** | opus | 코드 품질 리뷰 | 구현 완료 후 |
259
+ ### Model Routing (한국 서비스 특화)
105
260
 
106
- ### 실전 패턴
261
+ | 작업 유형 | 에이전트 | 모델 | 이유 |
262
+ |----------|---------|------|------|
263
+ | **UI 컴포넌트** | designer | sonnet | 일반적인 UI 구현 |
264
+ | **복잡한 디자인 시스템** | designer | opus | 브랜드 아이덴티티 반영 |
265
+ | **법규 요구사항 분석** | analyst | sonnet | 개인정보보호법/전자금융거래법 |
266
+ | **보안 검토** | code-reviewer | opus | XSS/CSRF/SQL Injection |
267
+ | **API 구현** | implementation-executor | sonnet | Server Functions, Prisma |
268
+ | **배포 검증** | deployment-validator | sonnet | typecheck/lint/build |
107
269
 
108
- **패턴 1: 새 서비스 디자인 시스템 구축**
270
+ **모델 선택 예시:**
109
271
 
110
272
  ```typescript
111
- // Step 1: 병렬 탐색
112
- Task(subagent_type="explore", model="haiku",
113
- prompt="토스/카카오/배민 디자인 패턴 분석")
114
- Task(subagent_type="explore", model="haiku",
115
- prompt="프로젝트 기존 컴포넌트 구조 분석")
273
+ // 간단한 UI sonnet
274
+ Task(subagent_type="designer", model="sonnet",
275
+ prompt="버튼 컴포넌트 구현")
116
276
 
117
- // Step 2: 디자인 정의
277
+ // 복잡한 디자인 시스템 → opus
118
278
  Task(subagent_type="designer", model="opus",
119
- prompt="브랜드 아이덴티티 반영한 디자인 시스템 설계")
279
+ prompt="토스 스타일 디자인 시스템 전체 설계")
280
+
281
+ // 법규 분석 → analyst (sonnet)
282
+ Task(subagent_type="analyst", model="sonnet",
283
+ prompt="개인정보보호법 요구사항 분석")
120
284
 
121
- // Step 3: 병렬 구현
122
- Task(subagent_type="designer", model="sonnet", prompt="컬러 시스템")
123
- Task(subagent_type="designer", model="sonnet", prompt="타이포그래피")
124
- Task(subagent_type="designer", model="sonnet", prompt="컴포넌트 라이브러리")
285
+ // 보안 검토 code-reviewer (opus)
286
+ Task(subagent_type="code-reviewer", model="opus",
287
+ prompt="결제 시스템 보안 검증 (PCI-DSS)")
125
288
  ```
126
289
 
127
- **패턴 2: 대시보드 구현**
290
+ ---
291
+
292
+ ### 실전 시나리오
293
+
294
+ #### 시나리오 1: 이커머스 (쿠팡/네이버쇼핑 스타일)
295
+
296
+ **목표:** 상품 구매 플로우 전체 구현 (상품 목록 → 상세 → 결제 → 배송)
128
297
 
129
298
  ```typescript
130
- // 병렬 실행
299
+ // Phase 1: UI 병렬 구현
300
+ Task(subagent_type="designer", model="sonnet",
301
+ prompt=`상품 목록 페이지
302
+ - 그리드 레이아웃 (2열/3열)
303
+ - 상품 카드 (이미지/가격/할인율)
304
+ - 필터/정렬 (가격순/인기순)`)
305
+
131
306
  Task(subagent_type="designer", model="sonnet",
132
- prompt="대시보드 레이아웃 + 통계 카드 (벤토 그리드)")
307
+ prompt=`상품 상세 페이지
308
+ - 이미지 갤러리 (슬라이드)
309
+ - 옵션 선택 (색상/사이즈)
310
+ - 가격 표시 (할인가/원가)
311
+ - 구매/장바구니 버튼`)
312
+
133
313
  Task(subagent_type="designer", model="sonnet",
134
- prompt="차트 컴포넌트 + 마이크로 인터랙션")
314
+ prompt=`결제 페이지
315
+ - 주문 정보 (상품/수량)
316
+ - 주소 입력 (Daum Postcode)
317
+ - 결제 수단 (카드/간편결제)
318
+ - 최종 금액 (배송비 포함)`)
319
+
320
+ // Phase 2: API 병렬 구현
321
+ Task(subagent_type="implementation-executor", model="sonnet",
322
+ prompt=`상품 API Server Functions
323
+ - GET /products: 목록 조회
324
+ - GET /products/:id: 상세 조회
325
+ - Prisma Product 모델 사용`)
326
+
327
+ Task(subagent_type="implementation-executor", model="sonnet",
328
+ prompt=`주문 API Server Functions
329
+ - POST /orders: 주문 생성
330
+ - inputValidator로 Zod 검증
331
+ - 재고 확인 로직`)
332
+
135
333
  Task(subagent_type="implementation-executor", model="sonnet",
136
- prompt="대시보드 데이터 페칭 + Server Functions")
334
+ prompt=`결제 API Server Functions
335
+ - POST /payments: 토스페이먼츠 연동
336
+ - 결제 승인/취소/환불
337
+ - 거래 로그 저장 (전자금융거래법)`)
338
+
339
+ // Phase 3: 법규 병렬 검증
340
+ Task(subagent_type="analyst", model="sonnet",
341
+ prompt=`전자상거래법 요구사항 검증
342
+ - 청약철회권 안내 (7일)
343
+ - 환불 정책 명시
344
+ - 사업자 정보 표시`)
345
+
346
+ Task(subagent_type="code-reviewer", model="opus",
347
+ prompt=`개인정보 보안 검토
348
+ - 결제 정보 암호화
349
+ - 주소 정보 접근 제어
350
+ - XSS/CSRF 방어`)
137
351
  ```
138
352
 
139
- **패턴 3: 리뉴얼 프로젝트**
353
+ ---
354
+
355
+ #### 시나리오 2: 핀테크 (토스/뱅크샐러드 스타일)
356
+
357
+ **목표:** 금융 계좌 연동 + 자산 관리 대시보드
140
358
 
141
359
  ```typescript
142
- // Step 1: 현황 파악
143
- Task(subagent_type="explore", model="haiku",
144
- prompt="기존 UI 컴포넌트 및 스타일 분석")
360
+ // Phase 1: KYC + 계좌 인증 병렬
361
+ Task(subagent_type="designer", model="sonnet",
362
+ prompt=`본인인증 플로우
363
+ - 휴대폰 인증 (NICE/KCB)
364
+ - 신분증 촬영 (OCR)
365
+ - 주민등록번호 마스킹`)
366
+
367
+ Task(subagent_type="designer", model="sonnet",
368
+ prompt=`계좌 연동 UI
369
+ - 은행 선택 (KB/신한/우리/하나)
370
+ - 1원 인증
371
+ - 연동 완료 확인`)
145
372
 
146
- // Step 2: 디자인 + 구현 병렬
147
- Task(subagent_type="designer", model="opus",
148
- prompt="2026 트렌드 기반 리뉴얼 디자인 (키네틱/적응형)")
149
373
  Task(subagent_type="implementation-executor", model="sonnet",
150
- prompt="기존 로직 유지하며 마이그레이션 계획")
374
+ prompt=`금융 API 연동
375
+ - 오픈뱅킹 API
376
+ - 계좌 조회/거래내역
377
+ - 이체 실행`)
378
+
379
+ // Phase 2: 대시보드 병렬 구현
380
+ Task(subagent_type="designer", model="sonnet",
381
+ prompt=`자산 대시보드
382
+ - 총 자산 (원화 표시)
383
+ - 계좌별 잔액
384
+ - 지출 분석 차트`)
385
+
386
+ Task(subagent_type="designer", model="sonnet",
387
+ prompt=`거래 내역 리스트
388
+ - 날짜별 그룹화
389
+ - 입금/출금 구분
390
+ - 카테고리 태그`)
391
+
392
+ // Phase 3: 법규 병렬 검증
393
+ Task(subagent_type="analyst", model="sonnet",
394
+ prompt=`전자금융거래법 요구사항
395
+ - 거래 내역 7년 보관
396
+ - 오류 정정 요구권
397
+ - 전자서명/공인인증서`)
151
398
 
152
- // Step 3: 검증
153
399
  Task(subagent_type="code-reviewer", model="opus",
154
- prompt="리뉴얼 품질 검토 (접근성, 성능)")
400
+ prompt=`금융 보안 검증
401
+ - 계좌번호 암호화
402
+ - 이체 한도 설정
403
+ - 이상 거래 탐지`)
155
404
  ```
156
405
 
157
- ### Designer Agent 상세
406
+ ---
407
+
408
+ #### 시나리오 3: 공공 서비스 (정부24 스타일)
158
409
 
159
- **@designer 에이전트가 제공:**
160
- - 2026 트렌드 통합 (AI 기반, 공간 UI, 키네틱 타이포, 적응형 테마, 마이크로 인터랙션)
161
- - 대담한 미학적 방향 정의 (7가지 톤 중 선택)
162
- - 성능 + 접근성 우선 (WCAG 2.2 AA, 60fps, 배터리/연결 인식)
163
- - 한국형 패턴과 조화로운 통합 (토스/카카오/배민)
410
+ **목표:** 민원 신청 시스템
164
411
 
165
- **활용 시점:**
166
- - 새로운 서비스/제품 디자인 시스템 구축
167
- - 기존 UI 대규모 리뉴얼
168
- - 2026 트렌드 적용이 필요한 프로젝트
169
- - 차별화된 브랜드 경험 필요
412
+ ```typescript
413
+ // Phase 1: UI 병렬 구현
414
+ Task(subagent_type="designer", model="sonnet",
415
+ prompt=`민원 신청
416
+ - 다단계 (개인정보 → 신청내용 → 첨부파일)
417
+ - 필수/선택 항목 표시
418
+ - 진행률 표시`)
170
419
 
171
- **참조:** `.claude-kr/agents/designer.md`
420
+ Task(subagent_type="designer", model="sonnet",
421
+ prompt=`파일 업로드
422
+ - 드래그 앤 드롭
423
+ - 파일 타입 제한 (pdf/hwp/jpg)
424
+ - 용량 제한 (10MB)`)
172
425
 
173
- ### 체크리스트
426
+ // Phase 2: 웹접근성 병렬 검증
427
+ Task(subagent_type="code-reviewer", model="opus",
428
+ prompt=`KWCAG 2.2 준수 검증
429
+ - 키보드 접근성 (Tab/Enter)
430
+ - ARIA 레이블 (스크린 리더)
431
+ - 색상 대비 4.5:1
432
+ - 폼 레이블 필수`)
433
+
434
+ Task(subagent_type="analyst", model="sonnet",
435
+ prompt=`공공데이터 API 연동 분석
436
+ - 행정안전부 API
437
+ - 데이터 형식 (JSON/XML)
438
+ - 인증 방식 (API 키)`)
439
+
440
+ // Phase 3: 법규 검증
441
+ Task(subagent_type="analyst", model="sonnet",
442
+ prompt=`개인정보보호법 검증
443
+ - 수집 항목 최소화
444
+ - 동의 절차 명시
445
+ - 개인정보 처리방침`)
446
+ ```
447
+
448
+ ---
174
449
 
175
- 작업 확인:
450
+ #### 시나리오 4: 커뮤니티 (네이버 카페/디시인사이드 스타일)
176
451
 
177
- - [ ] 작업은 독립적인가? → 병렬 agent 고려
178
- - [ ] 코드베이스 탐색 필요? → explore agent (haiku)
179
- - [ ] 디자인 + 구현 동시? → designer + executor 병렬
180
- - [ ] 여러 컴포넌트 동시 작업? → 여러 designer 병렬
181
- - [ ] 복잡한 아키텍처 결정? → opus 모델 사용
452
+ **목표:** 게시판 + 댓글 시스템
182
453
 
183
- **적극적으로 agent 활용. 혼자 하지 말 것.**
454
+ ```typescript
455
+ // Phase 1: UI 병렬 구현
456
+ Task(subagent_type="designer", model="sonnet",
457
+ prompt=`게시판 리스트
458
+ - 말머리 (공지/일반/질문)
459
+ - 제목/작성자/날짜/조회수
460
+ - 페이지네이션`)
461
+
462
+ Task(subagent_type="designer", model="sonnet",
463
+ prompt=`게시글 상세
464
+ - 제목/작성자/날짜
465
+ - 본문 (Markdown 지원)
466
+ - 좋아요/신고 버튼`)
467
+
468
+ Task(subagent_type="designer", model="sonnet",
469
+ prompt=`댓글 시스템
470
+ - 대댓글 (nested)
471
+ - 좋아요/신고
472
+ - 실시간 업데이트`)
473
+
474
+ // Phase 2: API 병렬 구현
475
+ Task(subagent_type="implementation-executor", model="sonnet",
476
+ prompt=`게시글 CRUD API
477
+ - GET /posts: 목록
478
+ - POST /posts: 작성 (인증 필수)
479
+ - PUT /posts/:id: 수정
480
+ - DELETE /posts/:id: 삭제`)
481
+
482
+ Task(subagent_type="implementation-executor", model="sonnet",
483
+ prompt=`댓글 CRUD API
484
+ - GET /comments: 조회
485
+ - POST /comments: 작성
486
+ - nested 구조 (parent_id)`)
487
+
488
+ // Phase 3: 컨텐츠 정책 검증
489
+ Task(subagent_type="analyst", model="sonnet",
490
+ prompt=`정보통신망법 요구사항
491
+ - 불법 정보 신고 절차
492
+ - 임시조치 (게시 중단)
493
+ - 명예훼손 대응`)
494
+ ```
495
+
496
+ ---
497
+
498
+ ### 체크리스트
184
499
 
185
- </agent_integration>
500
+ #### 작업 전 확인
501
+
502
+ **병렬 실행 가능:**
503
+ - [ ] 본인인증 + 결제 + 주소입력 (독립 컴포넌트)
504
+ - [ ] 모바일 UI + 데스크톱 UI (독립 화면)
505
+ - [ ] 개인정보보호법 + 전자금융거래법 + 웹접근성 (독립 검증)
506
+ - [ ] 여러 페이지/컴포넌트 동시 작업
507
+
508
+ **순차 실행 필요:**
509
+ - [ ] API 구현 → 검증 (의존성)
510
+ - [ ] 디자인 시스템 설계 → 컴포넌트 구현 (순서)
511
+
512
+ **한국 서비스 필수 체크:**
513
+ - [ ] 날짜 형식 (YYYY년 MM월 DD일)
514
+ - [ ] 통화 형식 (15,000원)
515
+ - [ ] 전화번호 형식 (010-XXXX-XXXX)
516
+ - [ ] 주소 입력 (Daum Postcode API)
517
+ - [ ] 본인인증 (NICE/KCB)
518
+ - [ ] 결제 (토스페이먼츠/KG이니시스)
519
+ - [ ] 법규 준수 (개인정보보호법/전자금융거래법/웹접근성)
520
+
521
+ **모델 선택:**
522
+ - [ ] 간단한 UI → designer (sonnet)
523
+ - [ ] 복잡한 디자인 시스템 → designer (opus)
524
+ - [ ] 법규 분석 → analyst (sonnet)
525
+ - [ ] 보안 검토 → code-reviewer (opus)
526
+ - [ ] API 구현 → implementation-executor (sonnet)
527
+
528
+ **적극적으로 병렬 에이전트 활용. 한국 서비스 특화 패턴 적용.**
529
+
530
+ </parallel_agent_execution>
186
531
 
187
532
  ---
188
533