@codename_inc/spectre 4.0.0 β 5.0.0
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.
- package/README.md +3 -3
- package/package.json +1 -1
- package/plugins/spectre/.claude-plugin/plugin.json +1 -1
- package/plugins/spectre/skills/guide/SKILL.md +4 -4
- package/plugins/spectre/skills/prototype/SKILL.md +314 -0
- package/plugins/spectre/skills/scope/SKILL.md +98 -52
- package/plugins/spectre/skills/ux/SKILL.md +121 -0
- package/plugins/spectre-codex/skills/guide/SKILL.md +4 -4
- package/plugins/spectre-codex/skills/prototype/SKILL.md +314 -0
- package/plugins/spectre-codex/skills/scope/SKILL.md +98 -52
- package/plugins/spectre-codex/skills/ux/SKILL.md +121 -0
- package/plugins/spectre/skills/ux_spec/SKILL.md +0 -100
- package/plugins/spectre-codex/skills/ux_spec/SKILL.md +0 -100
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: "scope"
|
|
3
|
-
description: "π» | Interactively scope a feature or improvement, generating a complete Scope document
|
|
3
|
+
description: "π» | Interactively scope a feature or improvement, generating a complete Scope document with IN, OUT, and ANTI-SCOPE boundaries -- primary agent"
|
|
4
4
|
user-invocable: true
|
|
5
5
|
---
|
|
6
6
|
|
|
@@ -12,104 +12,144 @@ Treat the current command arguments as this workflow's input. When invoked from
|
|
|
12
12
|
|
|
13
13
|
# scope: Interactive Feature Scoping
|
|
14
14
|
|
|
15
|
-
Collaborative workflow for structuring unstructured thoughts into clear scope boundaries through
|
|
15
|
+
Collaborative workflow for structuring unstructured thoughts into clear scope boundaries through a grounded hypothesis and targeted clarifications. Focuses on user value and scope boundaries before technical considerations. Output: scope document with clear boundaries (IN / OUT / ANTI-SCOPE), user value, load-bearing assumptions, and key decisions saved to `{OUT_DIR}/concepts/scope.md`.
|
|
16
16
|
|
|
17
17
|
## ARGUMENTS
|
|
18
18
|
|
|
19
|
-
|
|
19
|
+
<ARGUMENTS> $ARGUMENTS </ARGUMENTS>
|
|
20
20
|
|
|
21
|
-
## Step 1: Immediate Reply &
|
|
21
|
+
## Step 1: Immediate Reply & Context Pickup
|
|
22
22
|
|
|
23
23
|
- **Action** β ImmediateReply: Respond before any tools.
|
|
24
|
-
- **If** `FROM_KICKOFF=true` β acknowledge kickoff context, read `KICKOFF_DOC`, extract (Core Problem, User Value, Decisions Made, Remaining Ambiguities, Key Code Refs), **SKIP to Step
|
|
25
|
-
- **Else If** ARGUMENTS empty β probe for context enthusiastically
|
|
26
|
-
- **Else** β proceed
|
|
27
|
-
- **CRITICAL**: No tool calls except reading kickoff doc when FROM_KICKOFF=true
|
|
24
|
+
- **If** `FROM_KICKOFF=true` β acknowledge kickoff context, read `KICKOFF_DOC`, extract (Core Problem, User Value, Decisions Made, Remaining Ambiguities, Key Code Refs), **SKIP to Step 4**
|
|
25
|
+
- **Else If** ARGUMENTS empty β probe for context enthusiastically and **WAIT** for user
|
|
26
|
+
- **Else** β proceed with the steps below
|
|
27
|
+
- **CRITICAL**: No tool calls in this step except reading the kickoff doc when `FROM_KICKOFF=true`.
|
|
28
28
|
|
|
29
|
-
|
|
29
|
+
- **Action** β DetectExistingArtifacts: Before proposing a hypothesis, check for prior context that may already answer questions.
|
|
30
|
+
- `branch_name=$(git rev-parse --abbrev-ref HEAD 2>/dev/null || echo unknown)`
|
|
31
|
+
- Look for: `docs/tasks/{branch_name}/concepts/scope.md`, `docs/tasks/{branch_name}/task_context.md`
|
|
32
|
+
- **If** prior `scope.md` exists β read fully; treat this invocation as a re-scope. Surface what was already settled and ask only about what's new or changed.
|
|
33
|
+
- **If** captured project knowledge is available (via `apply`-style memory or session logs) β surface decisions/patterns/gotchas relevant to this area before asking the user.
|
|
34
|
+
|
|
35
|
+
## Step 2: Ground the Hypothesis (Fast)
|
|
36
|
+
|
|
37
|
+
**SKIP IF FROM_KICKOFF=true** β kickoff already grounded.
|
|
38
|
+
|
|
39
|
+
- **Action** β FastGround: Run ONE fast lookup to ground the hypothesis in repo reality. Pick the most informative single call:
|
|
40
|
+
- **`@finder` for one targeted query** β when you need to know what files/components exist for this area
|
|
41
|
+
- **One `grep` or `glob`** β when you need to verify a specific assumption ("does X already exist?")
|
|
42
|
+
|
|
43
|
+
**Constraints**:
|
|
44
|
+
- **One call only.** This is grounding, not research. Tech research is `plan`'s job.
|
|
45
|
+
- **Fast.** If the call would take more than a few seconds, skip it and ask the user instead.
|
|
46
|
+
- If you need more than one signal, that's a sign this should be a `kickoff` rather than a `scope`.
|
|
47
|
+
|
|
48
|
+
## Step 3: Interactive Scope Exploration
|
|
30
49
|
|
|
31
50
|
**SKIP IF FROM_KICKOFF=true**
|
|
32
51
|
|
|
33
|
-
- **Action** β ExploreScope: Collaborative dialogue focused on boundaries
|
|
52
|
+
- **Action** β ExploreScope: Collaborative dialogue focused on boundaries, user experience, and anti-scope.
|
|
34
53
|
|
|
35
|
-
**CRITICAL**: Focus on WHAT, not HOW. Defer all technical/implementation questions
|
|
54
|
+
**CRITICAL**: Focus on WHAT, not HOW. Defer all technical/implementation questions to `plan`. Only ask technical questions if the scope itself is inherently technical (e.g., "migrate database from X to Y").
|
|
36
55
|
|
|
37
|
-
**PATTERN**: Lead with a
|
|
56
|
+
**PATTERN**: Lead with a grounded hypothesis (informed by Step 2's lookup) AND ask 5β8 questions across multiple dimensions. Mark each question as **(blocking)** or *(optional)* so the user can skim and skip.
|
|
38
57
|
|
|
39
58
|
**FIRST RESPONSE FORMAT**:
|
|
40
59
|
|
|
41
|
-
> Here's my
|
|
60
|
+
> Here's my read on this, grounded in {one-line of what Step 2 surfaced}:
|
|
42
61
|
>
|
|
43
|
-
> **
|
|
62
|
+
> **Hypothesis**: [problem statement, who it affects, proposed IN / OUT / ANTI-SCOPE]
|
|
44
63
|
>
|
|
45
|
-
> **Questions
|
|
46
|
-
> 1. [User problem question]
|
|
47
|
-
> 2. [
|
|
48
|
-
> 3. [
|
|
49
|
-
> 4. [
|
|
50
|
-
> 5. [
|
|
51
|
-
> 6. [Edge case question]
|
|
52
|
-
>
|
|
64
|
+
> **Questions**:
|
|
65
|
+
> 1. **(blocking)** [User problem question]
|
|
66
|
+
> 2. **(blocking)** [Boundary edge question]
|
|
67
|
+
> 3. **(blocking)** [Anti-scope question]
|
|
68
|
+
> 4. *(optional)* [UX flow question]
|
|
69
|
+
> 5. *(optional)* [Alternative approach question]
|
|
70
|
+
> 6. *(optional)* [Edge case question]
|
|
71
|
+
> 7. *(optional)* [Success criteria question]
|
|
53
72
|
>
|
|
54
|
-
> Answer
|
|
73
|
+
> Answer the blocking ones; skip optional if obvious.
|
|
55
74
|
|
|
56
|
-
**Question types
|
|
75
|
+
**Question types** (mix from these; lean on blocking for boundaries and anti-scope):
|
|
57
76
|
|
|
58
77
|
- **User & Problem**: Who feels this most? What triggers the need? What's the cost of not solving it?
|
|
59
78
|
- **UX & Feel**: Should this feel fast or thorough? Guided or flexible? What's the ideal flow?
|
|
60
|
-
- **Boundaries**: What about [adjacent thing]βIN or OUT?
|
|
79
|
+
- **Boundaries (IN/OUT)**: What about [adjacent thing]βIN or OUT? What's essential for v1?
|
|
80
|
+
- **Anti-Scope**: What problem are we *intentionally not solving* here? (Different from OUT β anti-scope clarifies the philosophical edge of the feature, not just deferred work.)
|
|
61
81
|
- **Alternatives**: I could see this as [A] or [B]. Which direction?
|
|
62
|
-
- **Edge cases**: What happens when [unusual situation]?
|
|
63
|
-
- **Success**: What makes you say "this shipped well"?
|
|
82
|
+
- **Edge cases**: What happens when [unusual situation]?
|
|
83
|
+
- **Success**: What makes you say "this shipped well"?
|
|
64
84
|
|
|
65
|
-
**DO NOT ask about**: implementation approach, technical trade-offs, architecture, or integration details
|
|
85
|
+
**DO NOT ask about**: implementation approach, technical trade-offs, architecture, or integration details β those belong in `plan`.
|
|
66
86
|
|
|
67
87
|
- **Action** β IterateBoundaries: After user responds, refine boundaries and ask targeted follow-ups on gaps.
|
|
68
88
|
|
|
69
|
-
> **Current
|
|
89
|
+
> **Current Scope**:
|
|
90
|
+
> β
**IN**: [list]
|
|
91
|
+
> β **OUT**: [list]
|
|
92
|
+
> π« **ANTI-SCOPE**: [problems we're intentionally not solving]
|
|
93
|
+
> β οΈ **Unsure**: [edge cases]
|
|
70
94
|
>
|
|
71
95
|
> Any items to move? Add exclusions? Clarify edges? Reply 'looks good' to continue.
|
|
72
96
|
|
|
73
|
-
- **Wait** β User confirms
|
|
97
|
+
- **Wait** β User confirms scope boundaries are accurate.
|
|
74
98
|
|
|
75
|
-
## Step
|
|
99
|
+
## Step 4: Targeted Clarifications
|
|
76
100
|
|
|
77
101
|
- **Action** β DetermineOutputDir:
|
|
78
|
-
|
|
79
102
|
- **If** FROM_KICKOFF β use same dir as kickoff doc
|
|
80
103
|
- **Else** β `OUT_DIR = user_specified || docs/tasks/{branch_name}`
|
|
81
|
-
- `mkdir -p "$OUT_DIR"`
|
|
104
|
+
- `mkdir -p "$OUT_DIR/concepts" "$OUT_DIR/clarifications"`
|
|
82
105
|
|
|
83
|
-
- **Action** β
|
|
106
|
+
- **Action** β DetectClarificationMethod: Check if `AskUserQuestion` tool is available.
|
|
107
|
+
- **If available** β use inline clarification flow (Path A)
|
|
108
|
+
- **If not available** β use file-based clarification flow (Path B)
|
|
84
109
|
|
|
85
|
-
|
|
110
|
+
### Path A: Inline Clarifications (AskUserQuestion available)
|
|
86
111
|
|
|
87
|
-
- **Action** β
|
|
112
|
+
- **Action** β AskInline: Generate 3β6 questions based ONLY on remaining scope ambiguities from Step 3 (or kickoff's "Remaining Ambiguities").
|
|
113
|
+
- Ask the most critical first (up to 4 at a time, the tool limit).
|
|
114
|
+
- For trade-off decisions, present options with concise pros/cons.
|
|
115
|
+
- If more than 4 questions, ask in batches β most important first.
|
|
88
116
|
|
|
117
|
+
**CRITICAL**: Only ask about unresolved scope ambiguities. Technical questions belong in `plan`, not here.
|
|
118
|
+
|
|
119
|
+
### Path B: File-Based Clarifications (no AskUserQuestion)
|
|
120
|
+
|
|
121
|
+
- **Action** β GenerateTargetedQuestions: Create 3β6 questions in `{OUT_DIR}/clarifications/scope_clarifications_{YYYY-MM-DD_HHMMSS}.md`:
|
|
89
122
|
- Header: concept name, confirmed boundaries so far
|
|
90
|
-
-
|
|
123
|
+
- Each question with a `<response></response>` block
|
|
91
124
|
|
|
92
125
|
- **Action** β PromptUser: "Saved clarifications to `{path}`. Answer in `<response>` blocks. Reply 'Read it' when ready."
|
|
93
126
|
|
|
94
|
-
- **Wait** β User replies
|
|
127
|
+
- **Wait** β User replies.
|
|
95
128
|
|
|
96
|
-
- **Action** β ReadClarifications: Read file
|
|
129
|
+
- **Action** β ReadClarifications: Read the file; use responses (proceed with intelligent assumptions if blocks are empty).
|
|
97
130
|
|
|
98
|
-
## Step
|
|
131
|
+
## Step 5: Create Scope Document
|
|
99
132
|
|
|
100
|
-
- **Action** β CreateScopeDoc: Generate `{OUT_DIR}/concepts/scope.md` (use scoped filename if exists).
|
|
133
|
+
- **Action** β CreateScopeDoc: Generate `{OUT_DIR}/concepts/scope.md` (use scoped filename if one exists).
|
|
101
134
|
|
|
102
135
|
**Priority**: User value and boundaries BEFORE technical details.
|
|
103
136
|
|
|
104
|
-
**Sections**:
|
|
105
|
-
|
|
106
|
-
## Step 5: Light Technical Context (Optional)
|
|
137
|
+
**Sections**:
|
|
107
138
|
|
|
108
|
-
**
|
|
139
|
+
1. **The Problem** β pain, impact, current state
|
|
140
|
+
2. **Target Users** β primary, secondary, needs
|
|
141
|
+
3. **Success Criteria** β outcomes; prefer measurable assertions over prose
|
|
142
|
+
4. **User Experience** β journeys, principles, trade-offs
|
|
143
|
+
5. **Scope Boundaries** β IN / OUT / ANTI-SCOPE / Maybe / Future
|
|
144
|
+
6. **Load-Bearing Assumptions** β assumptions that, if wrong, invalidate this scope. Each assumption gets a short *"if this is false, β¦"* consequence so future-you can recognize when to come back.
|
|
145
|
+
7. **Constraints** β platform, perf, a11y, scale (user-provided only)
|
|
146
|
+
8. **Decisions** β from clarifications + rationale
|
|
147
|
+
9. **Risks** β UX, scope creep, open questions
|
|
148
|
+
10. **Next Steps** β `plan` or `create_tasks`, complexity S/M/L
|
|
109
149
|
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
- **
|
|
150
|
+
**Note on ANTI-SCOPE vs OUT**:
|
|
151
|
+
- **OUT** = we're not building it (yet, or for this release).
|
|
152
|
+
- **ANTI-SCOPE** = we're intentionally not solving this *problem* β it clarifies the philosophical edge of what this feature is for.
|
|
113
153
|
|
|
114
154
|
## Step 6: Final Review & Next Steps
|
|
115
155
|
|
|
@@ -117,12 +157,18 @@ Collaborative workflow for structuring unstructured thoughts into clear scope bo
|
|
|
117
157
|
|
|
118
158
|
> **Scope Complete**: `{OUT_DIR}/concepts/scope.md`
|
|
119
159
|
>
|
|
120
|
-
> **Final Boundaries**:
|
|
160
|
+
> **Final Boundaries**:
|
|
161
|
+
> β
**IN**: [from doc]
|
|
162
|
+
> β **OUT**: [from doc]
|
|
163
|
+
> π« **ANTI-SCOPE**: [from doc]
|
|
164
|
+
> β οΈ **Maybe/Future**: [from doc]
|
|
165
|
+
>
|
|
166
|
+
> **Load-Bearing Assumptions** (top 1β3 β if any prove false, return to scope): [from doc]
|
|
121
167
|
>
|
|
122
|
-
> Docs saved: `{OUT_DIR}/concepts/scope.md`, `{OUT_DIR}/clarifications
|
|
168
|
+
> Docs saved: `{OUT_DIR}/concepts/scope.md`, clarifications under `{OUT_DIR}/clarifications/`
|
|
123
169
|
>
|
|
124
|
-
> Reply with
|
|
170
|
+
> Reply with edits β otherwise pick a next step:
|
|
125
171
|
|
|
126
172
|
- **Action** β RenderFooter: Render Next Steps using `Skill(spectre-guide)` skill.
|
|
127
173
|
|
|
128
|
-
> **NOTE**: Do NOT wait for explicit approval. Present next steps
|
|
174
|
+
> **NOTE**: Do NOT wait for explicit approval. Present next steps inline with the review. The user can reply with scope edits OR jump straight into a next step command. If they reply with edits, apply them to the scope doc and re-present.
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: "ux"
|
|
3
|
+
description: "π» | Define user flows, components, and UX behavior β generates the UX spec for a feature - primary agent"
|
|
4
|
+
user-invocable: true
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
# ux
|
|
8
|
+
|
|
9
|
+
## Input Handling
|
|
10
|
+
|
|
11
|
+
Treat the current command arguments as this workflow's input. When invoked from a slash command, use the forwarded `$ARGUMENTS` value.
|
|
12
|
+
|
|
13
|
+
# ux: Define Exactly How the Feature Works
|
|
14
|
+
|
|
15
|
+
Transform product requirements into a definitive behavioral specification. Two stages: align on user flows, then generate detailed spec. Output: `ux.md` ready for implementation.
|
|
16
|
+
|
|
17
|
+
<ARGUMENTS> $ARGUMENTS </ARGUMENTS>
|
|
18
|
+
|
|
19
|
+
---
|
|
20
|
+
|
|
21
|
+
# STAGE 1: Flow Discovery & Alignment
|
|
22
|
+
|
|
23
|
+
**Goal**: Align on HOW the feature works before specifying details.
|
|
24
|
+
|
|
25
|
+
## Step 1 β Understand the Feature
|
|
26
|
+
|
|
27
|
+
1. **Read scope and requirements** in this precedence (read whichever exist FULLY, no offset/limit):
|
|
28
|
+
- `docs/tasks/{branch}/concepts/scope.md` β the canonical scope doc (preferred)
|
|
29
|
+
- `docs/tasks/{branch}/specs/prd.md` β if a PRD was generated separately
|
|
30
|
+
- `docs/tasks/{branch}/task_summary.md` β if present
|
|
31
|
+
- **If none exist** β ask the user for scope context (or recommend `scope` first) before proceeding.
|
|
32
|
+
2. **Research patterns**: Dispatch `@patterns` to find existing screens/components similar to what we're building. Note conventions, reusable elements, and any design tokens.
|
|
33
|
+
3. **Identify user segments**: List the user segments this feature serves β first-time vs returning, anonymous vs signed-in, free vs paid, role-based variants. UX often diverges across segments and missing this is a common cause of rework.
|
|
34
|
+
4. **Identify journeys**: List user goals, entry points, and completion states.
|
|
35
|
+
|
|
36
|
+
## Step 2 β Present User Flows
|
|
37
|
+
|
|
38
|
+
Write each flow as a narrative walkthrough.
|
|
39
|
+
|
|
40
|
+
**Per flow include**: Goal, Entry point, Journey steps (User sees β User does β System responds), Decision points with branches, Success state, Questions where ambiguity exists.
|
|
41
|
+
|
|
42
|
+
**Per user segment**: Call out where flows diverge (e.g., "First-time users see X tour; returning users skip directly to Y").
|
|
43
|
+
|
|
44
|
+
After writing all flows, propose a specific take rather than asking open-ended:
|
|
45
|
+
|
|
46
|
+
> **User Flows β Proposed**
|
|
47
|
+
>
|
|
48
|
+
> I've mapped {N} flows across {M} user segments: {list with one-line summaries}
|
|
49
|
+
>
|
|
50
|
+
> **Key segmentation calls**: [where flows diverge by user state and why]
|
|
51
|
+
>
|
|
52
|
+
> Push back on anything wrong, missing, or over-/under-segmented. Reply with feedback or **"Flows approved"** to proceed.
|
|
53
|
+
|
|
54
|
+
**Wait for approval. If feedback β revise and re-present. If approved β Stage 2.**
|
|
55
|
+
|
|
56
|
+
---
|
|
57
|
+
|
|
58
|
+
# STAGE 2: Detailed Specification
|
|
59
|
+
|
|
60
|
+
**Gate**: Only proceed after explicit flow approval.
|
|
61
|
+
|
|
62
|
+
## Step 3 β Clarify Remaining Details
|
|
63
|
+
|
|
64
|
+
Review approved flows for gaps: component behaviors, edge cases, state definitions, segment variants.
|
|
65
|
+
|
|
66
|
+
If significant gaps, ask 3β5 targeted questions (empty states, error handling, loading, limits, segment differences). Save to `clarifications/ux_clarifications_{timestamp}.md`, prompt user to read, incorporate answers.
|
|
67
|
+
|
|
68
|
+
## Step 4 β Write the Specification
|
|
69
|
+
|
|
70
|
+
Generate complete spec with these sections:
|
|
71
|
+
|
|
72
|
+
### Required Sections
|
|
73
|
+
|
|
74
|
+
1. **Overview** β What this feature is, problem it solves, primary user goal (1 paragraph)
|
|
75
|
+
2. **User Segments** β Each segment served, what's different about their UX (e.g., first-time onboarding, role-based permissions, free vs paid limits, anon vs signed-in)
|
|
76
|
+
3. **Screens** β Every screen: name, purpose (1 line), navigation relationships
|
|
77
|
+
4. **Flows** β Formalized from Stage 1 with alternate paths (validation fail, cancel, network error). Include per-segment branches where they diverge.
|
|
78
|
+
5. **Layouts** β Per screen: header/main/footer structure + responsive behavior (desktop >1024, tablet 768β1024, mobile <768)
|
|
79
|
+
6. **Components** β Each interactive element: purpose, location, applicable states (see State Vocabulary below)
|
|
80
|
+
7. **Interactions** β Table format: Element | Action | Result (exhaustive)
|
|
81
|
+
8. **States** β Table format: State | Trigger | Appearance | Available Actions
|
|
82
|
+
9. **Content** β Exact copy: page titles, buttons, empty states, error messages, confirmation dialogs
|
|
83
|
+
10. **Edge Cases** β Limits/boundaries, null/long data handling, permissions, offline/network failures, segment-specific edge cases
|
|
84
|
+
11. **Accessibility** β Tab order, keyboard actions (Enter/Space/Escape), screen reader announcements, focus management
|
|
85
|
+
|
|
86
|
+
### State Vocabulary
|
|
87
|
+
|
|
88
|
+
Use these state categories where applicable. Not every component needs every state β pick what's relevant for the feature.
|
|
89
|
+
|
|
90
|
+
- **Visual states** (per interactive element): default, hover, focus, active/pressed, disabled
|
|
91
|
+
- **Data states** (per data view): empty, loading, partial-loaded, loaded, error, stale/refreshing
|
|
92
|
+
- **Form states**: pristine, dirty, touched, submitting, submitted-success, submitted-error, validation-error per field
|
|
93
|
+
- **Selection states**: none, single, multi, partial-selection, all-selected
|
|
94
|
+
- **Sync states** (collaborative or async UI): optimistic, pending, conflict, resolved
|
|
95
|
+
- **Network states** (where relevant): online, offline, reconnecting
|
|
96
|
+
|
|
97
|
+
Save to `docs/tasks/{branch}/ux.md`
|
|
98
|
+
|
|
99
|
+
Prompt:
|
|
100
|
+
|
|
101
|
+
> **UX Specification Complete**
|
|
102
|
+
>
|
|
103
|
+
> Written to `{path}`. Please review: Any behaviors wrong or missing? Edge cases not covered? Segment differences captured?
|
|
104
|
+
>
|
|
105
|
+
> **Want a prototype to validate visually before approving?** `prototype` will render this spec (high-fi, no synthesis) and flag assumptions where I had to fill in details β catches issues prose review misses. Reply `prototype` to run it now.
|
|
106
|
+
>
|
|
107
|
+
> Otherwise, reply with feedback, or **"Approved"** to finalize.
|
|
108
|
+
|
|
109
|
+
**Wait for approval, feedback, or prototype request.** If user replies `prototype`, invoke `prototype` (the post-ux mode auto-detects the complete ux.md). Once prototype completes and any spec updates from filled assumptions are applied, return here for final approval.
|
|
110
|
+
|
|
111
|
+
## Step 5 β Handoff
|
|
112
|
+
|
|
113
|
+
Confirm completion with summary: screens specified, segments addressed, flows documented, components with states, edge cases and accessibility covered.
|
|
114
|
+
|
|
115
|
+
Read `.spectre/next_steps_guide.md` and render Next Steps footer:
|
|
116
|
+
|
|
117
|
+
```
|
|
118
|
+
Next Steps | Phase: Scope | Status: UX Complete
|
|
119
|
+
Recommendation: {contextual next action β if no prototype was generated, suggest prototype to validate the spec visually before /plan}
|
|
120
|
+
Options: prototype (validate spec visually), create_plan, create_tasks, tdd
|
|
121
|
+
```
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
name: ux_spec
|
|
3
|
-
description: Define the User Flows and generate a UX Spec - primary agent
|
|
4
|
-
user-invocable: true
|
|
5
|
-
---
|
|
6
|
-
|
|
7
|
-
# ux_spec
|
|
8
|
-
|
|
9
|
-
## Input Handling
|
|
10
|
-
|
|
11
|
-
Treat the current command arguments as this workflow's input. When invoked from a slash command, use the forwarded `$ARGUMENTS` value.
|
|
12
|
-
|
|
13
|
-
# ux_spec: Define Exactly How the Feature Works
|
|
14
|
-
|
|
15
|
-
Transform product requirements into a definitive behavioral specification. Two stages: align on user flows, then generate detailed spec. Output: `ux.md` ready for implementation.
|
|
16
|
-
|
|
17
|
-
<ARGUMENTS> $ARGUMENTS </ARGUMENTS>
|
|
18
|
-
|
|
19
|
-
---
|
|
20
|
-
|
|
21
|
-
# STAGE 1: Flow Discovery & Alignment
|
|
22
|
-
|
|
23
|
-
**Goal**: Align on HOW the feature works before specifying details.
|
|
24
|
-
|
|
25
|
-
## Step 1 β Understand the Feature
|
|
26
|
-
|
|
27
|
-
1. **Read requirements**: `docs/tasks/{branch}/task_summary.md` and `docs/tasks/{branch}/specs/prd.md`
|
|
28
|
-
2. **Research patterns**: Find existing screens/components similar to what we're building, note conventions
|
|
29
|
-
3. **Identify journeys**: List user goals, entry points, and completion states
|
|
30
|
-
|
|
31
|
-
## Step 2 β Present User Flows
|
|
32
|
-
|
|
33
|
-
Write each flow as a narrative walkthrough:
|
|
34
|
-
|
|
35
|
-
**Per flow include**: Goal, Entry point, Journey steps (User sees β User does β System responds), Decision points with branches, Success state, Questions where ambiguity exists
|
|
36
|
-
|
|
37
|
-
After writing all flows, prompt:
|
|
38
|
-
|
|
39
|
-
> **User Flows for Review**
|
|
40
|
-
>
|
|
41
|
-
> I've mapped {N} flows: {list with one-line summaries}
|
|
42
|
-
>
|
|
43
|
-
> Please review: Are these the right flows? Any missing? Do journeys feel right? Answer flagged questions.
|
|
44
|
-
>
|
|
45
|
-
> Reply with feedback, or **"Flows approved"** to proceed.
|
|
46
|
-
|
|
47
|
-
**Wait for approval. If feedback β revise and re-present. If approved β Stage 2.**
|
|
48
|
-
|
|
49
|
-
---
|
|
50
|
-
|
|
51
|
-
# STAGE 2: Detailed Specification
|
|
52
|
-
|
|
53
|
-
**Gate**: Only proceed after explicit flow approval.
|
|
54
|
-
|
|
55
|
-
## Step 3 β Clarify Remaining Details
|
|
56
|
-
|
|
57
|
-
Review approved flows for gaps: component behaviors, edge cases, state definitions.
|
|
58
|
-
|
|
59
|
-
If significant gaps, ask 3-5 targeted questions (empty states, error handling, loading, limits). Save to `clarifications/ux_clarifications_{timestamp}.md`, prompt user to read, incorporate answers.
|
|
60
|
-
|
|
61
|
-
## Step 4 β Write the Specification
|
|
62
|
-
|
|
63
|
-
Generate complete spec with these sections:
|
|
64
|
-
|
|
65
|
-
### Required Sections
|
|
66
|
-
|
|
67
|
-
1. **Overview** β What this feature is, problem it solves, primary user goal (1 paragraph)
|
|
68
|
-
2. **Screens** β Every screen: name, purpose (1 line), navigation relationships
|
|
69
|
-
3. **Flows** β Formalized from Stage 1 with alternate paths (validation fail, cancel, network error)
|
|
70
|
-
4. **Layouts** β Per screen: header/main/footer structure + responsive behavior (desktop >1024, tablet 768-1024, mobile <768)
|
|
71
|
-
5. **Components** β Each interactive element: purpose, location, states (default, hover, active, disabled, loading, error)
|
|
72
|
-
6. **Interactions** β Table format: Element | Action | Result (exhaustive)
|
|
73
|
-
7. **States** β Table format: State | Trigger | Appearance | Available Actions (empty, loading, loaded, error)
|
|
74
|
-
8. **Content** β Exact copy: page titles, buttons, empty states, error messages, confirmation dialogs
|
|
75
|
-
9. **Edge Cases** β Limits/boundaries, null/long data handling, permissions, offline/network failures
|
|
76
|
-
10. **Accessibility** β Tab order, keyboard actions (Enter/Space/Escape), screen reader announcements, focus management
|
|
77
|
-
|
|
78
|
-
Save to `docs/tasks/{branch}/ux.md`
|
|
79
|
-
|
|
80
|
-
Prompt:
|
|
81
|
-
|
|
82
|
-
> **UX Specification Complete**
|
|
83
|
-
>
|
|
84
|
-
> Written to `{path}`. Please review: Any behaviors wrong or missing? Edge cases not covered?
|
|
85
|
-
>
|
|
86
|
-
> Reply with feedback, or **"Approved"** to finalize.
|
|
87
|
-
|
|
88
|
-
**Wait for approval.**
|
|
89
|
-
|
|
90
|
-
## Step 5 β Handoff
|
|
91
|
-
|
|
92
|
-
Confirm completion with summary: screens specified, flows documented, components with states, edge cases and accessibility covered.
|
|
93
|
-
|
|
94
|
-
Read `.spectre/next_steps_guide.md` and render Next Steps footer:
|
|
95
|
-
|
|
96
|
-
```
|
|
97
|
-
Next Steps | Phase: Scope | Status: UX Complete
|
|
98
|
-
Recommendation: {contextual next action}
|
|
99
|
-
Options: /create_plan, /create_tasks, /tdd
|
|
100
|
-
```
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
name: "ux_spec"
|
|
3
|
-
description: "Define the User Flows and generate a UX Spec - primary agent"
|
|
4
|
-
user-invocable: true
|
|
5
|
-
---
|
|
6
|
-
|
|
7
|
-
# ux_spec
|
|
8
|
-
|
|
9
|
-
## Input Handling
|
|
10
|
-
|
|
11
|
-
Treat the current command arguments as this workflow's input. When invoked from a slash command, use the forwarded `$ARGUMENTS` value.
|
|
12
|
-
|
|
13
|
-
# ux_spec: Define Exactly How the Feature Works
|
|
14
|
-
|
|
15
|
-
Transform product requirements into a definitive behavioral specification. Two stages: align on user flows, then generate detailed spec. Output: `ux.md` ready for implementation.
|
|
16
|
-
|
|
17
|
-
<ARGUMENTS> $ARGUMENTS </ARGUMENTS>
|
|
18
|
-
|
|
19
|
-
---
|
|
20
|
-
|
|
21
|
-
# STAGE 1: Flow Discovery & Alignment
|
|
22
|
-
|
|
23
|
-
**Goal**: Align on HOW the feature works before specifying details.
|
|
24
|
-
|
|
25
|
-
## Step 1 β Understand the Feature
|
|
26
|
-
|
|
27
|
-
1. **Read requirements**: `docs/tasks/{branch}/task_summary.md` and `docs/tasks/{branch}/specs/prd.md`
|
|
28
|
-
2. **Research patterns**: Find existing screens/components similar to what we're building, note conventions
|
|
29
|
-
3. **Identify journeys**: List user goals, entry points, and completion states
|
|
30
|
-
|
|
31
|
-
## Step 2 β Present User Flows
|
|
32
|
-
|
|
33
|
-
Write each flow as a narrative walkthrough:
|
|
34
|
-
|
|
35
|
-
**Per flow include**: Goal, Entry point, Journey steps (User sees β User does β System responds), Decision points with branches, Success state, Questions where ambiguity exists
|
|
36
|
-
|
|
37
|
-
After writing all flows, prompt:
|
|
38
|
-
|
|
39
|
-
> **User Flows for Review**
|
|
40
|
-
>
|
|
41
|
-
> I've mapped {N} flows: {list with one-line summaries}
|
|
42
|
-
>
|
|
43
|
-
> Please review: Are these the right flows? Any missing? Do journeys feel right? Answer flagged questions.
|
|
44
|
-
>
|
|
45
|
-
> Reply with feedback, or **"Flows approved"** to proceed.
|
|
46
|
-
|
|
47
|
-
**Wait for approval. If feedback β revise and re-present. If approved β Stage 2.**
|
|
48
|
-
|
|
49
|
-
---
|
|
50
|
-
|
|
51
|
-
# STAGE 2: Detailed Specification
|
|
52
|
-
|
|
53
|
-
**Gate**: Only proceed after explicit flow approval.
|
|
54
|
-
|
|
55
|
-
## Step 3 β Clarify Remaining Details
|
|
56
|
-
|
|
57
|
-
Review approved flows for gaps: component behaviors, edge cases, state definitions.
|
|
58
|
-
|
|
59
|
-
If significant gaps, ask 3-5 targeted questions (empty states, error handling, loading, limits). Save to `clarifications/ux_clarifications_{timestamp}.md`, prompt user to read, incorporate answers.
|
|
60
|
-
|
|
61
|
-
## Step 4 β Write the Specification
|
|
62
|
-
|
|
63
|
-
Generate complete spec with these sections:
|
|
64
|
-
|
|
65
|
-
### Required Sections
|
|
66
|
-
|
|
67
|
-
1. **Overview** β What this feature is, problem it solves, primary user goal (1 paragraph)
|
|
68
|
-
2. **Screens** β Every screen: name, purpose (1 line), navigation relationships
|
|
69
|
-
3. **Flows** β Formalized from Stage 1 with alternate paths (validation fail, cancel, network error)
|
|
70
|
-
4. **Layouts** β Per screen: header/main/footer structure + responsive behavior (desktop >1024, tablet 768-1024, mobile <768)
|
|
71
|
-
5. **Components** β Each interactive element: purpose, location, states (default, hover, active, disabled, loading, error)
|
|
72
|
-
6. **Interactions** β Table format: Element | Action | Result (exhaustive)
|
|
73
|
-
7. **States** β Table format: State | Trigger | Appearance | Available Actions (empty, loading, loaded, error)
|
|
74
|
-
8. **Content** β Exact copy: page titles, buttons, empty states, error messages, confirmation dialogs
|
|
75
|
-
9. **Edge Cases** β Limits/boundaries, null/long data handling, permissions, offline/network failures
|
|
76
|
-
10. **Accessibility** β Tab order, keyboard actions (Enter/Space/Escape), screen reader announcements, focus management
|
|
77
|
-
|
|
78
|
-
Save to `docs/tasks/{branch}/ux.md`
|
|
79
|
-
|
|
80
|
-
Prompt:
|
|
81
|
-
|
|
82
|
-
> **UX Specification Complete**
|
|
83
|
-
>
|
|
84
|
-
> Written to `{path}`. Please review: Any behaviors wrong or missing? Edge cases not covered?
|
|
85
|
-
>
|
|
86
|
-
> Reply with feedback, or **"Approved"** to finalize.
|
|
87
|
-
|
|
88
|
-
**Wait for approval.**
|
|
89
|
-
|
|
90
|
-
## Step 5 β Handoff
|
|
91
|
-
|
|
92
|
-
Confirm completion with summary: screens specified, flows documented, components with states, edge cases and accessibility covered.
|
|
93
|
-
|
|
94
|
-
Read `.spectre/next_steps_guide.md` and render Next Steps footer:
|
|
95
|
-
|
|
96
|
-
```
|
|
97
|
-
Next Steps | Phase: Scope | Status: UX Complete
|
|
98
|
-
Recommendation: {contextual next action}
|
|
99
|
-
Options: /create_plan, /create_tasks, /tdd
|
|
100
|
-
```
|