@atlashub/smartstack-cli 1.3.0 → 1.4.1

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 (26) hide show
  1. package/.documentation/agents.html +916 -912
  2. package/.documentation/apex.html +1018 -1014
  3. package/.documentation/business-analyse.html +1501 -1074
  4. package/.documentation/commands.html +680 -676
  5. package/.documentation/css/styles.css +2168 -2030
  6. package/.documentation/efcore.html +2505 -2501
  7. package/.documentation/gitflow.html +2618 -2053
  8. package/.documentation/hooks.html +413 -409
  9. package/.documentation/index.html +323 -319
  10. package/.documentation/installation.html +462 -458
  11. package/.documentation/js/app.js +794 -794
  12. package/.documentation/ralph-loop.html +530 -0
  13. package/.documentation/test-web.html +513 -509
  14. package/README.md +52 -10
  15. package/dist/index.js +6 -6
  16. package/dist/index.js.map +1 -1
  17. package/package.json +1 -1
  18. package/templates/commands/business-analyse/0-orchestrate.md +640 -0
  19. package/templates/commands/business-analyse.md +84 -3
  20. package/templates/commands/create/agent.md +138 -0
  21. package/templates/commands/create/command.md +166 -0
  22. package/templates/commands/create/hook.md +234 -0
  23. package/templates/commands/create/plugin.md +329 -0
  24. package/templates/commands/create/project.md +507 -0
  25. package/templates/commands/create/skill.md +199 -0
  26. package/templates/commands/create.md +220 -0
package/.documentation/business-analyse.html CHANGED
@@ -1,1074 +1,1501 @@
1
- <!DOCTYPE html>
2
- <html lang="fr">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Business Analyse - Claude Tools</title>
7
- <link rel="stylesheet" href="css/styles.css">
8
- </head>
9
- <body>
10
- <div class="app-container">
11
- <!-- Global Header -->
12
- <header class="global-header">
13
- <div class="logo">CT</div>
14
- <span class="site-title">Claude Tools</span>
15
- <span class="version-badge">v1.9.0</span>
16
- <div class="header-divider"></div>
17
- <span class="page-title">Business Analyse</span>
18
- <nav class="breadcrumb">
19
- <a href="index.html">
20
- <span data-lang="fr">Accueil</span>
21
- <span data-lang="en">Home</span>
22
- </a>
23
- <span class="breadcrumb-separator">&#8250;</span>
24
- <span data-lang="fr">Workflows</span>
25
- <span data-lang="en">Workflows</span>
26
- <span class="breadcrumb-separator">&#8250;</span>
27
- <span class="breadcrumb-current">Business Analyse</span>
28
- </nav>
29
- <select class="lang-select" id="lang-select" onchange="setLanguage(this.value); localStorage.setItem('doc-language', this.value);">
30
- <option value="fr">FR</option>
31
- <option value="en">EN</option>
32
- </select>
33
- <div class="header-search">
34
- <div class="search-input-wrapper">
35
- <span class="search-icon">&#128269;</span>
36
- <input type="text" id="search-input" class="search-input" placeholder="Rechercher..." data-placeholder-fr="Rechercher..." data-placeholder-en="Search..." autocomplete="off">
37
- <span class="search-shortcut">Ctrl+K</span>
38
- </div>
39
- <div id="search-results" class="search-results"></div>
40
- </div>
41
- </header>
42
-
43
- <div class="app-body">
44
- <!-- Sidebar -->
45
- <aside class="sidebar">
46
- <button class="sidebar-toggle" title="Toggle sidebar">
47
- <span class="toggle-icon-collapse">&#171;</span>
48
- <span class="toggle-icon-expand">&#187;</span>
49
- </button>
50
-
51
- <nav class="sidebar-nav">
52
- <div class="nav-section">
53
- <div class="nav-section-title">
54
- <span data-lang="fr">Demarrage</span>
55
- <span data-lang="en">Getting Started</span>
56
- </div>
57
- <a href="index.html" class="nav-item">
58
- <span class="icon">&#127968;</span>
59
- <span class="nav-text" data-lang="fr">Accueil</span>
60
- <span class="nav-text" data-lang="en">Home</span>
61
- </a>
62
- <a href="installation.html" class="nav-item">
63
- <span class="icon">&#128230;</span>
64
- <span class="nav-text">Installation</span>
65
- </a>
66
- </div>
67
-
68
- <div class="nav-section">
69
- <div class="nav-section-title">Workflows</div>
70
- <a href="gitflow.html" class="nav-item">
71
- <span class="icon">&#128256;</span>
72
- <span class="nav-text">GitFlow</span>
73
- </a>
74
- <a href="efcore.html" class="nav-item">
75
- <span class="icon">&#128452;</span>
76
- <span class="nav-text">EF Core</span>
77
- </a>
78
- <a href="apex.html" class="nav-item">
79
- <span class="icon">&#127919;</span>
80
- <span class="nav-text">APEX</span>
81
- </a>
82
- <div class="nav-item-with-toc">
83
- <a href="business-analyse.html" class="active">
84
- <span class="icon">&#128202;</span>
85
- <span class="nav-text">Business Analyse</span>
86
- <button class="toc-toggle">&#9654;</button>
87
- </a>
88
- <nav class="sidebar-toc">
89
- <a href="#introduction" class="sidebar-toc-link">Introduction</a>
90
- <a href="#workflow" class="sidebar-toc-link">Workflow</a>
91
- <a href="#phases" class="sidebar-toc-link">
92
- <span data-lang="fr">Les 6 Phases</span>
93
- <span data-lang="en">The 6 Phases</span>
94
- </a>
95
- <a href="#phase-1" class="sidebar-toc-link">1. Discover</a>
96
- <a href="#phase-2" class="sidebar-toc-link">2. Explore</a>
97
- <a href="#phase-3" class="sidebar-toc-link">3. Analyse</a>
98
- <a href="#phase-4" class="sidebar-toc-link">4. Specify</a>
99
- <a href="#phase-5" class="sidebar-toc-link">5. Validate</a>
100
- <a href="#phase-6" class="sidebar-toc-link">6. Handoff</a>
101
- <a href="#agents" class="sidebar-toc-link">Agents</a>
102
- <a href="#files" class="sidebar-toc-link">
103
- <span data-lang="fr">Fichiers</span>
104
- <span data-lang="en">Files</span>
105
- </a>
106
- <a href="#example" class="sidebar-toc-link">
107
- <span data-lang="fr">Exemple</span>
108
- <span data-lang="en">Example</span>
109
- </a>
110
- </nav>
111
- </div>
112
- </div>
113
-
114
- <div class="nav-section">
115
- <div class="nav-section-title">
116
- <span data-lang="fr">Outils</span>
117
- <span data-lang="en">Tools</span>
118
- </div>
119
- <a href="agents.html" class="nav-item">
120
- <span class="icon">&#129302;</span>
121
- <span class="nav-text">Agents</span>
122
- </a>
123
- <a href="commands.html" class="nav-item">
124
- <span class="icon">&#9889;</span>
125
- <span class="nav-text" data-lang="fr">Commandes</span>
126
- <span class="nav-text" data-lang="en">Commands</span>
127
- </a>
128
- <a href="hooks.html" class="nav-item">
129
- <span class="icon">&#128279;</span>
130
- <span class="nav-text">Hooks</span>
131
- </a>
132
- </div>
133
- </nav>
134
- </aside>
135
-
136
- <!-- Main Content -->
137
- <main class="main-content">
138
- <div class="content-full">
139
-
140
- <!-- Introduction -->
141
- <section id="introduction">
142
- <h2>Introduction</h2>
143
- <p data-lang="fr">
144
- Le workflow <strong>Business Analyse v2</strong> est un systeme complet en <strong>6 phases</strong> pour transformer une demande utilisateur vague en une implementation precise. Il separe clairement l'analyse du besoin (WHAT) de la specification technique (HOW).
145
- </p>
146
- <p data-lang="en">
147
- The <strong>Business Analyse v2</strong> workflow is a complete <strong>6-phase</strong> system to transform a vague user request into a precise implementation. It clearly separates need analysis (WHAT) from technical specification (HOW).
148
- </p>
149
-
150
- <div class="alert alert-warning">
151
- <span class="alert-icon">&#9888;</span>
152
- <div class="alert-content">
153
- <h5 data-lang="fr">Principe fondamental</h5>
154
- <h5 data-lang="en">Core Principle</h5>
155
- <p data-lang="fr">
156
- <strong>Comprendre avant de specifier.</strong> Les phases 1-3 se concentrent sur le BESOIN (langage utilisateur), les phases 4-6 sur la SOLUTION (langage technique).
157
- </p>
158
- <p data-lang="en">
159
- <strong>Understand before specifying.</strong> Phases 1-3 focus on the NEED (user language), phases 4-6 on the SOLUTION (technical language).
160
- </p>
161
- </div>
162
- </div>
163
-
164
- <div class="alert alert-success">
165
- <span class="alert-icon">&#129504;</span>
166
- <div class="alert-content">
167
- <h5>ULTRATHINK</h5>
168
- <p data-lang="fr">
169
- Les phases critiques (1, 3, 4, 6) utilisent <strong>ULTRATHINK</strong> pour une reflexion approfondie. Les phases simples (2, 5) utilisent des modeles plus legers.
170
- </p>
171
- <p data-lang="en">
172
- Critical phases (1, 3, 4, 6) use <strong>ULTRATHINK</strong> for deep reasoning. Simple phases (2, 5) use lighter models.
173
- </p>
174
- </div>
175
- </div>
176
- </section>
177
-
178
- <!-- Workflow -->
179
- <section id="workflow">
180
- <h2>Workflow</h2>
181
-
182
- <div class="svg-diagram">
183
- <svg viewBox="0 0 700 740" xmlns="http://www.w3.org/2000/svg" style="font-family: 'Inter', system-ui, sans-serif;">
184
- <defs>
185
- <!-- UML Activity colors - 2 main families -->
186
- <linearGradient id="whatGrad" x1="0%" y1="0%" x2="0%" y2="100%">
187
- <stop offset="0%" style="stop-color:#3b82f6"/>
188
- <stop offset="100%" style="stop-color:#1e40af"/>
189
- </linearGradient>
190
- <linearGradient id="howGrad" x1="0%" y1="0%" x2="0%" y2="100%">
191
- <stop offset="0%" style="stop-color:#0d9488"/>
192
- <stop offset="100%" style="stop-color:#0f766e"/>
193
- </linearGradient>
194
- <!-- Arrow gradients -->
195
- <linearGradient id="arrowGrad" x1="0%" y1="0%" x2="100%" y2="0%">
196
- <stop offset="0%" style="stop-color:#475569"/>
197
- <stop offset="100%" style="stop-color:#94a3b8"/>
198
- </linearGradient>
199
- <!-- Arrows - larger, filled triangles -->
200
- <marker id="arrowUml" markerWidth="12" markerHeight="10" refX="10" refY="5" orient="auto" markerUnits="userSpaceOnUse">
201
- <path d="M0,0 L12,5 L0,10 L3,5 Z" fill="#94a3b8"/>
202
- </marker>
203
- <marker id="arrowLoop" markerWidth="12" markerHeight="10" refX="10" refY="5" orient="auto" markerUnits="userSpaceOnUse">
204
- <path d="M0,0 L12,5 L0,10 L3,5 Z" fill="#f87171"/>
205
- </marker>
206
- <!-- Shadow filter -->
207
- <filter id="shadow" x="-10%" y="-10%" width="120%" height="130%">
208
- <feDropShadow dx="0" dy="2" stdDeviation="3" flood-opacity="0.3"/>
209
- </filter>
210
- <!-- Arrow glow filter -->
211
- <filter id="arrowGlow" x="-20%" y="-20%" width="140%" height="140%">
212
- <feGaussianBlur stdDeviation="1" result="blur"/>
213
- <feMerge>
214
- <feMergeNode in="blur"/>
215
- <feMergeNode in="SourceGraphic"/>
216
- </feMerge>
217
- </filter>
218
- </defs>
219
-
220
- <!-- Background swimlanes -->
221
- <!-- WHAT swimlane -->
222
- <rect x="20" y="60" width="230" height="320" rx="8" fill="rgba(59, 130, 246, 0.08)" stroke="rgba(59, 130, 246, 0.3)" stroke-width="1"/>
223
- <rect x="20" y="60" width="230" height="32" rx="8" fill="rgba(59, 130, 246, 0.15)"/>
224
- <text x="135" y="82" text-anchor="middle" fill="#3b82f6" font-size="12" font-weight="700" data-lang="fr">QUOI</text>
225
- <text x="135" y="82" text-anchor="middle" fill="#3b82f6" font-size="12" font-weight="700" data-lang="en">WHAT</text>
226
-
227
- <!-- HOW swimlane -->
228
- <rect x="20" y="400" width="230" height="270" rx="8" fill="rgba(13, 148, 136, 0.08)" stroke="rgba(13, 148, 136, 0.3)" stroke-width="1"/>
229
- <rect x="20" y="400" width="230" height="32" rx="8" fill="rgba(13, 148, 136, 0.15)"/>
230
- <text x="135" y="422" text-anchor="middle" fill="#0d9488" font-size="12" font-weight="700" data-lang="fr">COMMENT</text>
231
- <text x="135" y="422" text-anchor="middle" fill="#0d9488" font-size="12" font-weight="700" data-lang="en">HOW</text>
232
-
233
- <!-- UML Initial node (filled circle with ring) -->
234
- <circle cx="350" cy="30" r="14" fill="#1e293b" stroke="#64748b" stroke-width="2"/>
235
- <circle cx="350" cy="30" r="6" fill="#94a3b8"/>
236
- <path d="M350,44 L350,68" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
237
-
238
- <!-- USER REQUEST (rounded rect - UML action) -->
239
- <g transform="translate(270, 72)" filter="url(#shadow)">
240
- <rect x="0" y="0" width="160" height="40" rx="20" fill="#334155" stroke="#475569" stroke-width="1"/>
241
- <text x="80" y="25" text-anchor="middle" fill="#f1f5f9" font-size="12" font-weight="500" data-lang="fr">Demande utilisateur</text>
242
- <text x="80" y="25" text-anchor="middle" fill="#f1f5f9" font-size="12" font-weight="500" data-lang="en">User Request</text>
243
- </g>
244
- <path d="M350,112 L350,128" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
245
-
246
- <!-- PHASE 1: DISCOVER -->
247
- <g transform="translate(40, 132)" filter="url(#shadow)">
248
- <rect x="0" y="0" width="190" height="52" rx="6" fill="#1e3a5f" stroke="#3b82f6" stroke-width="2"/>
249
- <text x="95" y="22" text-anchor="middle" fill="#f1f5f9" font-size="13" font-weight="700">1. DISCOVER</text>
250
- <text x="95" y="40" text-anchor="middle" fill="#93c5fd" font-size="10" data-lang="fr">Elicitation + Similarite</text>
251
- <text x="95" y="40" text-anchor="middle" fill="#93c5fd" font-size="10" data-lang="en">Elicitation + Similarity</text>
252
- </g>
253
- <!-- Connector line from center to phase 1 (L-shaped with rounded corner) -->
254
- <path d="M350,132 L350,158 Q350,163 345,163 L235,163" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" fill="none" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
255
- <!-- Output from phase 1 -->
256
- <path d="M135,184 L135,204" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
257
-
258
- <!-- PHASE 2: EXPLORE -->
259
- <g transform="translate(40, 208)" filter="url(#shadow)">
260
- <rect x="0" y="0" width="190" height="52" rx="6" fill="#1e3a5f" stroke="#60a5fa" stroke-width="2" stroke-dasharray="4,2"/>
261
- <text x="95" y="22" text-anchor="middle" fill="#f1f5f9" font-size="13" font-weight="700">2. EXPLORE</text>
262
- <text x="95" y="40" text-anchor="middle" fill="#93c5fd" font-size="10" data-lang="fr">Contexte technique</text>
263
- <text x="95" y="40" text-anchor="middle" fill="#93c5fd" font-size="10" data-lang="en">Technical Context</text>
264
- <rect x="145" y="5" width="40" height="14" rx="3" fill="rgba(96, 165, 250, 0.3)"/>
265
- <text x="165" y="15" text-anchor="middle" fill="#93c5fd" font-size="8" font-weight="600">HAIKU</text>
266
- </g>
267
- <path d="M135,260 L135,280" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
268
-
269
- <!-- PHASE 3: ANALYSE -->
270
- <g transform="translate(40, 284)" filter="url(#shadow)">
271
- <rect x="0" y="0" width="190" height="52" rx="6" fill="#1e3a5f" stroke="#3b82f6" stroke-width="2"/>
272
- <text x="95" y="22" text-anchor="middle" fill="#f1f5f9" font-size="13" font-weight="700">3. ANALYSE</text>
273
- <text x="95" y="40" text-anchor="middle" fill="#93c5fd" font-size="10" data-lang="fr">Exigences enrichies</text>
274
- <text x="95" y="40" text-anchor="middle" fill="#93c5fd" font-size="10" data-lang="en">Enriched Requirements</text>
275
- </g>
276
-
277
- <!-- Transition from WHAT to HOW -->
278
- <!-- Horizontal separator -->
279
- <line x1="20" y1="390" x2="250" y2="390" stroke="#475569" stroke-width="1" stroke-dasharray="8,4"/>
280
- <path d="M135,336 L135,438" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
281
-
282
- <!-- PHASE 4: SPECIFY -->
283
- <g transform="translate(40, 442)" filter="url(#shadow)">
284
- <rect x="0" y="0" width="190" height="52" rx="6" fill="#134e4a" stroke="#0d9488" stroke-width="2"/>
285
- <text x="95" y="22" text-anchor="middle" fill="#f1f5f9" font-size="13" font-weight="700">4. SPECIFY</text>
286
- <text x="95" y="40" text-anchor="middle" fill="#5eead4" font-size="10" data-lang="fr">Specification (FRD)</text>
287
- <text x="95" y="40" text-anchor="middle" fill="#5eead4" font-size="10" data-lang="en">Functional Spec (FRD)</text>
288
- </g>
289
- <path d="M135,494 L135,514" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
290
-
291
- <!-- PHASE 5: VALIDATE - UML Decision diamond -->
292
- <g transform="translate(40, 518)" filter="url(#shadow)">
293
- <rect x="0" y="0" width="190" height="52" rx="6" fill="#134e4a" stroke="#14b8a6" stroke-width="2" stroke-dasharray="4,2"/>
294
- <text x="95" y="22" text-anchor="middle" fill="#f1f5f9" font-size="13" font-weight="700">5. VALIDATE</text>
295
- <text x="95" y="40" text-anchor="middle" fill="#5eead4" font-size="10" data-lang="fr">Validation utilisateur</text>
296
- <text x="95" y="40" text-anchor="middle" fill="#5eead4" font-size="10" data-lang="en">User Approval</text>
297
- <rect x="140" y="5" width="45" height="14" rx="3" fill="rgba(20, 184, 166, 0.3)"/>
298
- <text x="162" y="15" text-anchor="middle" fill="#5eead4" font-size="8" font-weight="600">SONNET</text>
299
- </g>
300
-
301
- <!-- Decision diamond after VALIDATE -->
302
- <polygon points="350,544 385,570 350,596 315,570" fill="#1e293b" stroke="#94a3b8" stroke-width="2"/>
303
- <text x="350" y="574" text-anchor="middle" fill="#f1f5f9" font-size="11" font-weight="600">OK?</text>
304
-
305
- <!-- Connector from VALIDATE to decision (L-shaped) -->
306
- <path d="M230,544 L310,544 Q315,544 315,549 L315,565" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" fill="none" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
307
-
308
- <!-- Loop back path (NO) - curved path going up -->
309
- <path d="M350,544 L350,310 Q350,305 345,305 L235,305" stroke="#f87171" stroke-width="3" stroke-linecap="round" stroke-dasharray="8,4" fill="none" marker-end="url(#arrowLoop)" filter="url(#arrowGlow)"/>
310
- <rect x="268" y="293" width="84" height="20" rx="4" fill="rgba(248, 113, 113, 0.15)" stroke="#f87171" stroke-width="1.5"/>
311
- <text x="310" y="307" text-anchor="middle" fill="#f87171" font-size="9" font-weight="600" data-lang="fr">MODIFS</text>
312
- <text x="310" y="307" text-anchor="middle" fill="#f87171" font-size="9" font-weight="600" data-lang="en">CHANGES</text>
313
-
314
- <!-- YES path to HANDOFF (L-shaped with rounded corner) -->
315
- <path d="M350,596 L350,620 Q350,625 345,625 L235,625" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" fill="none" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
316
-
317
- <!-- PHASE 6: HANDOFF -->
318
- <g transform="translate(40, 605)" filter="url(#shadow)">
319
- <rect x="0" y="0" width="190" height="52" rx="6" fill="#134e4a" stroke="#0d9488" stroke-width="2"/>
320
- <text x="95" y="22" text-anchor="middle" fill="#f1f5f9" font-size="13" font-weight="700">6. HANDOFF</text>
321
- <text x="95" y="40" text-anchor="middle" fill="#5eead4" font-size="10" data-lang="fr">Brief d'implementation</text>
322
- <text x="95" y="40" text-anchor="middle" fill="#5eead4" font-size="10" data-lang="en">Implementation Brief</text>
323
- </g>
324
- <path d="M135,657 L135,677" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
325
-
326
- <!-- /implement - UML Final action -->
327
- <g transform="translate(270, 681)" filter="url(#shadow)">
328
- <rect x="0" y="0" width="160" height="36" rx="18" fill="#475569" stroke="#94a3b8" stroke-width="1.5"/>
329
- <text x="80" y="23" text-anchor="middle" fill="#f1f5f9" font-size="12" font-weight="600">/implement</text>
330
- </g>
331
- <path d="M135,681 L135,699 Q135,704 140,704 L266,704" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" fill="none" marker-end="url(#arrowUml)" filter="url(#arrowGlow)"/>
332
-
333
- <!-- Legend -->
334
- <g transform="translate(520, 100)">
335
- <text x="0" y="0" fill="#94a3b8" font-size="11" font-weight="700" data-lang="fr">Legende</text>
336
- <text x="0" y="0" fill="#94a3b8" font-size="11" font-weight="700" data-lang="en">Legend</text>
337
- <!-- WHAT box -->
338
- <rect x="0" y="14" width="16" height="12" rx="2" fill="#1e3a5f" stroke="#3b82f6" stroke-width="1.5"/>
339
- <text x="24" y="24" fill="#94a3b8" font-size="9" data-lang="fr">Phase QUOI</text>
340
- <text x="24" y="24" fill="#94a3b8" font-size="9" data-lang="en">WHAT phase</text>
341
- <!-- HOW box -->
342
- <rect x="0" y="34" width="16" height="12" rx="2" fill="#134e4a" stroke="#0d9488" stroke-width="1.5"/>
343
- <text x="24" y="44" fill="#94a3b8" font-size="9" data-lang="fr">Phase COMMENT</text>
344
- <text x="24" y="44" fill="#94a3b8" font-size="9" data-lang="en">HOW phase</text>
345
- <!-- Dashed = agents -->
346
- <rect x="0" y="54" width="16" height="12" rx="2" fill="none" stroke="#60a5fa" stroke-width="1.5" stroke-dasharray="3,2"/>
347
- <text x="24" y="64" fill="#94a3b8" font-size="9">Haiku agents</text>
348
- <!-- Flow arrow -->
349
- <path d="M0,80 L12,80" stroke="#94a3b8" stroke-width="3" stroke-linecap="round" marker-end="url(#arrowUml)"/>
350
- <text x="24" y="84" fill="#94a3b8" font-size="9" data-lang="fr">Flux normal</text>
351
- <text x="24" y="84" fill="#94a3b8" font-size="9" data-lang="en">Normal flow</text>
352
- <!-- Loop -->
353
- <path d="M0,100 L12,100" stroke="#f87171" stroke-width="3" stroke-linecap="round" stroke-dasharray="6,3" marker-end="url(#arrowLoop)"/>
354
- <text x="24" y="104" fill="#94a3b8" font-size="9" data-lang="fr">Boucle retour</text>
355
- <text x="24" y="104" fill="#94a3b8" font-size="9" data-lang="en">Feedback loop</text>
356
- <!-- Decision -->
357
- <polygon points="8,114 16,122 8,130 0,122" fill="#1e293b" stroke="#94a3b8" stroke-width="1.5"/>
358
- <text x="24" y="126" fill="#94a3b8" font-size="9" data-lang="fr">Decision</text>
359
- <text x="24" y="126" fill="#94a3b8" font-size="9" data-lang="en">Decision</text>
360
- </g>
361
-
362
- <!-- Annotations -->
363
- <g transform="translate(520, 260)">
364
- <text x="0" y="0" fill="#64748b" font-size="10" font-weight="600" data-lang="fr">Fichiers de sortie</text>
365
- <text x="0" y="0" fill="#64748b" font-size="10" font-weight="600" data-lang="en">Output Files</text>
366
- <text x="0" y="18" fill="#94a3b8" font-size="9">01-business-requirements.md</text>
367
- <text x="0" y="32" fill="#94a3b8" font-size="9">02-technical-context.md</text>
368
- <text x="0" y="46" fill="#94a3b8" font-size="9">03-enriched-requirements.md</text>
369
- <text x="0" y="60" fill="#94a3b8" font-size="9">04-functional-spec.md</text>
370
- <text x="0" y="74" fill="#94a3b8" font-size="9">05-feedback-v[N].md</text>
371
- <text x="0" y="88" fill="#94a3b8" font-size="9">06-implementation-brief.md</text>
372
- </g>
373
- </svg>
374
- </div>
375
- </section>
376
-
377
- <!-- The 6 Phases -->
378
- <section id="phases">
379
- <h2>
380
- <span data-lang="fr">Les 6 Phases</span>
381
- <span data-lang="en">The 6 Phases</span>
382
- </h2>
383
-
384
- <div class="table-container">
385
- <table>
386
- <thead>
387
- <tr>
388
- <th>#</th>
389
- <th>Phase</th>
390
- <th data-lang="fr">Commande</th>
391
- <th data-lang="en">Command</th>
392
- <th data-lang="fr">Modele</th>
393
- <th data-lang="en">Model</th>
394
- <th data-lang="fr">Mission</th>
395
- <th data-lang="en">Mission</th>
396
- <th data-lang="fr">Fichier de sortie</th>
397
- <th data-lang="en">Output File</th>
398
- </tr>
399
- </thead>
400
- <tbody>
401
- <tr style="background: rgba(139, 92, 246, 0.1);">
402
- <td><strong>1</strong></td>
403
- <td><strong>DISCOVER</strong></td>
404
- <td><code>:1-discover</code></td>
405
- <td>ULTRATHINK</td>
406
- <td data-lang="fr">Elicitation + detection similarite</td>
407
- <td data-lang="en">Elicitation + similarity detection</td>
408
- <td><code>01-business-requirements.md</code></td>
409
- </tr>
410
- <tr style="background: rgba(59, 130, 246, 0.1);">
411
- <td><strong>2</strong></td>
412
- <td><strong>EXPLORE</strong></td>
413
- <td><code>:2-explore</code></td>
414
- <td>Haiku</td>
415
- <td data-lang="fr">Contexte technique (agents)</td>
416
- <td data-lang="en">Technical context (agents)</td>
417
- <td><code>02-technical-context.md</code></td>
418
- </tr>
419
- <tr style="background: rgba(236, 72, 153, 0.1);">
420
- <td><strong>3</strong></td>
421
- <td><strong>ANALYSE</strong></td>
422
- <td><code>:3-analyse</code></td>
423
- <td>ULTRATHINK</td>
424
- <td data-lang="fr">Synthese besoin + technique</td>
425
- <td data-lang="en">Merge need + technical context</td>
426
- <td><code>03-enriched-requirements.md</code></td>
427
- </tr>
428
- <tr style="background: rgba(168, 85, 247, 0.1);">
429
- <td><strong>4</strong></td>
430
- <td><strong>SPECIFY</strong></td>
431
- <td><code>:4-specify</code></td>
432
- <td>ULTRATHINK</td>
433
- <td data-lang="fr">Specification fonctionnelle (FRD)</td>
434
- <td data-lang="en">Functional specification (FRD)</td>
435
- <td><code>04-functional-spec.md</code></td>
436
- </tr>
437
- <tr style="background: rgba(34, 197, 94, 0.1);">
438
- <td><strong>5</strong></td>
439
- <td><strong>VALIDATE</strong></td>
440
- <td><code>:5-validate</code></td>
441
- <td>Sonnet</td>
442
- <td data-lang="fr">Validation utilisateur (loop → 3)</td>
443
- <td data-lang="en">User validation (loop → 3)</td>
444
- <td><code>05-feedback-v[N].md</code></td>
445
- </tr>
446
- <tr style="background: rgba(249, 115, 22, 0.1);">
447
- <td><strong>6</strong></td>
448
- <td><strong>HANDOFF</strong></td>
449
- <td><code>:6-handoff</code></td>
450
- <td>ULTRATHINK</td>
451
- <td data-lang="fr">Brief d'implementation (anglais)</td>
452
- <td data-lang="en">Implementation brief (English)</td>
453
- <td><code>06-implementation-brief.md</code></td>
454
- </tr>
455
- </tbody>
456
- </table>
457
- </div>
458
- </section>
459
-
460
- <!-- Phase 1: Discover -->
461
- <section id="phase-1">
462
- <h2>Phase 1: DISCOVER</h2>
463
- <div class="command-card">
464
- <div class="command-header">
465
- <code class="command-name">/business-analyse:1-discover</code>
466
- <span class="badge badge-purple">ULTRATHINK</span>
467
- </div>
468
- <div class="command-body">
469
- <p data-lang="fr">
470
- <strong>Mission</strong> : Comprendre le vrai besoin utilisateur avant toute exploration technique.
471
- </p>
472
- <p data-lang="en">
473
- <strong>Mission</strong>: Understand the real user need before any technical exploration.
474
- </p>
475
-
476
- <h4 data-lang="fr">Etapes</h4>
477
- <h4 data-lang="en">Steps</h4>
478
- <ol>
479
- <li data-lang="fr"><strong>Similarity Check</strong> : Lance l'agent <code>ba-similarity</code> pour detecter les doublons</li>
480
- <li data-lang="en"><strong>Similarity Check</strong>: Launches <code>ba-similarity</code> agent to detect duplicates</li>
481
- <li data-lang="fr"><strong>Elicitation</strong> : Pose des questions ciblees (max 5)</li>
482
- <li data-lang="en"><strong>Elicitation</strong>: Asks targeted questions (max 5)</li>
483
- <li data-lang="fr"><strong>Business Requirements</strong> : Formalise le besoin en langage utilisateur</li>
484
- <li data-lang="en"><strong>Business Requirements</strong>: Formalizes need in user language</li>
485
- </ol>
486
-
487
- <div class="code-block">
488
- <button class="copy-btn">Copy</button>
489
- <pre><code>/business-analyse:1-discover Je veux pouvoir exporter mes donnees clients</code></pre>
490
- </div>
491
-
492
- <h4 data-lang="fr">Resultats de similarite</h4>
493
- <h4 data-lang="en">Similarity Results</h4>
494
- <table class="reference-table">
495
- <thead>
496
- <tr>
497
- <th data-lang="fr">Resultat</th>
498
- <th data-lang="en">Result</th>
499
- <th>Action</th>
500
- </tr>
501
- </thead>
502
- <tbody>
503
- <tr>
504
- <td><strong>DUPLICATE</strong></td>
505
- <td data-lang="fr">STOP - Reference spec existante</td>
506
- <td data-lang="en">STOP - Reference existing spec</td>
507
- </tr>
508
- <tr>
509
- <td><strong>EXTEND</strong></td>
510
- <td data-lang="fr">Note feature existante a etendre</td>
511
- <td data-lang="en">Note existing feature to extend</td>
512
- </tr>
513
- <tr>
514
- <td><strong>NEW</strong></td>
515
- <td data-lang="fr">Proceder normalement</td>
516
- <td data-lang="en">Proceed normally</td>
517
- </tr>
518
- </tbody>
519
- </table>
520
- </div>
521
- </div>
522
- </section>
523
-
524
- <!-- Phase 2: Explore -->
525
- <section id="phase-2">
526
- <h2>Phase 2: EXPLORE</h2>
527
- <div class="command-card">
528
- <div class="command-header">
529
- <code class="command-name">/business-analyse:2-explore</code>
530
- <span class="badge badge-blue">Haiku Agents</span>
531
- </div>
532
- <div class="command-body">
533
- <p data-lang="fr">
534
- <strong>Mission</strong> : Collecter le contexte technique avec des agents paralleles.
535
- </p>
536
- <p data-lang="en">
537
- <strong>Mission</strong>: Collect technical context with parallel agents.
538
- </p>
539
-
540
- <div class="code-block">
541
- <button class="copy-btn">Copy</button>
542
- <pre><code>/business-analyse:2-explore [feature-name]</code></pre>
543
- </div>
544
-
545
- <h4 data-lang="fr">Selection automatique des agents</h4>
546
- <h4 data-lang="en">Automatic agent selection</h4>
547
-
548
- <table class="reference-table">
549
- <thead>
550
- <tr>
551
- <th data-lang="fr">Type de feature</th>
552
- <th data-lang="en">Feature type</th>
553
- <th>Agents</th>
554
- <th>Tokens</th>
555
- </tr>
556
- </thead>
557
- <tbody>
558
- <tr>
559
- <td>UI only</td>
560
- <td><code>explore-theme</code>, <code>explore-api</code></td>
561
- <td>~2,400</td>
562
- </tr>
563
- <tr>
564
- <td>Data feature</td>
565
- <td><code>explore-schema</code>, <code>explore-api</code></td>
566
- <td>~2,700</td>
567
- </tr>
568
- <tr>
569
- <td>New page</td>
570
- <td><code>explore-navigation</code>, <code>explore-theme</code>, <code>explore-api</code></td>
571
- <td>~3,600</td>
572
- </tr>
573
- <tr>
574
- <td>Security</td>
575
- <td><code>explore-permissions</code>, <code>explore-api</code></td>
576
- <td>~2,200</td>
577
- </tr>
578
- <tr>
579
- <td>Full module</td>
580
- <td><code>explore-schema</code>, <code>explore-permissions</code>, <code>explore-api</code></td>
581
- <td>~3,700</td>
582
- </tr>
583
- </tbody>
584
- </table>
585
-
586
- <div class="alert alert-info">
587
- <span class="alert-icon">&#128161;</span>
588
- <div class="alert-content">
589
- <p data-lang="fr"><strong>Maximum 3 agents</strong> pour optimiser les tokens.</p>
590
- <p data-lang="en"><strong>Maximum 3 agents</strong> to optimize tokens.</p>
591
- </div>
592
- </div>
593
- </div>
594
- </div>
595
- </section>
596
-
597
- <!-- Phase 3: Analyse -->
598
- <section id="phase-3">
599
- <h2>Phase 3: ANALYSE</h2>
600
- <div class="command-card">
601
- <div class="command-header">
602
- <code class="command-name">/business-analyse:3-analyse</code>
603
- <span class="badge badge-pink">ULTRATHINK</span>
604
- </div>
605
- <div class="command-body">
606
- <p data-lang="fr">
607
- <strong>Mission</strong> : Fusionner le besoin utilisateur avec le contexte technique. Identifier les gaps et conflits.
608
- </p>
609
- <p data-lang="en">
610
- <strong>Mission</strong>: Merge user need with technical context. Identify gaps and conflicts.
611
- </p>
612
-
613
- <div class="code-block">
614
- <button class="copy-btn">Copy</button>
615
- <pre><code>/business-analyse:3-analyse [feature-name]</code></pre>
616
- </div>
617
-
618
- <h4 data-lang="fr">Analyse des gaps</h4>
619
- <h4 data-lang="en">Gap Analysis</h4>
620
- <ul>
621
- <li data-lang="fr"><strong>Feasibility Check</strong> : Ce que l'utilisateur veut vs ce que le systeme peut faire</li>
622
- <li data-lang="en"><strong>Feasibility Check</strong>: What user wants vs what system can do</li>
623
- <li data-lang="fr"><strong>Conflicts</strong> : Contradictions entre besoin et contraintes techniques</li>
624
- <li data-lang="en"><strong>Conflicts</strong>: Contradictions between need and technical constraints</li>
625
- <li data-lang="fr"><strong>Opportunities</strong> : Features existantes qui peuvent aider</li>
626
- <li data-lang="en"><strong>Opportunities</strong>: Existing features that can help</li>
627
- </ul>
628
-
629
- <div class="alert alert-warning">
630
- <span class="alert-icon">&#9888;</span>
631
- <div class="alert-content">
632
- <p data-lang="fr">
633
- Si des gaps ou conflits existent, des <strong>questions ciblees</strong> sont posees a l'utilisateur avant de continuer.
634
- </p>
635
- <p data-lang="en">
636
- If gaps or conflicts exist, <strong>targeted questions</strong> are asked to the user before continuing.
637
- </p>
638
- </div>
639
- </div>
640
- </div>
641
- </div>
642
- </section>
643
-
644
- <!-- Phase 4: Specify -->
645
- <section id="phase-4">
646
- <h2>Phase 4: SPECIFY</h2>
647
- <div class="command-card">
648
- <div class="command-header">
649
- <code class="command-name">/business-analyse:4-specify</code>
650
- <span class="badge badge-purple">ULTRATHINK</span>
651
- </div>
652
- <div class="command-body">
653
- <p data-lang="fr">
654
- <strong>Mission</strong> : Produire le FRD (Functional Requirements Document) detaille pour validation humaine.
655
- </p>
656
- <p data-lang="en">
657
- <strong>Mission</strong>: Produce detailed FRD (Functional Requirements Document) for human validation.
658
- </p>
659
-
660
- <div class="code-block">
661
- <button class="copy-btn">Copy</button>
662
- <pre><code># Generate specification
663
- /business-analyse:4-specify [feature-name]
664
-
665
- # With HTML mockup
666
- /business-analyse:4-specify [feature-name] --mockup
667
-
668
- # With PlantUML diagrams
669
- /business-analyse:4-specify [feature-name] --plantuml</code></pre>
670
- </div>
671
-
672
- <h4 data-lang="fr">Sections dynamiques</h4>
673
- <h4 data-lang="en">Dynamic sections</h4>
674
- <table class="reference-table">
675
- <thead>
676
- <tr>
677
- <th>Section</th>
678
- <th data-lang="fr">Incluse quand</th>
679
- <th data-lang="en">Included when</th>
680
- </tr>
681
- </thead>
682
- <tbody>
683
- <tr><td>Context</td><td colspan="2">Always</td></tr>
684
- <tr><td>Functional Requirements</td><td colspan="2">Always</td></tr>
685
- <tr><td>Data Model</td><td data-lang="fr">Changements DB</td><td data-lang="en">DB changes</td></tr>
686
- <tr><td>UI Specification</td><td data-lang="fr">Changements UI</td><td data-lang="en">UI changes</td></tr>
687
- <tr><td>Navigation</td><td data-lang="fr">Nouvelle page</td><td data-lang="en">New page</td></tr>
688
- <tr><td>Permissions</td><td data-lang="fr">Nouvelles permissions</td><td data-lang="en">New permissions</td></tr>
689
- <tr><td>User Flow</td><td data-lang="fr">Workflow complexe</td><td data-lang="en">Complex workflow</td></tr>
690
- <tr><td>API Specification</td><td data-lang="fr">Changements backend</td><td data-lang="en">Backend changes</td></tr>
691
- <tr><td>Acceptance Criteria</td><td colspan="2">Always</td></tr>
692
- </tbody>
693
- </table>
694
-
695
- <h4>Options</h4>
696
- <table class="reference-table">
697
- <thead>
698
- <tr>
699
- <th>Option</th>
700
- <th data-lang="fr">Effet</th>
701
- <th data-lang="en">Effect</th>
702
- <th>Tokens</th>
703
- </tr>
704
- </thead>
705
- <tbody>
706
- <tr>
707
- <td><code>--mockup</code></td>
708
- <td data-lang="fr">Maquette HTML avec CSS projet</td>
709
- <td data-lang="en">HTML mockup with project CSS</td>
710
- <td>+2,000</td>
711
- </tr>
712
- <tr>
713
- <td><code>--plantuml</code></td>
714
- <td data-lang="fr">Diagrammes ER/sequence</td>
715
- <td data-lang="en">ER/sequence diagrams</td>
716
- <td>+800</td>
717
- </tr>
718
- </tbody>
719
- </table>
720
- </div>
721
- </div>
722
- </section>
723
-
724
- <!-- Phase 5: Validate -->
725
- <section id="phase-5">
726
- <h2>Phase 5: VALIDATE</h2>
727
- <div class="command-card">
728
- <div class="command-header">
729
- <code class="command-name">/business-analyse:5-validate</code>
730
- <span class="badge badge-green">Sonnet</span>
731
- </div>
732
- <div class="command-body">
733
- <p data-lang="fr">
734
- <strong>Mission</strong> : Presenter le FRD a l'utilisateur et collecter son feedback.
735
- </p>
736
- <p data-lang="en">
737
- <strong>Mission</strong>: Present FRD to user and collect feedback.
738
- </p>
739
-
740
- <div class="code-block">
741
- <button class="copy-btn">Copy</button>
742
- <pre><code>/business-analyse:5-validate [feature-name]</code></pre>
743
- </div>
744
-
745
- <h4 data-lang="fr">Options de validation</h4>
746
- <h4 data-lang="en">Validation Options</h4>
747
- <table class="reference-table">
748
- <thead>
749
- <tr>
750
- <th>Option</th>
751
- <th data-lang="fr">Action</th>
752
- <th data-lang="en">Action</th>
753
- </tr>
754
- </thead>
755
- <tbody>
756
- <tr style="background: rgba(34, 197, 94, 0.1);">
757
- <td><strong>APPROVED</strong></td>
758
- <td data-lang="fr">Passer a Phase 6 (Handoff)</td>
759
- <td data-lang="en">Proceed to Phase 6 (Handoff)</td>
760
- </tr>
761
- <tr style="background: rgba(234, 179, 8, 0.1);">
762
- <td><strong>MINOR CHANGES</strong></td>
763
- <td data-lang="fr">Modifications directes dans le FRD</td>
764
- <td data-lang="en">Direct modifications in FRD</td>
765
- </tr>
766
- <tr style="background: rgba(239, 68, 68, 0.1);">
767
- <td><strong>MAJOR CHANGES</strong></td>
768
- <td data-lang="fr">Retour a Phase 3 (Analyse)</td>
769
- <td data-lang="en">Return to Phase 3 (Analyse)</td>
770
- </tr>
771
- <tr style="background: rgba(107, 114, 128, 0.1);">
772
- <td><strong>REJECTED</strong></td>
773
- <td data-lang="fr">Archiver et recommencer</td>
774
- <td data-lang="en">Archive and start over</td>
775
- </tr>
776
- </tbody>
777
- </table>
778
-
779
- <div class="alert alert-info">
780
- <span class="alert-icon">&#128260;</span>
781
- <div class="alert-content">
782
- <h5 data-lang="fr">Boucle de validation</h5>
783
- <h5 data-lang="en">Validation Loop</h5>
784
- <p data-lang="fr">
785
- En cas de <strong>MAJOR CHANGES</strong>, le workflow retourne a la Phase 3 pour re-analyser avec les nouvelles informations.
786
- </p>
787
- <p data-lang="en">
788
- On <strong>MAJOR CHANGES</strong>, the workflow returns to Phase 3 to re-analyze with new information.
789
- </p>
790
- </div>
791
- </div>
792
- </div>
793
- </div>
794
- </section>
795
-
796
- <!-- Phase 6: Handoff -->
797
- <section id="phase-6">
798
- <h2>Phase 6: HANDOFF</h2>
799
- <div class="command-card">
800
- <div class="command-header">
801
- <code class="command-name">/business-analyse:6-handoff</code>
802
- <span class="badge badge-orange">ULTRATHINK</span>
803
- </div>
804
- <div class="command-body">
805
- <p data-lang="fr">
806
- <strong>Mission</strong> : Transformer le FRD valide en brief d'implementation pour Claude Code. Le brief est genere en <strong>anglais</strong> pour optimiser les tokens et la comprehension du modele.
807
- </p>
808
- <p data-lang="en">
809
- <strong>Mission</strong>: Transform validated FRD into implementation brief for Claude Code. The brief is generated in <strong>English</strong> to optimize tokens and model comprehension.
810
- </p>
811
-
812
- <div class="code-block">
813
- <button class="copy-btn">Copy</button>
814
- <pre><code>/business-analyse:6-handoff [feature-name]</code></pre>
815
- </div>
816
-
817
- <h4 data-lang="fr">Format de sortie (diff-like)</h4>
818
- <h4 data-lang="en">Output format (diff-like)</h4>
819
-
820
- <div class="code-block">
821
- <button class="copy-btn">Copy</button>
822
- <pre><code># IMPLEMENTATION BRIEF: [Feature Name]
823
-
824
- ## Files
825
-
826
- ### Backend
827
-
828
- CREATE `src/Domain/Entities/Feature.cs`
829
- COPY: `src/Domain/Entities/User.cs`
830
- CHANGE: class name, properties per spec
831
-
832
- MODIFY `src/Infrastructure/Data/AppDbContext.cs`
833
- AT: line 45
834
- ADD: `public DbSet&lt;Feature&gt; Features =&gt; Set&lt;Feature&gt;();`
835
-
836
- ### Frontend
837
-
838
- CREATE `src/app/module/feature/feature.component.ts`
839
- RUN FIRST: `ng generate component module/feature`
840
- COPY PATTERN: `src/app/existing/existing.component.ts`
841
-
842
- ## Commands
843
-
844
- ```bash
845
- dotnet build src/Api
846
- dotnet ef migrations add AddFeatureTable
847
- npm run build
848
- npm run lint
849
- ```
850
-
851
- ## Verify
852
-
853
- - [ ] Build passes
854
- - [ ] Navigate to /feature works
855
- - [ ] CRUD operations work</code></pre>
856
- </div>
857
-
858
- <div class="alert alert-success">
859
- <span class="alert-icon">&#128640;</span>
860
- <div class="alert-content">
861
- <h5 data-lang="fr">Pret pour implementation</h5>
862
- <h5 data-lang="en">Ready for implementation</h5>
863
- <p data-lang="fr">
864
- Le brief peut etre passe directement a <code>/implement</code> pour une execution oneshot.
865
- </p>
866
- <p data-lang="en">
867
- The brief can be passed directly to <code>/implement</code> for oneshot execution.
868
- </p>
869
- <div class="code-block" style="margin-top: 0.5rem;">
870
- <pre><code>/implement .claude/ba/[feature]/06-implementation-brief.md</code></pre>
871
- </div>
872
- </div>
873
- </div>
874
- </div>
875
- </div>
876
- </section>
877
-
878
- <!-- Agents -->
879
- <section id="agents">
880
- <h2 data-lang="fr">Agents specialises</h2>
881
- <h2 data-lang="en">Specialized Agents</h2>
882
-
883
- <table class="reference-table">
884
- <thead>
885
- <tr>
886
- <th>Agent</th>
887
- <th data-lang="fr">Mission</th>
888
- <th data-lang="en">Mission</th>
889
- <th data-lang="fr">Utilise en</th>
890
- <th data-lang="en">Used in</th>
891
- </tr>
892
- </thead>
893
- <tbody>
894
- <tr style="background: rgba(139, 92, 246, 0.1);">
895
- <td><code>ba-similarity</code></td>
896
- <td data-lang="fr">Detecte les features similaires ou doublons</td>
897
- <td data-lang="en">Detects similar features or duplicates</td>
898
- <td>Phase 1</td>
899
- </tr>
900
- <tr>
901
- <td><code>explore-api</code></td>
902
- <td data-lang="fr">Endpoints, controllers, DTOs, patterns API</td>
903
- <td data-lang="en">Endpoints, controllers, DTOs, API patterns</td>
904
- <td>Phase 2</td>
905
- </tr>
906
- <tr>
907
- <td><code>explore-schema</code></td>
908
- <td data-lang="fr">Schema DB, entites, configurations</td>
909
- <td data-lang="en">DB schema, entities, configurations</td>
910
- <td>Phase 2</td>
911
- </tr>
912
- <tr>
913
- <td><code>explore-permissions</code></td>
914
- <td data-lang="fr">RBAC, roles, autorisations</td>
915
- <td data-lang="en">RBAC, roles, authorizations</td>
916
- <td>Phase 2</td>
917
- </tr>
918
- <tr>
919
- <td><code>explore-navigation</code></td>
920
- <td data-lang="fr">Menus, routes, pages</td>
921
- <td data-lang="en">Menus, routes, pages</td>
922
- <td>Phase 2</td>
923
- </tr>
924
- <tr>
925
- <td><code>explore-theme</code></td>
926
- <td data-lang="fr">UI patterns, composants, design system</td>
927
- <td data-lang="en">UI patterns, components, design system</td>
928
- <td>Phase 2</td>
929
- </tr>
930
- </tbody>
931
- </table>
932
- </section>
933
-
934
- <!-- Files -->
935
- <section id="files">
936
- <h2>
937
- <span data-lang="fr">Structure des fichiers</span>
938
- <span data-lang="en">File Structure</span>
939
- </h2>
940
-
941
- <div class="code-block">
942
- <button class="copy-btn">Copy</button>
943
- <pre><code>.claude/ba/
944
- └── [feature-name]/
945
- ├── 01-business-requirements.md # Phase 1: DISCOVER
946
- ├── 02-technical-context.md # Phase 2: EXPLORE
947
- ├── 03-enriched-requirements.md # Phase 3: ANALYSE
948
- ├── 04-functional-spec.md # Phase 4: SPECIFY
949
- ├── 05-feedback-v1.md # Phase 5: VALIDATE (si changes)
950
- ├── 05-feedback-v2.md # (iterations)
951
- └── 06-implementation-brief.md # Phase 6: HANDOFF</code></pre>
952
- </div>
953
-
954
- <div class="table-container">
955
- <table>
956
- <thead>
957
- <tr>
958
- <th data-lang="fr">Fichier</th>
959
- <th data-lang="en">File</th>
960
- <th data-lang="fr">Genere par</th>
961
- <th data-lang="en">Generated by</th>
962
- <th data-lang="fr">Lu par</th>
963
- <th data-lang="en">Read by</th>
964
- </tr>
965
- </thead>
966
- <tbody>
967
- <tr>
968
- <td><code>01-business-requirements.md</code></td>
969
- <td>Phase 1</td>
970
- <td>Phase 2, 3</td>
971
- </tr>
972
- <tr>
973
- <td><code>02-technical-context.md</code></td>
974
- <td>Phase 2</td>
975
- <td>Phase 3</td>
976
- </tr>
977
- <tr>
978
- <td><code>03-enriched-requirements.md</code></td>
979
- <td>Phase 3</td>
980
- <td>Phase 4</td>
981
- </tr>
982
- <tr>
983
- <td><code>04-functional-spec.md</code></td>
984
- <td>Phase 4</td>
985
- <td data-lang="fr">Humain (validation), Phase 6</td>
986
- <td data-lang="en">Human (validation), Phase 6</td>
987
- </tr>
988
- <tr>
989
- <td><code>06-implementation-brief.md</code></td>
990
- <td>Phase 6</td>
991
- <td><code>/implement</code></td>
992
- </tr>
993
- </tbody>
994
- </table>
995
- </div>
996
- </section>
997
-
998
- <!-- Complete Example -->
999
- <section id="example">
1000
- <h2>
1001
- <span data-lang="fr">Exemple complet</span>
1002
- <span data-lang="en">Complete Example</span>
1003
- </h2>
1004
-
1005
- <div class="code-block">
1006
- <button class="copy-btn">Copy</button>
1007
- <pre><code># Phase 1: Comprendre le besoin
1008
- /business-analyse:1-discover Je veux gerer les utilisateurs avec des roles
1009
-
1010
- # → Questions d'elicitation posees
1011
- # → Agent ba-similarity verifie les doublons
1012
- # → Cree: .claude/ba/user-management/01-business-requirements.md
1013
-
1014
- # Phase 2: Explorer le contexte technique
1015
- /business-analyse:2-explore user-management
1016
-
1017
- # → Lance agents: explore-schema, explore-permissions, explore-api
1018
- # → Cree: .claude/ba/user-management/02-technical-context.md
1019
-
1020
- # Phase 3: Analyser et enrichir
1021
- /business-analyse:3-analyse user-management
1022
-
1023
- # → Fusionne besoin + technique
1024
- # → Identifie gaps et conflits
1025
- # → Cree: .claude/ba/user-management/03-enriched-requirements.md
1026
-
1027
- # Phase 4: Specifier (FRD)
1028
- /business-analyse:4-specify user-management --plantuml
1029
-
1030
- # → Genere le FRD complet avec diagrammes
1031
- # → Cree: .claude/ba/user-management/04-functional-spec.md
1032
-
1033
- # Phase 5: Valider avec l'utilisateur
1034
- /business-analyse:5-validate user-management
1035
-
1036
- # → Presente resume pour validation
1037
- # → Si APPROVED → Phase 6
1038
- # → Si MAJOR CHANGES → Retour Phase 3
1039
-
1040
- # Phase 6: Generer le brief d'implementation
1041
- /business-analyse:6-handoff user-management
1042
-
1043
- # → Transforme FRD en brief diff-like (anglais)
1044
- # → Cree: .claude/ba/user-management/06-implementation-brief.md
1045
-
1046
- # Implementation
1047
- /implement .claude/ba/user-management/06-implementation-brief.md
1048
-
1049
- # → Claude Code execute le brief en oneshot</code></pre>
1050
- </div>
1051
-
1052
- <div class="alert alert-info">
1053
- <span class="alert-icon">&#127919;</span>
1054
- <div class="alert-content">
1055
- <h5 data-lang="fr">Conseil</h5>
1056
- <h5 data-lang="en">Pro Tip</h5>
1057
- <p data-lang="fr">
1058
- Les fichiers dans <code>.claude/ba/</code> constituent un historique precieux. Conservez-les pour documenter les evolutions futures et faciliter la maintenance.
1059
- </p>
1060
- <p data-lang="en">
1061
- Files in <code>.claude/ba/</code> are valuable history. Keep them to document future evolutions and facilitate maintenance.
1062
- </p>
1063
- </div>
1064
- </div>
1065
- </section>
1066
-
1067
- </div>
1068
- </main>
1069
- </div>
1070
- </div>
1071
-
1072
- <script src="js/app.js"></script>
1073
- </body>
1074
- </html>
1
+ <!DOCTYPE html>
2
+ <html lang="fr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Business Analyse - SmartStack CLI</title>
7
+ <link rel="stylesheet" href="css/styles.css">
8
+ </head>
9
+ <body>
10
+ <div class="app-container">
11
+ <!-- Global Header -->
12
+ <header class="global-header">
13
+ <div class="logo">SS</div>
14
+ <span class="site-title">SmartStack CLI</span>
15
+ <span class="version-badge">v1.4.0</span>
16
+ <div class="header-divider"></div>
17
+ <span class="page-title">Business Analyse</span>
18
+ <nav class="breadcrumb">
19
+ <a href="index.html">
20
+ <span data-lang="fr">Accueil</span>
21
+ <span data-lang="en">Home</span>
22
+ </a>
23
+ <span class="breadcrumb-separator">&#8250;</span>
24
+ <span data-lang="fr">Workflows</span>
25
+ <span data-lang="en">Workflows</span>
26
+ <span class="breadcrumb-separator">&#8250;</span>
27
+ <span class="breadcrumb-current">Business Analyse</span>
28
+ </nav>
29
+ <select class="lang-select" id="lang-select" onchange="setLanguage(this.value); localStorage.setItem('doc-language', this.value);">
30
+ <option value="fr">FR</option>
31
+ <option value="en">EN</option>
32
+ </select>
33
+ <div class="header-search">
34
+ <div class="search-input-wrapper">
35
+ <span class="search-icon">&#128269;</span>
36
+ <input type="text" id="search-input" class="search-input" placeholder="Rechercher..." data-placeholder-fr="Rechercher..." data-placeholder-en="Search..." autocomplete="off">
37
+ <span class="search-shortcut">Ctrl+K</span>
38
+ </div>
39
+ <div id="search-results" class="search-results"></div>
40
+ </div>
41
+ </header>
42
+
43
+ <div class="app-body">
44
+ <!-- Sidebar -->
45
+ <aside class="sidebar">
46
+ <button class="sidebar-toggle" title="Toggle sidebar">
47
+ <span class="toggle-icon-collapse">&#171;</span>
48
+ <span class="toggle-icon-expand">&#187;</span>
49
+ </button>
50
+
51
+ <nav class="sidebar-nav">
52
+ <div class="nav-section">
53
+ <div class="nav-section-title">
54
+ <span data-lang="fr">Demarrage</span>
55
+ <span data-lang="en">Getting Started</span>
56
+ </div>
57
+ <a href="index.html" class="nav-item">
58
+ <span class="icon">&#127968;</span>
59
+ <span class="nav-text" data-lang="fr">Accueil</span>
60
+ <span class="nav-text" data-lang="en">Home</span>
61
+ </a>
62
+ <a href="installation.html" class="nav-item">
63
+ <span class="icon">&#128230;</span>
64
+ <span class="nav-text">Installation</span>
65
+ </a>
66
+ </div>
67
+
68
+ <div class="nav-section">
69
+ <div class="nav-section-title">Workflows</div>
70
+ <a href="gitflow.html" class="nav-item">
71
+ <span class="icon">&#128256;</span>
72
+ <span class="nav-text">GitFlow</span>
73
+ </a>
74
+ <a href="efcore.html" class="nav-item">
75
+ <span class="icon">&#128452;</span>
76
+ <span class="nav-text">EF Core</span>
77
+ </a>
78
+ <a href="apex.html" class="nav-item">
79
+ <span class="icon">&#127919;</span>
80
+ <span class="nav-text">APEX</span>
81
+ </a>
82
+ <a href="ralph-loop.html" class="nav-item">
83
+ <span class="icon">&#128260;</span>
84
+ <span class="nav-text">Ralph Loop</span>
85
+ </a>
86
+ <div class="nav-item-with-toc">
87
+ <a href="business-analyse.html" class="active">
88
+ <span class="icon">&#128202;</span>
89
+ <span class="nav-text">Business Analyse</span>
90
+ <button class="toc-toggle">&#9654;</button>
91
+ </a>
92
+ <nav class="sidebar-toc">
93
+ <a href="#introduction" class="sidebar-toc-link">Introduction</a>
94
+ <a href="#workflow" class="sidebar-toc-link">Workflow</a>
95
+ <a href="#automatic-mode" class="sidebar-toc-link">
96
+ <span data-lang="fr">Mode Automatique</span>
97
+ <span data-lang="en">Automatic Mode</span>
98
+ </a>
99
+ <a href="#phases" class="sidebar-toc-link">
100
+ <span data-lang="fr">Les 8 Phases</span>
101
+ <span data-lang="en">The 8 Phases</span>
102
+ </a>
103
+ <a href="#phase-0" class="sidebar-toc-link">0. Orchestrate</a>
104
+ <a href="#phase-1" class="sidebar-toc-link">1. Init</a>
105
+ <a href="#phase-2" class="sidebar-toc-link">2. Discover</a>
106
+ <a href="#phase-3" class="sidebar-toc-link">3. Analyse</a>
107
+ <a href="#phase-4" class="sidebar-toc-link">4. Specify</a>
108
+ <a href="#phase-5" class="sidebar-toc-link">5. Validate</a>
109
+ <a href="#phase-6" class="sidebar-toc-link">6. Handoff</a>
110
+ <a href="#phase-7" class="sidebar-toc-link">7. Doc-HTML</a>
111
+ <a href="#utilities" class="sidebar-toc-link">
112
+ <span data-lang="fr">Utilitaires</span>
113
+ <span data-lang="en">Utilities</span>
114
+ </a>
115
+ <a href="#agents" class="sidebar-toc-link">Agents</a>
116
+ <a href="#files" class="sidebar-toc-link">
117
+ <span data-lang="fr">Fichiers</span>
118
+ <span data-lang="en">Files</span>
119
+ </a>
120
+ <a href="#example" class="sidebar-toc-link">
121
+ <span data-lang="fr">Exemple</span>
122
+ <span data-lang="en">Example</span>
123
+ </a>
124
+ </nav>
125
+ </div>
126
+ </div>
127
+
128
+ <div class="nav-section">
129
+ <div class="nav-section-title">
130
+ <span data-lang="fr">Outils</span>
131
+ <span data-lang="en">Tools</span>
132
+ </div>
133
+ <a href="agents.html" class="nav-item">
134
+ <span class="icon">&#129302;</span>
135
+ <span class="nav-text">Agents</span>
136
+ </a>
137
+ <a href="commands.html" class="nav-item">
138
+ <span class="icon">&#9889;</span>
139
+ <span class="nav-text" data-lang="fr">Commandes</span>
140
+ <span class="nav-text" data-lang="en">Commands</span>
141
+ </a>
142
+ <a href="hooks.html" class="nav-item">
143
+ <span class="icon">&#128279;</span>
144
+ <span class="nav-text">Hooks</span>
145
+ </a>
146
+ </div>
147
+ </nav>
148
+ </aside>
149
+
150
+ <!-- Main Content -->
151
+ <main class="main-content">
152
+ <div class="content-full">
153
+
154
+ <!-- Introduction -->
155
+ <section id="introduction">
156
+ <h2>Introduction</h2>
157
+ <p data-lang="fr">
158
+ Le workflow <strong>Business Analyse v2</strong> est un systeme complet en <strong>8 phases</strong> pour transformer une demande utilisateur vague en une implementation precise et documentee. Il separe clairement l'analyse du besoin (WHAT) de la specification technique (HOW).
159
+ </p>
160
+ <p data-lang="en">
161
+ The <strong>Business Analyse v2</strong> workflow is a complete <strong>8-phase</strong> system to transform a vague user request into a precise documented implementation. It clearly separates need analysis (WHAT) from technical specification (HOW).
162
+ </p>
163
+
164
+ <div class="alert alert-warning">
165
+ <span class="alert-icon">&#9888;</span>
166
+ <div class="alert-content">
167
+ <h5 data-lang="fr">Principe fondamental</h5>
168
+ <h5 data-lang="en">Core Principle</h5>
169
+ <p data-lang="fr">
170
+ <strong>Comprendre avant de specifier.</strong> Les phases 1-3 se concentrent sur le BESOIN (langage utilisateur), les phases 4-6 sur la SOLUTION (langage technique).
171
+ </p>
172
+ <p data-lang="en">
173
+ <strong>Understand before specifying.</strong> Phases 1-3 focus on the NEED (user language), phases 4-6 on the SOLUTION (technical language).
174
+ </p>
175
+ </div>
176
+ </div>
177
+
178
+ <div class="alert alert-success">
179
+ <span class="alert-icon">&#129504;</span>
180
+ <div class="alert-content">
181
+ <h5>ULTRATHINK</h5>
182
+ <p data-lang="fr">
183
+ Les phases critiques (0, 2, 3, 4, 6) utilisent <strong>ULTRATHINK</strong> pour une reflexion approfondie. Les phases simples (1, 5, 7) utilisent des modeles plus legers. La phase 7 genere la documentation HTML.
184
+ </p>
185
+ <p data-lang="en">
186
+ Critical phases (0, 2, 3, 4, 6) use <strong>ULTRATHINK</strong> for deep reasoning. Simple phases (1, 5, 7) use lighter models. Phase 7 generates HTML documentation.
187
+ </p>
188
+ </div>
189
+ </div>
190
+ </section>
191
+
192
+ <!-- Automatic Mode -->
193
+ <section id="automatic-mode">
194
+ <h2>
195
+ <span data-lang="fr">Mode Automatique</span>
196
+ <span data-lang="en">Automatic Mode</span>
197
+ </h2>
198
+
199
+ <div class="command-card">
200
+ <div class="command-header">
201
+ <code class="command-name">/business-analyse</code>
202
+ <span class="badge badge-purple">ORCHESTRATE</span>
203
+ </div>
204
+ <div class="command-body">
205
+ <p data-lang="fr">
206
+ Lancez le <strong>workflow complet automatique</strong> de l'analyse metier a la documentation. La phase 0 orchestre l'execution de toutes les phases successives avec une granularite configurable.
207
+ </p>
208
+ <p data-lang="en">
209
+ Launch the <strong>complete automatic workflow</strong> from business analysis to documentation. Phase 0 orchestrates execution of all successive phases with configurable granularity.
210
+ </p>
211
+
212
+ <div class="code-block">
213
+ <button class="copy-btn">Copy</button>
214
+ <pre><code>/business-analyse [feature-name] [options]</code></pre>
215
+ </div>
216
+
217
+ <h4>
218
+ <span data-lang="fr">Niveaux de granularite</span>
219
+ <span data-lang="en">Granularity Levels</span>
220
+ </h4>
221
+ <table class="reference-table">
222
+ <thead>
223
+ <tr>
224
+ <th>
225
+ <span data-lang="fr">Niveau</span>
226
+ <span data-lang="en">Level</span>
227
+ </th>
228
+ <th>
229
+ <span data-lang="fr">Couverture</span>
230
+ <span data-lang="en">Coverage</span>
231
+ </th>
232
+ <th>Description</th>
233
+ </tr>
234
+ </thead>
235
+ <tbody>
236
+ <tr>
237
+ <td><strong>Muscles</strong></td>
238
+ <td>
239
+ <span data-lang="fr">Phases principales</span>
240
+ <span data-lang="en">Main phases</span>
241
+ </td>
242
+ <td>
243
+ <span data-lang="fr">Phases 0-6, haute vue d'ensemble</span>
244
+ <span data-lang="en">Phases 0-6, high overview</span>
245
+ </td>
246
+ </tr>
247
+ <tr>
248
+ <td><strong>Section</strong></td>
249
+ <td>
250
+ <span data-lang="fr">Toutes phases</span>
251
+ <span data-lang="en">All phases</span>
252
+ </td>
253
+ <td>
254
+ <span data-lang="fr">Phases 0-7 avec details complets</span>
255
+ <span data-lang="en">Phases 0-7 with full details</span>
256
+ </td>
257
+ </tr>
258
+ <tr>
259
+ <td><strong>Resources</strong></td>
260
+ <td>
261
+ <span data-lang="fr">Etendu</span>
262
+ <span data-lang="en">Extended</span>
263
+ </td>
264
+ <td>
265
+ <span data-lang="fr">Phases 0-7 + agents, hooks, ressources</span>
266
+ <span data-lang="en">Phases 0-7 + agents, hooks, resources</span>
267
+ </td>
268
+ </tr>
269
+ </tbody>
270
+ </table>
271
+
272
+ <h4>Workflow Complet</h4>
273
+ <div class="svg-diagram" style="max-width: 100%; overflow-x: auto;">
274
+ <svg viewBox="0 0 560 260" xmlns="http://www.w3.org/2000/svg" style="font-family: 'Inter', system-ui, sans-serif; min-width: 480px;">
275
+ <defs>
276
+ <marker id="arrowAuto" markerWidth="12" markerHeight="10" refX="10" refY="5" orient="auto" markerUnits="userSpaceOnUse">
277
+ <path d="M0,0 L12,5 L0,10 L3,5 Z" fill="#94a3b8"/>
278
+ </marker>
279
+ <filter id="shadowAuto" x="-10%" y="-10%" width="120%" height="130%">
280
+ <feDropShadow dx="0" dy="2" stdDeviation="3" flood-opacity="0.3"/>
281
+ </filter>
282
+ </defs>
283
+
284
+ <!-- BA Box -->
285
+ <g transform="translate(20, 80)" filter="url(#shadowAuto)">
286
+ <rect x="0" y="0" width="100" height="60" rx="6" fill="#1e3a5f" stroke="#3b82f6" stroke-width="2"/>
287
+ <text x="50" y="22" text-anchor="middle" fill="#f1f5f9" font-size="12" font-weight="700">Business</text>
288
+ <text x="50" y="38" text-anchor="middle" fill="#93c5fd" font-size="10">Analyse</text>
289
+ </g>
290
+ <path d="M120,110 L160,110" stroke="#94a3b8" stroke-width="3" marker-end="url(#arrowAuto)"/>
291
+
292
+ <!-- Ralph Loop Box -->
293
+ <g transform="translate(160, 80)" filter="url(#shadowAuto)">
294
+ <rect x="0" y="0" width="100" height="60" rx="6" fill="#134e4a" stroke="#0d9488" stroke-width="2"/>
295
+ <text x="50" y="22" text-anchor="middle" fill="#f1f5f9" font-size="12" font-weight="700">Ralph</text>
296
+ <text x="50" y="38" text-anchor="middle" fill="#5eead4" font-size="10">Loop</text>
297
+ </g>
298
+ <path d="M260,110 L300,110" stroke="#94a3b8" stroke-width="3" marker-end="url(#arrowAuto)"/>
299
+
300
+ <!-- Implementation Box -->
301
+ <g transform="translate(300, 80)" filter="url(#shadowAuto)">
302
+ <rect x="0" y="0" width="100" height="60" rx="6" fill="#7c2d12" stroke="#ea580c" stroke-width="2"/>
303
+ <text x="50" y="22" text-anchor="middle" fill="#f1f5f9" font-size="12" font-weight="700">Claude</text>
304
+ <text x="50" y="38" text-anchor="middle" fill="#fdba74" font-size="10">Code</text>
305
+ </g>
306
+ <path d="M400,110 L440,110" stroke="#94a3b8" stroke-width="3" marker-end="url(#arrowAuto)"/>
307
+
308
+ <!-- Documentation Box -->
309
+ <g transform="translate(440, 80)" filter="url(#shadowAuto)">
310
+ <rect x="0" y="0" width="100" height="60" rx="6" fill="#3b0764" stroke="#d946ef" stroke-width="2"/>
311
+ <text x="50" y="22" text-anchor="middle" fill="#f1f5f9" font-size="12" font-weight="700">HTML</text>
312
+ <text x="50" y="38" text-anchor="middle" fill="#e879f9" font-size="10">Docs</text>
313
+ </g>
314
+
315
+ <!-- Arrow labels -->
316
+ <text x="140" y="70" text-anchor="middle" fill="#94a3b8" font-size="9" font-weight="600">Phases 1-6</text>
317
+ <text x="280" y="70" text-anchor="middle" fill="#94a3b8" font-size="9" font-weight="600">Brief</text>
318
+ <text x="420" y="70" text-anchor="middle" fill="#94a3b8" font-size="9" font-weight="600">Code</text>
319
+ <text x="540" y="70" text-anchor="middle" fill="#94a3b8" font-size="9" font-weight="600">Phase 7</text>
320
+
321
+ <!-- Output legend -->
322
+ <text x="20" y="170" fill="#94a3b8" font-size="10" font-weight="700" data-lang="fr">Fichiers generes</text>
323
+ <text x="20" y="170" fill="#94a3b8" font-size="10" font-weight="700" data-lang="en">Generated files</text>
324
+
325
+ <text x="20" y="190" fill="#64748b" font-size="9">.claude/ba/[feature]/01-06-*.md (phases)</text>
326
+ <text x="20" y="205" fill="#64748b" font-size="9">.claude/ba/[feature]/07-documentation.html (docs)</text>
327
+ <text x="20" y="220" fill="#64748b" font-size="9">Implementation logs &amp; artifacts</text>
328
+ </svg>
329
+ </div>
330
+ </div>
331
+ </div>
332
+ </section>
333
+
334
+ <!-- Workflow -->
335
+ <section id="workflow">
336
+ <h2>Workflow</h2>
337
+
338
+ <div class="svg-diagram" style="max-width: 100%; overflow-x: auto;">
339
+ <svg viewBox="0 0 1050 320" xmlns="http://www.w3.org/2000/svg" style="font-family: 'Inter', system-ui, sans-serif; min-width: 800px;">
340
+ <defs>
341
+ <!-- Arrow pointing RIGHT (gray) -->
342
+ <marker id="arrowH" markerWidth="10" markerHeight="8" refX="9" refY="4" orient="auto" markerUnits="userSpaceOnUse">
343
+ <path d="M0,0 L10,4 L0,8 L2,4 Z" fill="#94a3b8"/>
344
+ </marker>
345
+ <!-- Arrow pointing DOWN (gray) - fixed orientation -->
346
+ <marker id="arrowDown" markerWidth="8" markerHeight="10" refX="4" refY="9" orient="0" markerUnits="userSpaceOnUse">
347
+ <path d="M0,0 L4,10 L8,0 L4,2 Z" fill="#94a3b8"/>
348
+ </marker>
349
+ <!-- Arrow pointing LEFT (red) - fixed orientation -->
350
+ <marker id="arrowLeft" markerWidth="10" markerHeight="8" refX="1" refY="4" orient="0" markerUnits="userSpaceOnUse">
351
+ <path d="M10,0 L0,4 L10,8 L8,4 Z" fill="#f87171"/>
352
+ </marker>
353
+ <filter id="shadowH" x="-10%" y="-10%" width="120%" height="130%">
354
+ <feDropShadow dx="0" dy="2" stdDeviation="2" flood-opacity="0.25"/>
355
+ </filter>
356
+ </defs>
357
+
358
+ <!-- WHAT Swimlane (top) -->
359
+ <rect x="10" y="40" width="520" height="90" rx="8" fill="rgba(59, 130, 246, 0.06)" stroke="rgba(59, 130, 246, 0.25)" stroke-width="1"/>
360
+ <rect x="10" y="40" width="50" height="90" rx="8" fill="rgba(59, 130, 246, 0.12)"/>
361
+ <text x="35" y="90" text-anchor="middle" fill="#3b82f6" font-size="11" font-weight="700" transform="rotate(-90, 35, 90)" data-lang="fr">QUOI</text>
362
+ <text x="35" y="90" text-anchor="middle" fill="#3b82f6" font-size="11" font-weight="700" transform="rotate(-90, 35, 90)" data-lang="en">WHAT</text>
363
+
364
+ <!-- HOW Swimlane (bottom) - extended width -->
365
+ <rect x="10" y="140" width="1020" height="90" rx="8" fill="rgba(13, 148, 136, 0.06)" stroke="rgba(13, 148, 136, 0.25)" stroke-width="1"/>
366
+ <rect x="10" y="140" width="50" height="90" rx="8" fill="rgba(13, 148, 136, 0.12)"/>
367
+ <text x="35" y="190" text-anchor="middle" fill="#0d9488" font-size="11" font-weight="700" transform="rotate(-90, 35, 190)" data-lang="fr">COMMENT</text>
368
+ <text x="35" y="190" text-anchor="middle" fill="#0d9488" font-size="11" font-weight="700" transform="rotate(-90, 35, 190)" data-lang="en">HOW</text>
369
+
370
+ <!-- Start node - centered above Demande -->
371
+ <circle cx="115" cy="20" r="10" fill="#1e293b" stroke="#64748b" stroke-width="2"/>
372
+ <circle cx="115" cy="20" r="4" fill="#94a3b8"/>
373
+ <path d="M115,30 L115,48" stroke="#94a3b8" stroke-width="2" marker-end="url(#arrowDown)"/>
374
+
375
+ <!-- User Request - Demande -->
376
+ <g transform="translate(70, 55)" filter="url(#shadowH)">
377
+ <rect x="0" y="0" width="90" height="30" rx="15" fill="#334155" stroke="#475569" stroke-width="1"/>
378
+ <text x="45" y="19" text-anchor="middle" fill="#f1f5f9" font-size="9" font-weight="500" data-lang="fr">Demande</text>
379
+ <text x="45" y="19" text-anchor="middle" fill="#f1f5f9" font-size="9" font-weight="500" data-lang="en">Request</text>
380
+ </g>
381
+ <path d="M160,70 L195,70" stroke="#94a3b8" stroke-width="2" marker-end="url(#arrowH)"/>
382
+
383
+ <!-- Phase 2: DISCOVER -->
384
+ <g transform="translate(200, 50)" filter="url(#shadowH)">
385
+ <rect x="0" y="0" width="130" height="40" rx="5" fill="#1e3a5f" stroke="#3b82f6" stroke-width="2"/>
386
+ <text x="65" y="16" text-anchor="middle" fill="#f1f5f9" font-size="11" font-weight="700">2. DISCOVER</text>
387
+ <text x="65" y="30" text-anchor="middle" fill="#93c5fd" font-size="8">Elicitation</text>
388
+ </g>
389
+ <path d="M330,70 L360,70" stroke="#94a3b8" stroke-width="2" marker-end="url(#arrowH)"/>
390
+
391
+ <!-- Phase 3: ANALYSE -->
392
+ <g transform="translate(365, 50)" filter="url(#shadowH)">
393
+ <rect x="0" y="0" width="130" height="40" rx="5" fill="#1e3a5f" stroke="#3b82f6" stroke-width="2"/>
394
+ <text x="65" y="16" text-anchor="middle" fill="#f1f5f9" font-size="11" font-weight="700">3. ANALYSE</text>
395
+ <text x="65" y="30" text-anchor="middle" fill="#93c5fd" font-size="8">BRD</text>
396
+ </g>
397
+
398
+ <!-- Transition arrow WHAT -> HOW (simple L-shape to SPECIFY top) -->
399
+ <path d="M430,90 L430,130 L265,130 L265,160" stroke="#94a3b8" stroke-width="2" fill="none" marker-end="url(#arrowDown)"/>
400
+
401
+ <!-- Phase 4: SPECIFY - repositioned under DISCOVER -->
402
+ <g transform="translate(200, 165)" filter="url(#shadowH)">
403
+ <rect x="0" y="0" width="130" height="40" rx="5" fill="#134e4a" stroke="#0d9488" stroke-width="2"/>
404
+ <text x="65" y="16" text-anchor="middle" fill="#f1f5f9" font-size="11" font-weight="700">4. SPECIFY</text>
405
+ <text x="65" y="30" text-anchor="middle" fill="#5eead4" font-size="8">FRD</text>
406
+ </g>
407
+ <path d="M330,185 L360,185" stroke="#94a3b8" stroke-width="2" marker-end="url(#arrowH)"/>
408
+
409
+ <!-- Phase 5: VALIDATE - repositioned under ANALYSE -->
410
+ <g transform="translate(365, 165)" filter="url(#shadowH)">
411
+ <rect x="0" y="0" width="130" height="40" rx="5" fill="#134e4a" stroke="#14b8a6" stroke-width="2" stroke-dasharray="4,2"/>
412
+ <text x="65" y="16" text-anchor="middle" fill="#f1f5f9" font-size="11" font-weight="700">5. VALIDATE</text>
413
+ <text x="65" y="30" text-anchor="middle" fill="#5eead4" font-size="8">User Gate</text>
414
+ </g>
415
+ <path d="M495,185 L520,185" stroke="#94a3b8" stroke-width="2" marker-end="url(#arrowH)"/>
416
+
417
+ <!-- Decision diamond -->
418
+ <polygon points="550,170 575,185 550,200 525,185" fill="#1e293b" stroke="#94a3b8" stroke-width="2"/>
419
+ <text x="550" y="189" text-anchor="middle" fill="#f1f5f9" font-size="9" font-weight="600">OK?</text>
420
+
421
+ <!-- Feedback loop (enters ANALYSE from RIGHT side) -->
422
+ <path d="M550,170 L550,70 L500,70" stroke="#f87171" stroke-width="2" stroke-dasharray="6,3" fill="none" marker-end="url(#arrowLeft)"/>
423
+ <rect x="515" y="45" width="55" height="16" rx="3" fill="rgba(248, 113, 113, 0.15)" stroke="#f87171" stroke-width="1"/>
424
+ <text x="543" y="57" text-anchor="middle" fill="#f87171" font-size="8" font-weight="600" data-lang="fr">MODIFS</text>
425
+ <text x="543" y="57" text-anchor="middle" fill="#f87171" font-size="8" font-weight="600" data-lang="en">CHANGES</text>
426
+
427
+ <!-- Continue to HANDOFF -->
428
+ <path d="M575,185 L605,185" stroke="#94a3b8" stroke-width="2" marker-end="url(#arrowH)"/>
429
+
430
+ <!-- Phase 6: HANDOFF -->
431
+ <g transform="translate(610, 165)" filter="url(#shadowH)">
432
+ <rect x="0" y="0" width="130" height="40" rx="5" fill="#134e4a" stroke="#0d9488" stroke-width="2"/>
433
+ <text x="65" y="16" text-anchor="middle" fill="#f1f5f9" font-size="11" font-weight="700">6. HANDOFF</text>
434
+ <text x="65" y="30" text-anchor="middle" fill="#5eead4" font-size="8">Brief EN</text>
435
+ </g>
436
+ <path d="M740,185 L770,185" stroke="#94a3b8" stroke-width="2" marker-end="url(#arrowH)"/>
437
+
438
+ <!-- Phase 7: DOC-HTML -->
439
+ <g transform="translate(775, 165)" filter="url(#shadowH)">
440
+ <rect x="0" y="0" width="130" height="40" rx="5" fill="#3b0764" stroke="#d946ef" stroke-width="2"/>
441
+ <text x="65" y="16" text-anchor="middle" fill="#f1f5f9" font-size="11" font-weight="700">7. DOC-HTML</text>
442
+ <text x="65" y="30" text-anchor="middle" fill="#e879f9" font-size="8">Documentation</text>
443
+ </g>
444
+ <path d="M905,185 L935,185" stroke="#94a3b8" stroke-width="2" marker-end="url(#arrowH)"/>
445
+
446
+ <!-- /implement -->
447
+ <g transform="translate(940, 171)" filter="url(#shadowH)">
448
+ <rect x="0" y="0" width="80" height="28" rx="14" fill="#475569" stroke="#94a3b8" stroke-width="1"/>
449
+ <text x="40" y="18" text-anchor="middle" fill="#f1f5f9" font-size="9" font-weight="600">/implement</text>
450
+ </g>
451
+
452
+ <!-- Legend (bottom - horizontal layout) -->
453
+ <g transform="translate(10, 265)">
454
+ <text x="0" y="0" fill="#94a3b8" font-size="10" font-weight="700" data-lang="fr">Legende:</text>
455
+ <text x="0" y="0" fill="#94a3b8" font-size="10" font-weight="700" data-lang="en">Legend:</text>
456
+
457
+ <!-- WHAT -->
458
+ <rect x="70" y="-9" width="14" height="10" rx="2" fill="#1e3a5f" stroke="#3b82f6" stroke-width="1"/>
459
+ <text x="90" y="0" fill="#94a3b8" font-size="9" data-lang="fr">QUOI</text>
460
+ <text x="90" y="0" fill="#94a3b8" font-size="9" data-lang="en">WHAT</text>
461
+
462
+ <!-- HOW -->
463
+ <rect x="150" y="-9" width="14" height="10" rx="2" fill="#134e4a" stroke="#0d9488" stroke-width="1"/>
464
+ <text x="170" y="0" fill="#94a3b8" font-size="9" data-lang="fr">COMMENT</text>
465
+ <text x="170" y="0" fill="#94a3b8" font-size="9" data-lang="en">HOW</text>
466
+
467
+ <!-- DOC -->
468
+ <rect x="250" y="-9" width="14" height="10" rx="2" fill="#3b0764" stroke="#d946ef" stroke-width="1"/>
469
+ <text x="270" y="0" fill="#94a3b8" font-size="9">DOC</text>
470
+
471
+ <!-- Flow -->
472
+ <path d="M320,-4 L335,-4" stroke="#94a3b8" stroke-width="2" marker-end="url(#arrowH)"/>
473
+ <text x="345" y="0" fill="#94a3b8" font-size="9">Flow</text>
474
+
475
+ <!-- Loop -->
476
+ <path d="M390,-4 L405,-4" stroke="#f87171" stroke-width="2" stroke-dasharray="4,2"/>
477
+ <text x="415" y="0" fill="#94a3b8" font-size="9">Loop</text>
478
+ </g>
479
+
480
+ <!-- Output files (bottom right) -->
481
+ <g transform="translate(500, 265)">
482
+ <text x="0" y="0" fill="#64748b" font-size="10" font-weight="600" data-lang="fr">Fichiers generes:</text>
483
+ <text x="0" y="0" fill="#64748b" font-size="10" font-weight="600" data-lang="en">Generated files:</text>
484
+ <text x="130" y="0" fill="#94a3b8" font-size="8">01-business-requirements.md → 05-implementation-brief.md → 06-documentation.html</text>
485
+ </g>
486
+ </svg>
487
+ </div>
488
+ </section>
489
+
490
+ <!-- The 8 Phases -->
491
+ <section id="phases">
492
+ <h2>
493
+ <span data-lang="fr">Les 8 Phases</span>
494
+ <span data-lang="en">The 8 Phases</span>
495
+ </h2>
496
+
497
+ <div class="table-container">
498
+ <table>
499
+ <thead>
500
+ <tr>
501
+ <th>#</th>
502
+ <th>Phase</th>
503
+ <th>
504
+ <span data-lang="fr">Commande</span>
505
+ <span data-lang="en">Command</span>
506
+ </th>
507
+ <th>
508
+ <span data-lang="fr">Modele</span>
509
+ <span data-lang="en">Model</span>
510
+ </th>
511
+ <th>Mission</th>
512
+ <th>
513
+ <span data-lang="fr">Fichier de sortie</span>
514
+ <span data-lang="en">Output File</span>
515
+ </th>
516
+ </tr>
517
+ </thead>
518
+ <tbody>
519
+ <tr style="background: rgba(139, 92, 246, 0.1);">
520
+ <td><strong>0</strong></td>
521
+ <td><strong>ORCHESTRATE</strong></td>
522
+ <td><code>:0-orchestrate</code></td>
523
+ <td>OPUS/ULTRATHINK</td>
524
+ <td>
525
+ <span data-lang="fr">Orchestration automatique complete</span>
526
+ <span data-lang="en">Complete automatic orchestration</span>
527
+ </td>
528
+ <td>—</td>
529
+ </tr>
530
+ <tr style="background: rgba(59, 130, 246, 0.1);">
531
+ <td><strong>1</strong></td>
532
+ <td><strong>INIT</strong></td>
533
+ <td><code>:1-init</code></td>
534
+ <td>Haiku</td>
535
+ <td>
536
+ <span data-lang="fr">Initialiser la structure BA</span>
537
+ <span data-lang="en">Initialize BA structure</span>
538
+ </td>
539
+ <td>—</td>
540
+ </tr>
541
+ <tr style="background: rgba(59, 130, 246, 0.1);">
542
+ <td><strong>2</strong></td>
543
+ <td><strong>DISCOVER</strong></td>
544
+ <td><code>:2-discover</code></td>
545
+ <td>OPUS/ULTRATHINK</td>
546
+ <td>
547
+ <span data-lang="fr">Elicitation + detection similarite</span>
548
+ <span data-lang="en">Elicitation + similarity detection</span>
549
+ </td>
550
+ <td><code>01-business-requirements.md</code></td>
551
+ </tr>
552
+ <tr style="background: rgba(59, 130, 246, 0.1);">
553
+ <td><strong>3</strong></td>
554
+ <td><strong>ANALYSE</strong></td>
555
+ <td><code>:3-analyse</code></td>
556
+ <td>Sonnet/ULTRATHINK</td>
557
+ <td>
558
+ <span data-lang="fr">Synthese besoin + technique</span>
559
+ <span data-lang="en">Merge need + technical context</span>
560
+ </td>
561
+ <td><code>02-enriched-requirements.md</code></td>
562
+ </tr>
563
+ <tr style="background: rgba(13, 148, 136, 0.1);">
564
+ <td><strong>4</strong></td>
565
+ <td><strong>SPECIFY</strong></td>
566
+ <td><code>:4-specify</code></td>
567
+ <td>Sonnet/ULTRATHINK</td>
568
+ <td>
569
+ <span data-lang="fr">Specification fonctionnelle (FRD)</span>
570
+ <span data-lang="en">Functional specification (FRD)</span>
571
+ </td>
572
+ <td><code>03-functional-spec.md</code></td>
573
+ </tr>
574
+ <tr style="background: rgba(13, 148, 136, 0.1);">
575
+ <td><strong>5</strong></td>
576
+ <td><strong>VALIDATE</strong></td>
577
+ <td><code>:5-validate</code></td>
578
+ <td>Haiku</td>
579
+ <td>
580
+ <span data-lang="fr">Validation utilisateur (loop → 3)</span>
581
+ <span data-lang="en">User validation (loop → 3)</span>
582
+ </td>
583
+ <td><code>04-feedback-v[N].md</code></td>
584
+ </tr>
585
+ <tr style="background: rgba(13, 148, 136, 0.1);">
586
+ <td><strong>6</strong></td>
587
+ <td><strong>HANDOFF</strong></td>
588
+ <td><code>:6-handoff</code></td>
589
+ <td>OPUS/ULTRATHINK</td>
590
+ <td>
591
+ <span data-lang="fr">Brief d'implementation (anglais)</span>
592
+ <span data-lang="en">Implementation brief (English)</span>
593
+ </td>
594
+ <td><code>05-implementation-brief.md</code></td>
595
+ </tr>
596
+ <tr style="background: rgba(217, 70, 239, 0.1);">
597
+ <td><strong>7</strong></td>
598
+ <td><strong>DOC-HTML</strong></td>
599
+ <td><code>:7-doc-html</code></td>
600
+ <td>Sonnet</td>
601
+ <td>
602
+ <span data-lang="fr">Documentation HTML auto-generee</span>
603
+ <span data-lang="en">Auto-generated HTML documentation</span>
604
+ </td>
605
+ <td><code>06-documentation.html</code></td>
606
+ </tr>
607
+ </tbody>
608
+ </table>
609
+ </div>
610
+ </section>
611
+
612
+ <!-- Phase 0: Orchestrate -->
613
+ <section id="phase-0">
614
+ <h2>Phase 0: ORCHESTRATE</h2>
615
+ <div class="command-card">
616
+ <div class="command-header">
617
+ <code class="command-name">/business-analyse:0-orchestrate</code>
618
+ <span class="badge badge-purple">OPUS/ULTRATHINK</span>
619
+ </div>
620
+ <div class="command-body">
621
+ <p data-lang="fr">
622
+ <strong>Mission</strong> : Orchestrer automatiquement l'execution de toutes les phases successives du workflow Business Analyse, de la decouverte a la documentation.
623
+ </p>
624
+ <p data-lang="en">
625
+ <strong>Mission</strong>: Automatically orchestrate execution of all successive phases from discovery to documentation.
626
+ </p>
627
+
628
+ <div class="code-block">
629
+ <button class="copy-btn">Copy</button>
630
+ <pre><code># Full orchestration
631
+ /business-analyse:0-orchestrate [feature-name]
632
+
633
+ # With granularity level
634
+ /business-analyse:0-orchestrate [feature-name] --granularity=muscles
635
+ /business-analyse:0-orchestrate [feature-name] --granularity=section
636
+ /business-analyse:0-orchestrate [feature-name] --granularity=resources</code></pre>
637
+ </div>
638
+
639
+ <h4 data-lang="fr">Orchestration automatique</h4>
640
+ <h4 data-lang="en">Automatic Orchestration</h4>
641
+ <ul>
642
+ <li data-lang="fr">Lance Phase 1 (INIT) pour preparer la structure</li>
643
+ <li data-lang="en">Launches Phase 1 (INIT) to prepare structure</li>
644
+ <li data-lang="fr">Lance Phase 2 (DISCOVER) avec elicitation et similarite</li>
645
+ <li data-lang="en">Launches Phase 2 (DISCOVER) with elicitation and similarity</li>
646
+ <li data-lang="fr">Lance Phase 3 (ANALYSE) pour analyser le besoin</li>
647
+ <li data-lang="en">Launches Phase 3 (ANALYSE) to analyze need</li>
648
+ <li data-lang="fr">Lance Phase 4 (SPECIFY) pour generer le FRD</li>
649
+ <li data-lang="en">Launches Phase 4 (SPECIFY) to generate FRD</li>
650
+ <li data-lang="fr">Lance Phase 5 (VALIDATE) pour validation utilisateur</li>
651
+ <li data-lang="en">Launches Phase 5 (VALIDATE) for user validation</li>
652
+ <li data-lang="fr">Lance Phase 6 (HANDOFF) pour le brief d'implementation</li>
653
+ <li data-lang="en">Launches Phase 6 (HANDOFF) for implementation brief</li>
654
+ <li data-lang="fr">Lance Phase 7 (DOC-HTML) pour generer la documentation</li>
655
+ <li data-lang="en">Launches Phase 7 (DOC-HTML) to generate documentation</li>
656
+ </ul>
657
+
658
+ <div class="alert alert-info">
659
+ <span class="alert-icon">&#128161;</span>
660
+ <div class="alert-content">
661
+ <p data-lang="fr">
662
+ Phase 0 facilite l'orchestration complete du workflow. Pour un controle granulaire, utilisez les phases individuelles (1-7).
663
+ </p>
664
+ <p data-lang="en">
665
+ Phase 0 facilitates complete workflow orchestration. For granular control, use individual phases (1-7).
666
+ </p>
667
+ </div>
668
+ </div>
669
+ </div>
670
+ </div>
671
+ </section>
672
+
673
+ <!-- Phase 1: Init -->
674
+ <section id="phase-1">
675
+ <h2>Phase 1: INIT</h2>
676
+ <div class="command-card">
677
+ <div class="command-header">
678
+ <code class="command-name">/business-analyse:1-init</code>
679
+ <span class="badge badge-blue">Haiku</span>
680
+ </div>
681
+ <div class="command-body">
682
+ <p data-lang="fr">
683
+ <strong>Mission</strong> : Initialiser la structure du dossier Business Analyse avec les fichiers de base et la configuration.
684
+ </p>
685
+ <p data-lang="en">
686
+ <strong>Mission</strong>: Initialize Business Analyse folder structure with base files and configuration.
687
+ </p>
688
+
689
+ <div class="code-block">
690
+ <button class="copy-btn">Copy</button>
691
+ <pre><code>/business-analyse:1-init [feature-name]</code></pre>
692
+ </div>
693
+
694
+ <h4 data-lang="fr">Structure creee</h4>
695
+ <h4 data-lang="en">Created Structure</h4>
696
+ <ul>
697
+ <li data-lang="fr">Dossier <code>.claude/ba/[feature-name]/</code></li>
698
+ <li data-lang="en">Folder <code>.claude/ba/[feature-name]/</code></li>
699
+ <li data-lang="fr">Fichiers de template pour chaque phase</li>
700
+ <li data-lang="en">Template files for each phase</li>
701
+ <li data-lang="fr">Configuration et metadata</li>
702
+ <li data-lang="en">Configuration and metadata</li>
703
+ </ul>
704
+ </div>
705
+ </div>
706
+ </section>
707
+
708
+ <!-- Phase 2: Discover -->
709
+ <section id="phase-2">
710
+ <h2>Phase 2: DISCOVER</h2>
711
+ <div class="command-card">
712
+ <div class="command-header">
713
+ <code class="command-name">/business-analyse:2-discover</code>
714
+ <span class="badge badge-blue">OPUS/ULTRATHINK</span>
715
+ </div>
716
+ <div class="command-body">
717
+ <p data-lang="fr">
718
+ <strong>Mission</strong> : Comprendre le vrai besoin utilisateur avant toute exploration technique.
719
+ </p>
720
+ <p data-lang="en">
721
+ <strong>Mission</strong>: Understand the real user need before any technical exploration.
722
+ </p>
723
+
724
+ <h4 data-lang="fr">Etapes</h4>
725
+ <h4 data-lang="en">Steps</h4>
726
+ <ol>
727
+ <li data-lang="fr"><strong>Similarity Check</strong> : Lance l'agent <code>ba-similarity</code> pour detecter les doublons</li>
728
+ <li data-lang="en"><strong>Similarity Check</strong>: Launches <code>ba-similarity</code> agent to detect duplicates</li>
729
+ <li data-lang="fr"><strong>Elicitation</strong> : Pose des questions ciblees (max 5)</li>
730
+ <li data-lang="en"><strong>Elicitation</strong>: Asks targeted questions (max 5)</li>
731
+ <li data-lang="fr"><strong>Business Requirements</strong> : Formalise le besoin en langage utilisateur</li>
732
+ <li data-lang="en"><strong>Business Requirements</strong>: Formalizes need in user language</li>
733
+ </ol>
734
+
735
+ <div class="code-block">
736
+ <button class="copy-btn">Copy</button>
737
+ <pre><code>/business-analyse:2-discover Je veux pouvoir exporter mes donnees clients</code></pre>
738
+ </div>
739
+
740
+ <h4>
741
+ <span data-lang="fr">Resultats de similarite</span>
742
+ <span data-lang="en">Similarity Results</span>
743
+ </h4>
744
+ <table class="reference-table">
745
+ <thead>
746
+ <tr>
747
+ <th>
748
+ <span data-lang="fr">Resultat</span>
749
+ <span data-lang="en">Result</span>
750
+ </th>
751
+ <th>Action</th>
752
+ </tr>
753
+ </thead>
754
+ <tbody>
755
+ <tr>
756
+ <td><strong>DUPLICATE</strong></td>
757
+ <td>
758
+ <span data-lang="fr">STOP - Reference spec existante</span>
759
+ <span data-lang="en">STOP - Reference existing spec</span>
760
+ </td>
761
+ </tr>
762
+ <tr>
763
+ <td><strong>EXTEND</strong></td>
764
+ <td>
765
+ <span data-lang="fr">Note feature existante a etendre</span>
766
+ <span data-lang="en">Note existing feature to extend</span>
767
+ </td>
768
+ </tr>
769
+ <tr>
770
+ <td><strong>NEW</strong></td>
771
+ <td>
772
+ <span data-lang="fr">Proceder normalement</span>
773
+ <span data-lang="en">Proceed normally</span>
774
+ </td>
775
+ </tr>
776
+ </tbody>
777
+ </table>
778
+ </div>
779
+ </div>
780
+ </section>
781
+
782
+ <!-- Phase 3: Analyse -->
783
+ <section id="phase-3">
784
+ <h2>Phase 3: ANALYSE</h2>
785
+ <div class="command-card">
786
+ <div class="command-header">
787
+ <code class="command-name">/business-analyse:3-analyse</code>
788
+ <span class="badge badge-blue">Sonnet/ULTRATHINK</span>
789
+ </div>
790
+ <div class="command-body">
791
+ <p data-lang="fr">
792
+ <strong>Mission</strong> : Fusionner le besoin utilisateur avec le contexte technique. Identifier les gaps et conflits.
793
+ </p>
794
+ <p data-lang="en">
795
+ <strong>Mission</strong>: Merge user need with technical context. Identify gaps and conflicts.
796
+ </p>
797
+
798
+ <div class="code-block">
799
+ <button class="copy-btn">Copy</button>
800
+ <pre><code>/business-analyse:3-analyse [feature-name]</code></pre>
801
+ </div>
802
+
803
+ <h4 data-lang="fr">Analyse des gaps</h4>
804
+ <h4 data-lang="en">Gap Analysis</h4>
805
+ <ul>
806
+ <li data-lang="fr"><strong>Feasibility Check</strong> : Ce que l'utilisateur veut vs ce que le systeme peut faire</li>
807
+ <li data-lang="en"><strong>Feasibility Check</strong>: What user wants vs what system can do</li>
808
+ <li data-lang="fr"><strong>Conflicts</strong> : Contradictions entre besoin et contraintes techniques</li>
809
+ <li data-lang="en"><strong>Conflicts</strong>: Contradictions between need and technical constraints</li>
810
+ <li data-lang="fr"><strong>Opportunities</strong> : Features existantes qui peuvent aider</li>
811
+ <li data-lang="en"><strong>Opportunities</strong>: Existing features that can help</li>
812
+ </ul>
813
+
814
+ <div class="alert alert-warning">
815
+ <span class="alert-icon">&#9888;</span>
816
+ <div class="alert-content">
817
+ <p data-lang="fr">
818
+ Si des gaps ou conflits existent, des <strong>questions ciblees</strong> sont posees a l'utilisateur avant de continuer.
819
+ </p>
820
+ <p data-lang="en">
821
+ If gaps or conflicts exist, <strong>targeted questions</strong> are asked to the user before continuing.
822
+ </p>
823
+ </div>
824
+ </div>
825
+ </div>
826
+ </div>
827
+ </section>
828
+
829
+ <!-- Phase 4: Specify -->
830
+ <section id="phase-4">
831
+ <h2>Phase 4: SPECIFY</h2>
832
+ <div class="command-card">
833
+ <div class="command-header">
834
+ <code class="command-name">/business-analyse:4-specify</code>
835
+ <span class="badge badge-teal">Sonnet/ULTRATHINK</span>
836
+ </div>
837
+ <div class="command-body">
838
+ <p data-lang="fr">
839
+ <strong>Mission</strong> : Produire le FRD (Functional Requirements Document) detaille pour validation humaine.
840
+ </p>
841
+ <p data-lang="en">
842
+ <strong>Mission</strong>: Produce detailed FRD (Functional Requirements Document) for human validation.
843
+ </p>
844
+
845
+ <div class="code-block">
846
+ <button class="copy-btn">Copy</button>
847
+ <pre><code># Generate specification
848
+ /business-analyse:4-specify [feature-name]
849
+
850
+ # With HTML mockup
851
+ /business-analyse:4-specify [feature-name] --mockup
852
+
853
+ # With PlantUML diagrams
854
+ /business-analyse:4-specify [feature-name] --plantuml</code></pre>
855
+ </div>
856
+
857
+ <h4>
858
+ <span data-lang="fr">Sections dynamiques</span>
859
+ <span data-lang="en">Dynamic sections</span>
860
+ </h4>
861
+ <table class="reference-table">
862
+ <thead>
863
+ <tr>
864
+ <th>Section</th>
865
+ <th>
866
+ <span data-lang="fr">Incluse quand</span>
867
+ <span data-lang="en">Included when</span>
868
+ </th>
869
+ </tr>
870
+ </thead>
871
+ <tbody>
872
+ <tr>
873
+ <td>Context</td>
874
+ <td>
875
+ <span data-lang="fr">Toujours</span>
876
+ <span data-lang="en">Always</span>
877
+ </td>
878
+ </tr>
879
+ <tr>
880
+ <td>Functional Requirements</td>
881
+ <td>
882
+ <span data-lang="fr">Toujours</span>
883
+ <span data-lang="en">Always</span>
884
+ </td>
885
+ </tr>
886
+ <tr>
887
+ <td>Data Model</td>
888
+ <td>
889
+ <span data-lang="fr">Changements DB</span>
890
+ <span data-lang="en">DB changes</span>
891
+ </td>
892
+ </tr>
893
+ <tr>
894
+ <td>UI Specification</td>
895
+ <td>
896
+ <span data-lang="fr">Changements UI</span>
897
+ <span data-lang="en">UI changes</span>
898
+ </td>
899
+ </tr>
900
+ <tr>
901
+ <td>Navigation</td>
902
+ <td>
903
+ <span data-lang="fr">Nouvelle page</span>
904
+ <span data-lang="en">New page</span>
905
+ </td>
906
+ </tr>
907
+ <tr>
908
+ <td>Permissions</td>
909
+ <td>
910
+ <span data-lang="fr">Nouvelles permissions</span>
911
+ <span data-lang="en">New permissions</span>
912
+ </td>
913
+ </tr>
914
+ <tr>
915
+ <td>User Flow</td>
916
+ <td>
917
+ <span data-lang="fr">Workflow complexe</span>
918
+ <span data-lang="en">Complex workflow</span>
919
+ </td>
920
+ </tr>
921
+ <tr>
922
+ <td>API Specification</td>
923
+ <td>
924
+ <span data-lang="fr">Changements backend</span>
925
+ <span data-lang="en">Backend changes</span>
926
+ </td>
927
+ </tr>
928
+ <tr>
929
+ <td>Acceptance Criteria</td>
930
+ <td>
931
+ <span data-lang="fr">Toujours</span>
932
+ <span data-lang="en">Always</span>
933
+ </td>
934
+ </tr>
935
+ </tbody>
936
+ </table>
937
+
938
+ <h4>Options</h4>
939
+ <table class="reference-table">
940
+ <thead>
941
+ <tr>
942
+ <th>Option</th>
943
+ <th>
944
+ <span data-lang="fr">Effet</span>
945
+ <span data-lang="en">Effect</span>
946
+ </th>
947
+ <th>Tokens</th>
948
+ </tr>
949
+ </thead>
950
+ <tbody>
951
+ <tr>
952
+ <td><code>--mockup</code></td>
953
+ <td>
954
+ <span data-lang="fr">Maquette HTML avec CSS projet</span>
955
+ <span data-lang="en">HTML mockup with project CSS</span>
956
+ </td>
957
+ <td>+2,000</td>
958
+ </tr>
959
+ <tr>
960
+ <td><code>--plantuml</code></td>
961
+ <td>
962
+ <span data-lang="fr">Diagrammes ER/sequence</span>
963
+ <span data-lang="en">ER/sequence diagrams</span>
964
+ </td>
965
+ <td>+800</td>
966
+ </tr>
967
+ </tbody>
968
+ </table>
969
+ </div>
970
+ </div>
971
+ </section>
972
+
973
+ <!-- Phase 5: Validate -->
974
+ <section id="phase-5">
975
+ <h2>Phase 5: VALIDATE</h2>
976
+ <div class="command-card">
977
+ <div class="command-header">
978
+ <code class="command-name">/business-analyse:5-validate</code>
979
+ <span class="badge badge-teal">Haiku</span>
980
+ </div>
981
+ <div class="command-body">
982
+ <p data-lang="fr">
983
+ <strong>Mission</strong> : Presenter le FRD a l'utilisateur et collecter son feedback.
984
+ </p>
985
+ <p data-lang="en">
986
+ <strong>Mission</strong>: Present FRD to user and collect feedback.
987
+ </p>
988
+
989
+ <div class="code-block">
990
+ <button class="copy-btn">Copy</button>
991
+ <pre><code>/business-analyse:5-validate [feature-name]</code></pre>
992
+ </div>
993
+
994
+ <h4>
995
+ <span data-lang="fr">Options de validation</span>
996
+ <span data-lang="en">Validation Options</span>
997
+ </h4>
998
+ <table class="reference-table">
999
+ <thead>
1000
+ <tr>
1001
+ <th>Option</th>
1002
+ <th>Action</th>
1003
+ </tr>
1004
+ </thead>
1005
+ <tbody>
1006
+ <tr style="background: rgba(34, 197, 94, 0.1);">
1007
+ <td><strong>APPROVED</strong></td>
1008
+ <td>
1009
+ <span data-lang="fr">Passer a Phase 6 (Handoff)</span>
1010
+ <span data-lang="en">Proceed to Phase 6 (Handoff)</span>
1011
+ </td>
1012
+ </tr>
1013
+ <tr style="background: rgba(234, 179, 8, 0.1);">
1014
+ <td><strong>MINOR CHANGES</strong></td>
1015
+ <td>
1016
+ <span data-lang="fr">Modifications directes dans le FRD</span>
1017
+ <span data-lang="en">Direct modifications in FRD</span>
1018
+ </td>
1019
+ </tr>
1020
+ <tr style="background: rgba(239, 68, 68, 0.1);">
1021
+ <td><strong>MAJOR CHANGES</strong></td>
1022
+ <td>
1023
+ <span data-lang="fr">Retour a Phase 3 (Analyse)</span>
1024
+ <span data-lang="en">Return to Phase 3 (Analyse)</span>
1025
+ </td>
1026
+ </tr>
1027
+ <tr style="background: rgba(107, 114, 128, 0.1);">
1028
+ <td><strong>REJECTED</strong></td>
1029
+ <td>
1030
+ <span data-lang="fr">Archiver et recommencer</span>
1031
+ <span data-lang="en">Archive and start over</span>
1032
+ </td>
1033
+ </tr>
1034
+ </tbody>
1035
+ </table>
1036
+
1037
+ <div class="alert alert-info">
1038
+ <span class="alert-icon">&#128260;</span>
1039
+ <div class="alert-content">
1040
+ <h5 data-lang="fr">Boucle de validation</h5>
1041
+ <h5 data-lang="en">Validation Loop</h5>
1042
+ <p data-lang="fr">
1043
+ En cas de <strong>MAJOR CHANGES</strong>, le workflow retourne a la Phase 3 pour re-analyser avec les nouvelles informations.
1044
+ </p>
1045
+ <p data-lang="en">
1046
+ On <strong>MAJOR CHANGES</strong>, the workflow returns to Phase 3 to re-analyze with new information.
1047
+ </p>
1048
+ </div>
1049
+ </div>
1050
+ </div>
1051
+ </div>
1052
+ </section>
1053
+
1054
+ <!-- Phase 6: Handoff -->
1055
+ <section id="phase-6">
1056
+ <h2>Phase 6: HANDOFF</h2>
1057
+ <div class="command-card">
1058
+ <div class="command-header">
1059
+ <code class="command-name">/business-analyse:6-handoff</code>
1060
+ <span class="badge badge-teal">OPUS/ULTRATHINK</span>
1061
+ </div>
1062
+ <div class="command-body">
1063
+ <p data-lang="fr">
1064
+ <strong>Mission</strong> : Transformer le FRD valide en brief d'implementation pour Claude Code. Le brief est genere en <strong>anglais</strong> pour optimiser les tokens et la comprehension du modele.
1065
+ </p>
1066
+ <p data-lang="en">
1067
+ <strong>Mission</strong>: Transform validated FRD into implementation brief for Claude Code. The brief is generated in <strong>English</strong> to optimize tokens and model comprehension.
1068
+ </p>
1069
+
1070
+ <div class="code-block">
1071
+ <button class="copy-btn">Copy</button>
1072
+ <pre><code>/business-analyse:6-handoff [feature-name]</code></pre>
1073
+ </div>
1074
+
1075
+ <h4 data-lang="fr">Format de sortie (diff-like)</h4>
1076
+ <h4 data-lang="en">Output format (diff-like)</h4>
1077
+
1078
+ <div class="code-block">
1079
+ <button class="copy-btn">Copy</button>
1080
+ <pre><code># IMPLEMENTATION BRIEF: [Feature Name]
1081
+
1082
+ ## Files
1083
+
1084
+ ### Backend
1085
+
1086
+ CREATE `src/Domain/Entities/Feature.cs`
1087
+ COPY: `src/Domain/Entities/User.cs`
1088
+ CHANGE: class name, properties per spec
1089
+
1090
+ MODIFY `src/Infrastructure/Data/AppDbContext.cs`
1091
+ AT: line 45
1092
+ ADD: `public DbSet&lt;Feature&gt; Features =&gt; Set&lt;Feature&gt;();`
1093
+
1094
+ ### Frontend
1095
+
1096
+ CREATE `src/app/module/feature/feature.component.ts`
1097
+ RUN FIRST: `ng generate component module/feature`
1098
+ COPY PATTERN: `src/app/existing/existing.component.ts`
1099
+
1100
+ ## Commands
1101
+
1102
+ ```bash
1103
+ dotnet build src/Api
1104
+ dotnet ef migrations add AddFeatureTable
1105
+ npm run build
1106
+ npm run lint
1107
+ ```
1108
+
1109
+ ## Verify
1110
+
1111
+ - [ ] Build passes
1112
+ - [ ] Navigate to /feature works
1113
+ - [ ] CRUD operations work</code></pre>
1114
+ </div>
1115
+
1116
+ <div class="alert alert-success">
1117
+ <span class="alert-icon">&#128640;</span>
1118
+ <div class="alert-content">
1119
+ <h5 data-lang="fr">Pret pour implementation</h5>
1120
+ <h5 data-lang="en">Ready for implementation</h5>
1121
+ <p data-lang="fr">
1122
+ Le brief peut etre passe directement a <code>/implement</code> pour une execution oneshot.
1123
+ </p>
1124
+ <p data-lang="en">
1125
+ The brief can be passed directly to <code>/implement</code> for oneshot execution.
1126
+ </p>
1127
+ <div class="code-block" style="margin-top: 0.5rem;">
1128
+ <pre><code>/implement .claude/ba/[feature]/06-implementation-brief.md</code></pre>
1129
+ </div>
1130
+ </div>
1131
+ </div>
1132
+ </div>
1133
+ </div>
1134
+ </section>
1135
+
1136
+ <!-- Phase 7: Doc-HTML -->
1137
+ <section id="phase-7">
1138
+ <h2>Phase 7: DOC-HTML</h2>
1139
+ <div class="command-card">
1140
+ <div class="command-header">
1141
+ <code class="command-name">/business-analyse:7-doc-html</code>
1142
+ <span class="badge badge-purple">Sonnet</span>
1143
+ </div>
1144
+ <div class="command-body">
1145
+ <p data-lang="fr">
1146
+ <strong>Mission</strong> : Generer une documentation HTML auto-generee et polishe a partir de tous les fichiers du workflow Business Analyse.
1147
+ </p>
1148
+ <p data-lang="en">
1149
+ <strong>Mission</strong>: Generate polished auto-generated HTML documentation from all Business Analyse workflow files.
1150
+ </p>
1151
+
1152
+ <div class="code-block">
1153
+ <button class="copy-btn">Copy</button>
1154
+ <pre><code># Generate documentation
1155
+ /business-analyse:7-doc-html [feature-name]
1156
+
1157
+ # With specific template
1158
+ /business-analyse:7-doc-html [feature-name] --template=standard
1159
+ /business-analyse:7-doc-html [feature-name] --template=detailed
1160
+ /business-analyse:7-doc-html [feature-name] --template=minimal</code></pre>
1161
+ </div>
1162
+
1163
+ <h4 data-lang="fr">Documentation generee</h4>
1164
+ <h4 data-lang="en">Generated Documentation</h4>
1165
+ <ul>
1166
+ <li data-lang="fr">Resume executif de la feature</li>
1167
+ <li data-lang="en">Feature executive summary</li>
1168
+ <li data-lang="fr">Specifications fonctionnelles validees</li>
1169
+ <li data-lang="en">Validated functional specifications</li>
1170
+ <li data-lang="fr">Architecture et design decisions</li>
1171
+ <li data-lang="en">Architecture and design decisions</li>
1172
+ <li data-lang="fr">Guide d'implementation</li>
1173
+ <li data-lang="en">Implementation guide</li>
1174
+ <li data-lang="fr">Historique complet du workflow</li>
1175
+ <li data-lang="en">Complete workflow history</li>
1176
+ </ul>
1177
+
1178
+ <div class="alert alert-success">
1179
+ <span class="alert-icon">&#128196;</span>
1180
+ <div class="alert-content">
1181
+ <h5 data-lang="fr">Documentation persistante</h5>
1182
+ <h5 data-lang="en">Persistent Documentation</h5>
1183
+ <p data-lang="fr">
1184
+ Le fichier HTML est stocke dans <code>.claude/ba/[feature]/06-documentation.html</code> pour reference et partage futur.
1185
+ </p>
1186
+ <p data-lang="en">
1187
+ The HTML file is stored in <code>.claude/ba/[feature]/06-documentation.html</code> for future reference and sharing.
1188
+ </p>
1189
+ </div>
1190
+ </div>
1191
+ </div>
1192
+ </div>
1193
+ </section>
1194
+
1195
+ <!-- Utilities -->
1196
+ <section id="utilities">
1197
+ <h2>
1198
+ <span data-lang="fr">Commandes Utilitaires</span>
1199
+ <span data-lang="en">Utility Commands</span>
1200
+ </h2>
1201
+
1202
+ <div class="command-card">
1203
+ <div class="command-header">
1204
+ <code class="command-name">/business-analyse:bug</code>
1205
+ <span class="badge badge-red">Bug Fix</span>
1206
+ </div>
1207
+ <div class="command-body">
1208
+ <p data-lang="fr">
1209
+ Documenter et specifier une correction de bug de maniere formelle.
1210
+ </p>
1211
+ <p data-lang="en">
1212
+ Document and formally specify a bug fix.
1213
+ </p>
1214
+ <div class="code-block">
1215
+ <button class="copy-btn">Copy</button>
1216
+ <pre><code>/business-analyse:bug [bug-description]</code></pre>
1217
+ </div>
1218
+ </div>
1219
+ </div>
1220
+
1221
+ <div class="command-card">
1222
+ <div class="command-header">
1223
+ <code class="command-name">/business-analyse:hotfix</code>
1224
+ <span class="badge badge-red">Hotfix</span>
1225
+ </div>
1226
+ <div class="command-body">
1227
+ <p data-lang="fr">
1228
+ Documenter une correction urgente de maniere legere et rapide.
1229
+ </p>
1230
+ <p data-lang="en">
1231
+ Document an urgent fix in a lightweight and fast way.
1232
+ </p>
1233
+ <div class="code-block">
1234
+ <button class="copy-btn">Copy</button>
1235
+ <pre><code>/business-analyse:hotfix [fix-description]</code></pre>
1236
+ </div>
1237
+ </div>
1238
+ </div>
1239
+
1240
+ <div class="command-card">
1241
+ <div class="command-header">
1242
+ <code class="command-name">/business-analyse:change-request</code>
1243
+ <span class="badge badge-blue">Change</span>
1244
+ </div>
1245
+ <div class="command-body">
1246
+ <p data-lang="fr">
1247
+ Documenter une demande de changement formal pendant le developpement.
1248
+ </p>
1249
+ <p data-lang="en">
1250
+ Document a formal change request during development.
1251
+ </p>
1252
+ <div class="code-block">
1253
+ <button class="copy-btn">Copy</button>
1254
+ <pre><code>/business-analyse:change-request [change-description]</code></pre>
1255
+ </div>
1256
+ </div>
1257
+ </div>
1258
+ </section>
1259
+
1260
+ <!-- Agents -->
1261
+ <section id="agents">
1262
+ <h2>
1263
+ <span data-lang="fr">Agents specialises</span>
1264
+ <span data-lang="en">Specialized Agents</span>
1265
+ </h2>
1266
+
1267
+ <table class="reference-table">
1268
+ <thead>
1269
+ <tr>
1270
+ <th>Agent</th>
1271
+ <th>Mission</th>
1272
+ <th>
1273
+ <span data-lang="fr">Utilise en</span>
1274
+ <span data-lang="en">Used in</span>
1275
+ </th>
1276
+ </tr>
1277
+ </thead>
1278
+ <tbody>
1279
+ <tr style="background: rgba(139, 92, 246, 0.1);">
1280
+ <td><code>ba-similarity</code></td>
1281
+ <td>
1282
+ <span data-lang="fr">Detecte les features similaires ou doublons</span>
1283
+ <span data-lang="en">Detects similar features or duplicates</span>
1284
+ </td>
1285
+ <td>Phase 2</td>
1286
+ </tr>
1287
+ <tr>
1288
+ <td><code>explore-api</code></td>
1289
+ <td>
1290
+ <span data-lang="fr">Endpoints, controllers, DTOs, patterns API</span>
1291
+ <span data-lang="en">Endpoints, controllers, DTOs, API patterns</span>
1292
+ </td>
1293
+ <td>Phase 3</td>
1294
+ </tr>
1295
+ <tr>
1296
+ <td><code>explore-schema</code></td>
1297
+ <td>
1298
+ <span data-lang="fr">Schema DB, entites, configurations</span>
1299
+ <span data-lang="en">DB schema, entities, configurations</span>
1300
+ </td>
1301
+ <td>Phase 3</td>
1302
+ </tr>
1303
+ <tr>
1304
+ <td><code>explore-permissions</code></td>
1305
+ <td>
1306
+ <span data-lang="fr">RBAC, roles, autorisations</span>
1307
+ <span data-lang="en">RBAC, roles, authorizations</span>
1308
+ </td>
1309
+ <td>Phase 3</td>
1310
+ </tr>
1311
+ <tr>
1312
+ <td><code>explore-navigation</code></td>
1313
+ <td>
1314
+ <span data-lang="fr">Menus, routes, pages</span>
1315
+ <span data-lang="en">Menus, routes, pages</span>
1316
+ </td>
1317
+ <td>Phase 3</td>
1318
+ </tr>
1319
+ <tr>
1320
+ <td><code>explore-theme</code></td>
1321
+ <td>
1322
+ <span data-lang="fr">UI patterns, composants, design system</span>
1323
+ <span data-lang="en">UI patterns, components, design system</span>
1324
+ </td>
1325
+ <td>Phase 3</td>
1326
+ </tr>
1327
+ </tbody>
1328
+ </table>
1329
+ </section>
1330
+
1331
+ <!-- Files -->
1332
+ <section id="files">
1333
+ <h2>
1334
+ <span data-lang="fr">Structure des fichiers</span>
1335
+ <span data-lang="en">File Structure</span>
1336
+ </h2>
1337
+
1338
+ <div class="code-block">
1339
+ <button class="copy-btn">Copy</button>
1340
+ <pre><code>.claude/ba/
1341
+ └── [feature-name]/
1342
+ ├── 01-business-requirements.md # Phase 2: DISCOVER
1343
+ ├── 02-enriched-requirements.md # Phase 3: ANALYSE
1344
+ ├── 03-functional-spec.md # Phase 4: SPECIFY
1345
+ ├── 04-feedback-v1.md # Phase 5: VALIDATE (si changes)
1346
+ ├── 04-feedback-v2.md # (iterations)
1347
+ ├── 05-implementation-brief.md # Phase 6: HANDOFF
1348
+ └── 06-documentation.html # Phase 7: DOC-HTML</code></pre>
1349
+ </div>
1350
+
1351
+ <div class="table-container">
1352
+ <table>
1353
+ <thead>
1354
+ <tr>
1355
+ <th>
1356
+ <span data-lang="fr">Fichier</span>
1357
+ <span data-lang="en">File</span>
1358
+ </th>
1359
+ <th>
1360
+ <span data-lang="fr">Genere par</span>
1361
+ <span data-lang="en">Generated by</span>
1362
+ </th>
1363
+ <th>
1364
+ <span data-lang="fr">Lu par</span>
1365
+ <span data-lang="en">Read by</span>
1366
+ </th>
1367
+ </tr>
1368
+ </thead>
1369
+ <tbody>
1370
+ <tr>
1371
+ <td><code>01-business-requirements.md</code></td>
1372
+ <td>Phase 2</td>
1373
+ <td>Phase 3, 4</td>
1374
+ </tr>
1375
+ <tr>
1376
+ <td><code>02-enriched-requirements.md</code></td>
1377
+ <td>Phase 3</td>
1378
+ <td>Phase 4</td>
1379
+ </tr>
1380
+ <tr>
1381
+ <td><code>03-functional-spec.md</code></td>
1382
+ <td>Phase 4</td>
1383
+ <td>
1384
+ <span data-lang="fr">Humain (validation), Phase 6</span>
1385
+ <span data-lang="en">Human (validation), Phase 6</span>
1386
+ </td>
1387
+ </tr>
1388
+ <tr>
1389
+ <td><code>04-feedback-v[N].md</code></td>
1390
+ <td>Phase 5</td>
1391
+ <td>Phase 4 (iterations)</td>
1392
+ </tr>
1393
+ <tr>
1394
+ <td><code>05-implementation-brief.md</code></td>
1395
+ <td>Phase 6</td>
1396
+ <td><code>/implement</code></td>
1397
+ </tr>
1398
+ <tr>
1399
+ <td><code>06-documentation.html</code></td>
1400
+ <td>Phase 7</td>
1401
+ <td>
1402
+ <span data-lang="fr">Reference et partage</span>
1403
+ <span data-lang="en">Reference &amp; sharing</span>
1404
+ </td>
1405
+ </tr>
1406
+ </tbody>
1407
+ </table>
1408
+ </div>
1409
+ </section>
1410
+
1411
+ <!-- Complete Example -->
1412
+ <section id="example">
1413
+ <h2>
1414
+ <span data-lang="fr">Exemple complet</span>
1415
+ <span data-lang="en">Complete Example</span>
1416
+ </h2>
1417
+
1418
+ <div class="code-block">
1419
+ <button class="copy-btn">Copy</button>
1420
+ <pre><code># Option 1: Mode automatique complet
1421
+ /business-analyse Je veux gerer les utilisateurs avec des roles
1422
+
1423
+ # → Phase 0 orchestre tout automatiquement
1424
+ # → Phases 1-7 s'executent en sequence
1425
+ # → Cree tous les fichiers et la documentation
1426
+
1427
+ ---
1428
+
1429
+ # Option 2: Phases individuelles pour plus de controle
1430
+
1431
+ # Phase 1: Initialiser la structure
1432
+ /business-analyse:1-init user-management
1433
+
1434
+ # Phase 2: Decouvrir le besoin
1435
+ /business-analyse:2-discover Je veux gerer les utilisateurs avec des roles
1436
+
1437
+ # → Questions d'elicitation posees
1438
+ # → Agent ba-similarity verifie les doublons
1439
+ # → Cree: .claude/ba/user-management/01-business-requirements.md
1440
+
1441
+ # Phase 3: Analyser et enrichir
1442
+ /business-analyse:3-analyse user-management
1443
+
1444
+ # → Fusionne besoin + contexte technique
1445
+ # → Identifie gaps et conflits
1446
+ # → Cree: .claude/ba/user-management/02-enriched-requirements.md
1447
+
1448
+ # Phase 4: Specifier (FRD)
1449
+ /business-analyse:4-specify user-management --plantuml
1450
+
1451
+ # → Genere le FRD complet avec diagrammes
1452
+ # → Cree: .claude/ba/user-management/03-functional-spec.md
1453
+
1454
+ # Phase 5: Valider avec l'utilisateur
1455
+ /business-analyse:5-validate user-management
1456
+
1457
+ # → Presente resume pour validation
1458
+ # → Si APPROVED → Phase 6
1459
+ # → Si MAJOR CHANGES → Retour Phase 3
1460
+
1461
+ # Phase 6: Generer le brief d'implementation
1462
+ /business-analyse:6-handoff user-management
1463
+
1464
+ # → Transforme FRD en brief diff-like (anglais)
1465
+ # → Cree: .claude/ba/user-management/04-implementation-brief.md
1466
+
1467
+ # Phase 7: Generer la documentation
1468
+ /business-analyse:7-doc-html user-management
1469
+
1470
+ # → Genere documentation HTML polishe
1471
+ # → Cree: .claude/ba/user-management/05-documentation.html
1472
+
1473
+ # Implementation
1474
+ /implement .claude/ba/user-management/04-implementation-brief.md
1475
+
1476
+ # → Claude Code execute le brief en oneshot</code></pre>
1477
+ </div>
1478
+
1479
+ <div class="alert alert-info">
1480
+ <span class="alert-icon">&#127919;</span>
1481
+ <div class="alert-content">
1482
+ <h5 data-lang="fr">Conseil</h5>
1483
+ <h5 data-lang="en">Pro Tip</h5>
1484
+ <p data-lang="fr">
1485
+ Les fichiers dans <code>.claude/ba/</code> constituent un historique precieux. Conservez-les pour documenter les evolutions futures et faciliter la maintenance.
1486
+ </p>
1487
+ <p data-lang="en">
1488
+ Files in <code>.claude/ba/</code> are valuable history. Keep them to document future evolutions and facilitate maintenance.
1489
+ </p>
1490
+ </div>
1491
+ </div>
1492
+ </section>
1493
+
1494
+ </div>
1495
+ </main>
1496
+ </div>
1497
+ </div>
1498
+
1499
+ <script src="js/app.js"></script>
1500
+ </body>
1501
+ </html>