get-shit-pretty 0.5.2 → 0.6.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/.claude-plugin/plugin.json +1 -1
- package/bin/install.js +3 -0
- package/gsp/agents/gsp-builder.md +1 -1
- package/gsp/skills/gsp-accessibility/SKILL.md +51 -186
- package/gsp/skills/gsp-accessibility-audit/SKILL.md +218 -0
- package/gsp/skills/gsp-brand-audit/SKILL.md +1 -3
- package/gsp/skills/gsp-brand-identity/SKILL.md +1 -3
- package/gsp/skills/gsp-brand-patterns/SKILL.md +3 -9
- package/gsp/skills/gsp-brand-refine/SKILL.md +147 -0
- package/gsp/skills/gsp-brand-research/SKILL.md +1 -3
- package/gsp/skills/gsp-brand-strategy/SKILL.md +1 -3
- package/gsp/skills/gsp-brand-sync/SKILL.md +2 -4
- package/gsp/skills/gsp-doctor/SKILL.md +1 -1
- package/gsp/skills/gsp-help/SKILL.md +1 -0
- package/gsp/skills/gsp-launch/SKILL.md +3 -8
- package/gsp/skills/gsp-palette/SKILL.md +2 -0
- package/gsp/skills/gsp-project-brief/SKILL.md +3 -11
- package/gsp/skills/gsp-project-build/SKILL.md +2 -5
- package/gsp/skills/gsp-project-critique/SKILL.md +4 -8
- package/gsp/skills/gsp-project-design/SKILL.md +3 -9
- package/gsp/skills/gsp-project-research/SKILL.md +2 -5
- package/gsp/skills/gsp-project-review/SKILL.md +4 -6
- package/gsp/skills/gsp-start/SKILL.md +21 -118
- package/gsp/skills/gsp-style/SKILL.md +11 -174
- package/gsp/skills/gsp-typescale/SKILL.md +38 -161
- package/package.json +1 -1
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: brand-refine
|
|
3
|
+
description: Targeted brand adjustments mid-project — tweak colors, typography, or spacing without re-running the full branding diamond
|
|
4
|
+
user-invocable: true
|
|
5
|
+
allowed-tools:
|
|
6
|
+
- Read
|
|
7
|
+
- Write
|
|
8
|
+
- Edit
|
|
9
|
+
- Glob
|
|
10
|
+
- Bash
|
|
11
|
+
- AskUserQuestion
|
|
12
|
+
- WebFetch
|
|
13
|
+
---
|
|
14
|
+
<context>
|
|
15
|
+
You are a GSP brand refinement skill. You take targeted feedback about brand visual issues and surgically update token values — no need to re-run strategy or identity.
|
|
16
|
+
|
|
17
|
+
This skill modifies **tokens.json** and **palettes.json** only. If the user's feedback is strategic ("make the tone more playful") or narrative ("the brand story feels off"), redirect to `/gsp:brand-strategy` or `/gsp:brand-identity`.
|
|
18
|
+
</context>
|
|
19
|
+
|
|
20
|
+
<objective>
|
|
21
|
+
Accept natural language feedback about brand visuals, identify which tokens are affected, apply targeted value changes, and log what changed.
|
|
22
|
+
|
|
23
|
+
**Input:** Natural language feedback (e.g., "accent is too muted", "heading weight too heavy")
|
|
24
|
+
**Output:** Updated `tokens.json` and/or `palettes.json` + `REFINE-LOG.md`
|
|
25
|
+
**Agent:** None — inline skill, surgical edits
|
|
26
|
+
</objective>
|
|
27
|
+
|
|
28
|
+
<execution_context>
|
|
29
|
+
@${CLAUDE_SKILL_DIR}/../../references/design-tokens.md
|
|
30
|
+
</execution_context>
|
|
31
|
+
|
|
32
|
+
<rules>
|
|
33
|
+
- Always use `AskUserQuestion` for user interaction — never prompt via plain text
|
|
34
|
+
- Never update artifacts without showing before/after and getting confirmation
|
|
35
|
+
- Only touch tokens directly affected by the feedback
|
|
36
|
+
- Preserve existing token structure — edit values in place, don't restructure
|
|
37
|
+
- When changing a color that cascades into semantic tokens, show the full cascade before applying
|
|
38
|
+
- When color changes affect text/background pairs, check WCAG AA contrast (4.5:1 normal text, 3:1 large text) and warn if a change would fail
|
|
39
|
+
</rules>
|
|
40
|
+
|
|
41
|
+
<process>
|
|
42
|
+
## Step 0: Locate brand and parse feedback
|
|
43
|
+
|
|
44
|
+
Extract feedback from the user's input (everything after `/gsp:brand-refine`).
|
|
45
|
+
|
|
46
|
+
If no feedback provided, use `AskUserQuestion`: "What would you like to adjust? (e.g., 'accent is too muted', 'heading font feels too heavy', 'spacing too tight')"
|
|
47
|
+
|
|
48
|
+
Resolve brand from `.design/branding/` (one → use it, multiple → ask). Set `BRAND_PATH`.
|
|
49
|
+
Check that `{BRAND_PATH}/patterns/tokens.json` exists. If not: "No tokens found. Run `/gsp:brand-patterns` first."
|
|
50
|
+
|
|
51
|
+
## Step 1: Read current state
|
|
52
|
+
|
|
53
|
+
Read `{BRAND_PATH}/patterns/tokens.json` once. Extract all sections relevant to the feedback:
|
|
54
|
+
|
|
55
|
+
| Feedback signals | Token section |
|
|
56
|
+
|-----------------|---------------|
|
|
57
|
+
| color, accent, muted, vibrant, contrast, tint, shade, hue | `color` |
|
|
58
|
+
| font, heading, body, weight, size, line-height | `typography` |
|
|
59
|
+
| spacing, padding, gap, tight, loose, dense | `spacing` |
|
|
60
|
+
| shadow, elevation, depth, flat | `shadow` |
|
|
61
|
+
| radius, rounded, sharp, corners | `borderRadius` |
|
|
62
|
+
|
|
63
|
+
Also read `{BRAND_PATH}/identity/palettes.json` if it exists and feedback involves colors.
|
|
64
|
+
|
|
65
|
+
## Step 2: Propose changes
|
|
66
|
+
|
|
67
|
+
Show a clear before/after for each affected token:
|
|
68
|
+
|
|
69
|
+
```
|
|
70
|
+
/gsp:brand-refine
|
|
71
|
+
═══════════════════════════════════════
|
|
72
|
+
|
|
73
|
+
Feedback: "the accent is too muted"
|
|
74
|
+
|
|
75
|
+
─── Proposed Changes ─────────────────
|
|
76
|
+
|
|
77
|
+
color.brand.accent
|
|
78
|
+
before: #B8860B
|
|
79
|
+
after: #E8A317
|
|
80
|
+
change: increased chroma
|
|
81
|
+
|
|
82
|
+
Cascade:
|
|
83
|
+
color.semantic.link → #E8A317
|
|
84
|
+
color.semantic.focus-ring → #E8A317
|
|
85
|
+
|
|
86
|
+
Contrast: accent on white 3.2:1 → 2.8:1 ⚠️ below AA
|
|
87
|
+
accent on dark 8.4:1 → 9.2:1 ✓
|
|
88
|
+
|
|
89
|
+
─────────────────────────────────────
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
### Color changes involving palette scales
|
|
93
|
+
|
|
94
|
+
If the change affects a source color that feeds an 11-stop palette, use `AskUserQuestion`:
|
|
95
|
+
- **Regenerate scale** — regenerate the full 11-stop OKLCH palette from the new color
|
|
96
|
+
- **Just update tokens** — only change the specific token values
|
|
97
|
+
|
|
98
|
+
If regenerating, call the tints.dev API:
|
|
99
|
+
```
|
|
100
|
+
WebFetch: https://www.tints.dev/api/{colorName}/{hexWithoutHash}
|
|
101
|
+
```
|
|
102
|
+
Parse the response for the 11-stop OKLCH scale (50–950) and update `palettes.json`.
|
|
103
|
+
|
|
104
|
+
### Typography changes involving scale ratio
|
|
105
|
+
|
|
106
|
+
For individual token tweaks (weight, letter-spacing), propose direct value changes. If the user wants a different ratio or base size that would affect the entire scale, recalculate using the existing scale's mathematical relationship.
|
|
107
|
+
|
|
108
|
+
## Step 3: Confirm and apply
|
|
109
|
+
|
|
110
|
+
Use `AskUserQuestion`:
|
|
111
|
+
- **Apply all** — "apply all proposed changes"
|
|
112
|
+
- **Adjust first** — "I want to tweak some values"
|
|
113
|
+
- **Cancel** — "keep current values"
|
|
114
|
+
|
|
115
|
+
Apply confirmed changes:
|
|
116
|
+
1. **tokens.json** — edit values in place with `Edit`. Preserve structure.
|
|
117
|
+
2. **palettes.json** — update if palette was regenerated.
|
|
118
|
+
|
|
119
|
+
## Step 4: Log and finish
|
|
120
|
+
|
|
121
|
+
Append to `{BRAND_PATH}/REFINE-LOG.md`:
|
|
122
|
+
|
|
123
|
+
```markdown
|
|
124
|
+
## {DATE} — "{feedback}"
|
|
125
|
+
|
|
126
|
+
| Token | Before | After |
|
|
127
|
+
|-------|--------|-------|
|
|
128
|
+
| color.brand.accent | #B8860B | #E8A317 |
|
|
129
|
+
| color.semantic.link | #B8860B | #E8A317 |
|
|
130
|
+
```
|
|
131
|
+
|
|
132
|
+
Display summary:
|
|
133
|
+
|
|
134
|
+
```
|
|
135
|
+
/gsp:brand-refine — {n} tokens updated
|
|
136
|
+
═══════════════════════════════════════
|
|
137
|
+
|
|
138
|
+
Updated: {list of tokens}
|
|
139
|
+
Log: {BRAND_PATH}/REFINE-LOG.md
|
|
140
|
+
|
|
141
|
+
─────────────────────────────────────
|
|
142
|
+
```
|
|
143
|
+
|
|
144
|
+
Use `AskUserQuestion`:
|
|
145
|
+
- **More refinements** — loop back to Step 0
|
|
146
|
+
- **Done** — "that's all"
|
|
147
|
+
</process>
|
|
@@ -38,9 +38,7 @@ Research market context that will inform brand strategy.
|
|
|
38
38
|
<process>
|
|
39
39
|
## Step 1: Resolve brand
|
|
40
40
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
41
|
+
Resolve brand from `.design/branding/` (one → use it, multiple → ask). Set `BRAND_PATH`.
|
|
44
42
|
|
|
45
43
|
Read `{BRAND_PATH}/BRIEF.md`. If missing, tell user to run `/gsp:start` first.
|
|
46
44
|
Read `{BRAND_PATH}/config.json` for `brand_mode`.
|
|
@@ -40,9 +40,7 @@ Define brand strategy and voice through interactive creative direction, then pro
|
|
|
40
40
|
<process>
|
|
41
41
|
## Step 0: Resolve brand
|
|
42
42
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
43
|
+
Resolve brand from `.design/branding/` (one → use it, multiple → ask). Set `BRAND_PATH`.
|
|
46
44
|
If missing, tell user to run `/gsp:start` first.
|
|
47
45
|
|
|
48
46
|
## Step 1: Load context
|
|
@@ -45,10 +45,7 @@ Compare a project's shipped state against its source brand across all dimensions
|
|
|
45
45
|
<process>
|
|
46
46
|
## Step 0: Resolve brand and project
|
|
47
47
|
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
51
|
-
|
|
48
|
+
Resolve brand from `.design/branding/` (one → use it, multiple → ask). Set `BRAND_PATH`.
|
|
52
49
|
Check that the brand has at least one of: `patterns/tokens.json`, `strategy/`, `identity/`. If none exist, tell the user: "No brand system found. Run `/gsp:brand-patterns` first."
|
|
53
50
|
|
|
54
51
|
Verify the project codebase has shipped output — source files with components, copy, or styles.
|
|
@@ -74,6 +71,7 @@ Read `{BRAND_PATH}/sync/SYNC-REPORT.md`. Present a compact summary per dimension
|
|
|
74
71
|
- **Tokens only** — just sync the quantitative token changes
|
|
75
72
|
- **Pick by dimension** — choose which dimensions to sync
|
|
76
73
|
- **Review each** — walk through every divergence individually
|
|
74
|
+
- **Refine manually** — run `/gsp:brand-refine` to make targeted token adjustments instead
|
|
77
75
|
- **Skip** — don't update the brand
|
|
78
76
|
|
|
79
77
|
If "Pick by dimension", ask per dimension. If "Review each", walk through the Update Map from the report.
|
|
@@ -72,7 +72,7 @@ If all 4 phases complete, check:
|
|
|
72
72
|
|
|
73
73
|
**Check B4: Legacy Monolith Detection**
|
|
74
74
|
For each brand phase directory (discover, strategy, identity, patterns):
|
|
75
|
-
- If monolith exists but no INDEX.md → WARN: "
|
|
75
|
+
- If monolith exists but no INDEX.md → WARN: "Monolith files are no longer supported in GSP v0.6.0+. Re-run `/gsp:brand-{phase}` to generate chunk output."
|
|
76
76
|
|
|
77
77
|
### Per-Project Checks (6-phase)
|
|
78
78
|
|
|
@@ -42,6 +42,7 @@ Skill names are left-padded with 4 spaces. Descriptions start at column 27 (4 in
|
|
|
42
42
|
/gsp:brand-identity create visual identity
|
|
43
43
|
/gsp:brand-patterns build design system tokens and components
|
|
44
44
|
/gsp:brand-sync sync brand to match a project's shipped state
|
|
45
|
+
/gsp:brand-refine tweak brand tokens mid-project without re-running identity
|
|
45
46
|
/gsp:brand-audit audit existing brand before evolving (optional)
|
|
46
47
|
|
|
47
48
|
─── Project ──────────────────────────
|
|
@@ -31,12 +31,9 @@ Create marketing campaign assets for product launch.
|
|
|
31
31
|
<process>
|
|
32
32
|
## Step 0: Resolve project and brand
|
|
33
33
|
|
|
34
|
-
|
|
34
|
+
Resolve project from `.design/projects/` (one → use it, multiple → ask). Set `PROJECT_PATH`.
|
|
35
35
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
Read `{PROJECT_PATH}/brand.ref` to resolve brand path:
|
|
39
|
-
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
36
|
+
Read `{PROJECT_PATH}/brand.ref` → set `BRAND_PATH`.
|
|
40
37
|
|
|
41
38
|
## Step 1: Load context
|
|
42
39
|
|
|
@@ -49,9 +46,8 @@ Read `{PROJECT_PATH}/config.json` to get `design_scope`.
|
|
|
49
46
|
### Identity (selective, chunk-first)
|
|
50
47
|
|
|
51
48
|
Read `{BRAND_PATH}/identity/INDEX.md`. If it exists, load all identity chunks.
|
|
52
|
-
Fallback: read `{BRAND_PATH}/identity/IDENTITY.md`. Log: "⚠️ Legacy identity format detected."
|
|
53
49
|
|
|
54
|
-
If
|
|
50
|
+
If it doesn't exist, tell the user to complete the brand identity first.
|
|
55
51
|
|
|
56
52
|
### Voice and Messaging (from strategy)
|
|
57
53
|
|
|
@@ -60,7 +56,6 @@ Read `{BRAND_PATH}/strategy/voice-and-tone.md` and `{BRAND_PATH}/strategy/messag
|
|
|
60
56
|
### Design (chunk-first)
|
|
61
57
|
|
|
62
58
|
Read `{PROJECT_PATH}/design/INDEX.md`. If it exists, load all screen chunks.
|
|
63
|
-
Fallback: read `{PROJECT_PATH}/screens/INDEX.md` (legacy path).
|
|
64
59
|
|
|
65
60
|
### Other
|
|
66
61
|
|
|
@@ -138,6 +138,8 @@ If a brand context exists (`.design/branding/{brand}/`):
|
|
|
138
138
|
|
|
139
139
|
## Step 5: Write palettes.json
|
|
140
140
|
|
|
141
|
+
If `{OUTPUT_PATH}/palettes.json` already exists, use `AskUserQuestion`: "palettes.json already exists — overwrite with new palette?" with options **Overwrite** and **Cancel**. If cancelled, skip writing palettes.json and proceed to the next step.
|
|
142
|
+
|
|
141
143
|
Write `{OUTPUT_PATH}/palettes.json` with the full OKLCH scales:
|
|
142
144
|
|
|
143
145
|
```json
|
|
@@ -34,15 +34,9 @@ Scope the project and plan adaptations from the brand system.
|
|
|
34
34
|
<process>
|
|
35
35
|
## Step 0: Resolve project and brand
|
|
36
36
|
|
|
37
|
-
|
|
37
|
+
Resolve project from `.design/projects/` (one → use it, multiple → ask). Set `PROJECT_PATH`.
|
|
38
38
|
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
Read `{PROJECT_PATH}/brand.ref` to resolve brand path:
|
|
42
|
-
- Extract `brand` name and `path` from brand.ref
|
|
43
|
-
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
44
|
-
|
|
45
|
-
If brand.ref doesn't exist, tell the user to run `/gsp:start` to set up the project with a brand reference.
|
|
39
|
+
Read `{PROJECT_PATH}/brand.ref` → set `BRAND_PATH`. If brand.ref doesn't exist, tell the user to run `/gsp:start`.
|
|
46
40
|
|
|
47
41
|
## Step 1: Load context
|
|
48
42
|
|
|
@@ -50,9 +44,7 @@ If brand.ref doesn't exist, tell the user to run `/gsp:start` to set up the proj
|
|
|
50
44
|
|
|
51
45
|
Read `{BRAND_PATH}/patterns/INDEX.md`. If it exists, load all foundation chunks + selective component chunks.
|
|
52
46
|
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
If neither exists, tell the user to run `/gsp:brand-patterns` first to create the brand's design patterns.
|
|
47
|
+
If it doesn't exist, tell the user to run `/gsp:brand-patterns` first to create the brand's design patterns.
|
|
56
48
|
|
|
57
49
|
Also read `{BRAND_PATH}/patterns/tokens.json`.
|
|
58
50
|
|
|
@@ -57,12 +57,9 @@ Implement designs as production-ready code in the codebase via phased pipeline w
|
|
|
57
57
|
<process>
|
|
58
58
|
## Step 0: Resolve project and brand
|
|
59
59
|
|
|
60
|
-
|
|
60
|
+
Resolve project from `.design/projects/` (one → use it, multiple → ask). Set `PROJECT_PATH`.
|
|
61
61
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
Read `{PROJECT_PATH}/brand.ref` to resolve brand path:
|
|
65
|
-
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
62
|
+
Read `{PROJECT_PATH}/brand.ref` → set `BRAND_PATH`.
|
|
66
63
|
|
|
67
64
|
## Step 0.5: Validate prerequisites
|
|
68
65
|
|
|
@@ -36,12 +36,9 @@ Critique design quality and audit accessibility compliance.
|
|
|
36
36
|
<process>
|
|
37
37
|
## Step 0: Resolve project and brand
|
|
38
38
|
|
|
39
|
-
|
|
39
|
+
Resolve project from `.design/projects/` (one → use it, multiple → ask). Set `PROJECT_PATH`.
|
|
40
40
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
Read `{PROJECT_PATH}/brand.ref` to resolve brand path:
|
|
44
|
-
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
41
|
+
Read `{PROJECT_PATH}/brand.ref` → set `BRAND_PATH`.
|
|
45
42
|
|
|
46
43
|
## Step 1: Load context
|
|
47
44
|
|
|
@@ -52,13 +49,10 @@ Read `{PROJECT_PATH}/config.json` to get `implementation_target`, `design_scope`
|
|
|
52
49
|
**BRIEF:** `{PROJECT_PATH}/BRIEF.md`
|
|
53
50
|
|
|
54
51
|
**Identity:** Read `{BRAND_PATH}/identity/INDEX.md` → load all chunks.
|
|
55
|
-
Fallback: `{BRAND_PATH}/identity/IDENTITY.md`.
|
|
56
52
|
|
|
57
53
|
**Patterns:** Read `{BRAND_PATH}/patterns/INDEX.md` → load all chunks.
|
|
58
|
-
Fallback: `{BRAND_PATH}/patterns/SYSTEM.md`.
|
|
59
54
|
|
|
60
55
|
**Design:** Read `{PROJECT_PATH}/design/INDEX.md` → load all chunks.
|
|
61
|
-
Fallback: `{PROJECT_PATH}/design/SCREENS.md` or `{PROJECT_PATH}/screens/INDEX.md` (legacy).
|
|
62
56
|
|
|
63
57
|
**Brief:** Read `{PROJECT_PATH}/brief/INDEX.md` → load all chunks (if exists).
|
|
64
58
|
|
|
@@ -150,5 +144,7 @@ If verdict is **Fail**:
|
|
|
150
144
|
## Step 6: Phase transition output
|
|
151
145
|
|
|
152
146
|
Render phase transition (see `references/phase-transitions.md`). This phase has pass/fail variants — the reference covers both.
|
|
147
|
+
|
|
148
|
+
If critique identified brand-level issues (palette contrast, typography weight, spacing scale), note: "Some issues are brand-level — run `/gsp:brand-refine` to adjust tokens without re-running identity."
|
|
153
149
|
</process>
|
|
154
150
|
</output>
|
|
@@ -36,12 +36,9 @@ Design core UI/UX screens and interaction flows.
|
|
|
36
36
|
<process>
|
|
37
37
|
## Step 0: Resolve project and brand
|
|
38
38
|
|
|
39
|
-
|
|
39
|
+
Resolve project from `.design/projects/` (one → use it, multiple → ask). Set `PROJECT_PATH`.
|
|
40
40
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
Read `{PROJECT_PATH}/brand.ref` to resolve brand path:
|
|
44
|
-
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
41
|
+
Read `{PROJECT_PATH}/brand.ref` → set `BRAND_PATH`.
|
|
45
42
|
|
|
46
43
|
## Step 0.5: Validate prerequisites
|
|
47
44
|
|
|
@@ -71,14 +68,11 @@ If `{PROJECT_PATH}/references/` exists, scan for files (images, PDFs, markdown,
|
|
|
71
68
|
|
|
72
69
|
Read `{BRAND_PATH}/patterns/INDEX.md`. If it exists, load all foundation chunks + selective component chunks.
|
|
73
70
|
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
If neither exists, tell the user to run `/gsp:brand-patterns` first.
|
|
71
|
+
If it doesn't exist, tell the user to run `/gsp:brand-patterns` first.
|
|
77
72
|
|
|
78
73
|
### Brand context (selective)
|
|
79
74
|
|
|
80
75
|
Read `{BRAND_PATH}/identity/INDEX.md`. If it exists, load `color-system.md`, `typography.md`, and `imagery-style.md`.
|
|
81
|
-
Fallback: read `{BRAND_PATH}/identity/IDENTITY.md`.
|
|
82
76
|
|
|
83
77
|
### Brand style prompt (visual DNA)
|
|
84
78
|
|
|
@@ -36,12 +36,9 @@ Deep research into UX patterns, competitor experiences, and technical approaches
|
|
|
36
36
|
<process>
|
|
37
37
|
## Step 0: Resolve project and brand
|
|
38
38
|
|
|
39
|
-
|
|
39
|
+
Resolve project from `.design/projects/` (one → use it, multiple → ask). Set `PROJECT_PATH`.
|
|
40
40
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
Read `{PROJECT_PATH}/brand.ref` to resolve brand path:
|
|
44
|
-
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
41
|
+
Read `{PROJECT_PATH}/brand.ref` → set `BRAND_PATH`.
|
|
45
42
|
|
|
46
43
|
## Step 1: Load context
|
|
47
44
|
|
|
@@ -32,12 +32,9 @@ QA validate the codebase implementation against design intent.
|
|
|
32
32
|
<process>
|
|
33
33
|
## Step 0: Resolve project and brand
|
|
34
34
|
|
|
35
|
-
|
|
35
|
+
Resolve project from `.design/projects/` (one → use it, multiple → ask). Set `PROJECT_PATH`.
|
|
36
36
|
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
Read `{PROJECT_PATH}/brand.ref` to resolve brand path:
|
|
40
|
-
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
37
|
+
Read `{PROJECT_PATH}/brand.ref` → set `BRAND_PATH`.
|
|
41
38
|
|
|
42
39
|
## Step 1: Load context
|
|
43
40
|
|
|
@@ -54,7 +51,6 @@ Read `{PROJECT_PATH}/config.json` to get `implementation_target`, `design_scope`
|
|
|
54
51
|
**Git diff:** Run `git diff` (and `git diff --cached`) to see what actually changed in the codebase. Cross-reference against BUILD-LOG.md.
|
|
55
52
|
|
|
56
53
|
**Design:** Read `{PROJECT_PATH}/design/INDEX.md` → load all screen chunks.
|
|
57
|
-
Fallback: `{PROJECT_PATH}/screens/INDEX.md` (legacy).
|
|
58
54
|
|
|
59
55
|
**Brand patterns:** Read `{BRAND_PATH}/patterns/INDEX.md` → load foundation + component chunks.
|
|
60
56
|
Also read `{BRAND_PATH}/patterns/tokens.json`.
|
|
@@ -175,4 +171,6 @@ If verdict is **Fail**:
|
|
|
175
171
|
## Step 6: Phase transition output
|
|
176
172
|
|
|
177
173
|
Render phase transition (see `references/phase-transitions.md`). This phase has pass/fail variants — the reference covers both.
|
|
174
|
+
|
|
175
|
+
If review identified brand-level issues (token values that don't work in context), note: "Some issues are brand-level — run `/gsp:brand-refine` to adjust tokens without re-running identity."
|
|
178
176
|
</process>
|
|
@@ -71,12 +71,7 @@ Scan `.design/` for existing brands and projects:
|
|
|
71
71
|
|
|
72
72
|
### Step 1b: Run design system scan (background)
|
|
73
73
|
|
|
74
|
-
Spawn a background agent
|
|
75
|
-
- Use `subagent_type: "general-purpose"`
|
|
76
|
-
- Prompt: "Follow the /gsp:design-system skill methodology. Scan the codebase and produce `.design/system/{STACK,COMPONENTS,TOKENS,CONVENTIONS,CONCERNS}.md`. Read the templates from the GSP templates/system/ directory for output format. If no package.json exists, write minimal greenfield versions."
|
|
77
|
-
- Store the task reference — you'll read results in Step 3 Round 2 or Step 4.
|
|
78
|
-
|
|
79
|
-
This produces workspace-level documents consumed by downstream skills and agents.
|
|
74
|
+
Spawn `/gsp:design-system` as a background agent (`run_in_background: true`, `subagent_type: "general-purpose"`). It writes to `.design/system/` — don't wait for it. Store the task reference for Step 3 Round 2 or Step 4.
|
|
80
75
|
|
|
81
76
|
### Step 1c: Greet
|
|
82
77
|
|
|
@@ -92,39 +87,15 @@ Adapt the greeting based on what the scan revealed. Use plain text with Unicode
|
|
|
92
87
|
- **Summary box:** `┌──┐│└──┘` border with key-value pairs inside
|
|
93
88
|
|
|
94
89
|
**Fresh start (no `.design/`):**
|
|
95
|
-
|
|
96
|
-
/gsp: ◇◇
|
|
97
|
-
|
|
98
|
-
looks like a fresh start.
|
|
99
|
-
```
|
|
100
|
-
|
|
101
|
-
If `package.json` exists, append:
|
|
102
|
-
```
|
|
103
|
-
i scanning your codebase in the background — i'll factor in what i find.
|
|
104
|
-
```
|
|
105
|
-
|
|
106
|
-
Then use `AskUserQuestion` with options:
|
|
107
|
-
- **Brand identity** — "define who you are — strategy, voice, visuals"
|
|
108
|
-
- **Design project** — "design screens and flows for something you're building"
|
|
109
|
-
- **Both (brand + project)** — "full pipeline — brand first, then design"
|
|
110
|
-
- **Quick project** — "skip branding — pick a style preset and start designing"
|
|
90
|
+
Show ` /gsp: ◇◇\n looks like a fresh start.` (append codebase scanning note if `package.json` exists). Use `AskUserQuestion` with: Brand identity, Design project, Both (brand + project), Quick project.
|
|
111
91
|
|
|
112
92
|
**Legacy `.design/` detected (flat structure, pre-0.4.0):**
|
|
113
|
-
Acknowledge the legacy project
|
|
114
|
-
- **Start fresh brand** — "new dual-diamond brand alongside your legacy project"
|
|
115
|
-
- **Start design project** — "new project using the updated pipeline"
|
|
116
|
-
- **Keep working** — "continue with the legacy structure"
|
|
93
|
+
Acknowledge the legacy project. Use `AskUserQuestion`: Start fresh brand, Start design project, Keep working.
|
|
117
94
|
|
|
118
95
|
**Brands exist, no projects:**
|
|
119
|
-
Show brand name + pipeline flow.
|
|
120
|
-
- One option per existing brand — "start a project with {brand name}"
|
|
121
|
-
- **Create new brand** — "start a new brand identity"
|
|
96
|
+
Show brand name + pipeline flow (compact single-line if complete, full pipeline if incomplete). Use `AskUserQuestion`: one option per existing brand + Create new brand.
|
|
122
97
|
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
When brand is incomplete, show full pipeline flow + `→ next: /gsp:{next-command}`
|
|
126
|
-
|
|
127
|
-
**Brands + projects exist:**
|
|
98
|
+
**Brands + projects exist (canonical format):**
|
|
128
99
|
Show compact brand (single-line if complete) + full project pipeline flow. Then `AskUserQuestion`:
|
|
129
100
|
- **Continue {project}** — "pick up at {next phase}"
|
|
130
101
|
- **New project** — "start a new design project"
|
|
@@ -144,7 +115,7 @@ When codebase has been scanned (`.design/system/STACK.md` exists), show a Summar
|
|
|
144
115
|
```
|
|
145
116
|
|
|
146
117
|
**Codebase signals found (any state):**
|
|
147
|
-
Weave in what you found:
|
|
118
|
+
Weave in what you found naturally: framework, styling, component count.
|
|
148
119
|
|
|
149
120
|
## Step 2: Route based on conversation
|
|
150
121
|
|
|
@@ -169,22 +140,15 @@ mkdir -p .design/branding/{name}/{audit,discover,strategy,identity,patterns}
|
|
|
169
140
|
|
|
170
141
|
**Round 1 — Business & People:**
|
|
171
142
|
- Company name, industry, stage
|
|
172
|
-
-
|
|
173
|
-
- Business model
|
|
174
|
-
-
|
|
175
|
-
- Primary persona — use `AskUserQuestion` to confirm or build: present an inferred persona profile (name, role, day-in-the-life, frustration, aspiration, discovery, trust signals) and let user correct. If they say "fintech for Gen Z" → infer and present a concrete persona.
|
|
143
|
+
- Problem / audience / differentiation
|
|
144
|
+
- Business model, main competitors (2-3)
|
|
145
|
+
- Primary persona — infer a concrete profile (name, role, frustration, aspiration) from context and present for correction. Personas should feel like real people — dig into the emotional layer.
|
|
176
146
|
- Secondary persona (if relevant)
|
|
177
147
|
- Mission and vision
|
|
178
148
|
|
|
179
|
-
This round is the most important. The personas should feel like real people, not demographic buckets. Dig into the emotional layer: anxiety, ambition, frustration, curiosity, status, safety.
|
|
180
|
-
|
|
181
149
|
**Round 2 — Brand Essence & Landscape:**
|
|
182
150
|
|
|
183
|
-
Before presenting personality options, **internally synthesize** from Round 1
|
|
184
|
-
- **Promise:** what should someone feel when they interact with this brand? (derived from persona frustrations + aspirations)
|
|
185
|
-
- **Point of view:** what does this brand disagree with in the category? (derived from the problem + how it solves it differently)
|
|
186
|
-
|
|
187
|
-
You do NOT ask the user these directly — you use them to ground the personality options.
|
|
151
|
+
Before presenting personality options, **internally synthesize** promise (what should someone feel?) and point of view (what does this brand disagree with?) from Round 1. Don't ask these directly — use them to ground personality options.
|
|
188
152
|
|
|
189
153
|
- Brand personality — use `AskUserQuestion` with 2-3 concrete personality directions. **Each option must explain WHY it fits this brand's audience and problem** — not just a style label:
|
|
190
154
|
- Each option: **Label** (3 adjectives) / **Description** (why this personality fits their specific audience and competitive position — reference the persona by name, the problem, or the gap) / **Preview** (example sentence in that voice, using their product context)
|
|
@@ -218,39 +182,18 @@ Skip or compress rounds if the user gives enough upfront. Don't over-ask.
|
|
|
218
182
|
|
|
219
183
|
5. Set `brand_mode` in config.json based on Step 2 routing decision.
|
|
220
184
|
|
|
221
|
-
6. Route using `AskUserQuestion
|
|
222
|
-
|
|
223
|
-
- **Brand-only, new →** Use `AskUserQuestion`: "Brand brief created! Want to keep going?"
|
|
224
|
-
- **Continue to research** — "Start brand research now" → invoke `/gsp:brand-research` via Skill tool
|
|
225
|
-
- **Stop here** — "I'll come back later" → confirm files are saved, show how to resume with `/gsp:start`
|
|
226
|
-
- **What happens next?** — "Explain the next phase" → explain what brand research does and how it uses the brief
|
|
227
|
-
|
|
228
|
-
- **Brand-only, evolve →** Use `AskUserQuestion`: "Brand brief created! Let's audit your current brand."
|
|
229
|
-
- **Continue to audit** — "Audit my existing brand now" → invoke `/gsp:brand-audit` via Skill tool
|
|
230
|
-
- **Stop here** — "I'll come back later" → confirm files are saved, show how to resume with `/gsp:start`
|
|
231
|
-
- **What happens next?** — "Explain the audit phase" → explain what the brand audit does and why it comes before strategy
|
|
232
|
-
|
|
233
|
-
- **E2E, new →** "Brand brief created. Now let's scope the design project." → continue to Step 4.
|
|
185
|
+
6. Route using `AskUserQuestion` — always offer Continue / Stop here / What happens next:
|
|
234
186
|
|
|
235
|
-
- **
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
187
|
+
- **Brand-only, new →** continue to `/gsp:brand-research`
|
|
188
|
+
- **Brand-only, evolve →** continue to `/gsp:brand-audit`
|
|
189
|
+
- **E2E, new →** auto-continue to Step 4
|
|
190
|
+
- **E2E, evolve →** continue to `/gsp:brand-audit` (then Step 4 after audit)
|
|
239
191
|
|
|
240
192
|
## Step 4: Project flow
|
|
241
193
|
|
|
242
194
|
**Background:** Run `git branch --show-current` with `run_in_background: true` now — result will be ready by the time we need it for git context detection.
|
|
243
195
|
|
|
244
|
-
1. Show available brands
|
|
245
|
-
```
|
|
246
|
-
Available brands:
|
|
247
|
-
• acme-corp (complete — all 4 phases)
|
|
248
|
-
• beta-labs (in progress — 2/4 phases)
|
|
249
|
-
```
|
|
250
|
-
|
|
251
|
-
If no brands exist, explain that a brand is needed first and offer to create one.
|
|
252
|
-
If only one complete brand exists, suggest it as default.
|
|
253
|
-
If multiple brands exist, use `AskUserQuestion` with one option per brand (include status in description).
|
|
196
|
+
1. Show available brands with phase status. No brands → offer to create one. One complete → suggest as default. Multiple → `AskUserQuestion` with one option per brand.
|
|
254
197
|
|
|
255
198
|
2. User selects a brand.
|
|
256
199
|
|
|
@@ -263,27 +206,11 @@ mkdir -p .design/projects/{name}/{brief,research,design,critique,build,review,co
|
|
|
263
206
|
|
|
264
207
|
### Detect git context
|
|
265
208
|
|
|
266
|
-
Use the
|
|
209
|
+
Use the background `git branch --show-current` result. If detected, confirm branch with `AskUserQuestion`. Store in config.json `git.branch` + STATE.md `## Git`. No git repo → skip silently.
|
|
267
210
|
|
|
268
|
-
|
|
269
|
-
- **Yes, use this branch** — "Track `{branch}`"
|
|
270
|
-
- **Different branch** — "I want to use a different branch name"
|
|
271
|
-
3. Store in config.json `git.branch` and STATE.md `## Git` table
|
|
272
|
-
4. If no git repo detected, skip silently — leave fields as "—"
|
|
211
|
+
5. Write `.design/projects/{name}/brand.ref` — brand name, relative path, consumed_at ISO date, identity_hash (first 8 chars md5 of IDENTITY.md, or "pending").
|
|
273
212
|
|
|
274
|
-
|
|
275
|
-
```
|
|
276
|
-
brand: {brand-name}
|
|
277
|
-
path: ../../branding/{brand-name}/
|
|
278
|
-
consumed_at: {ISO_DATE}
|
|
279
|
-
identity_hash: {first 8 chars of md5 of IDENTITY.md content, or "pending" if identity not complete}
|
|
280
|
-
```
|
|
281
|
-
Write to `.design/projects/{name}/brand.ref`
|
|
282
|
-
|
|
283
|
-
6. Consume design system scan results:
|
|
284
|
-
- Read `.design/system/STACK.md` (guaranteed done by now — conversation has been going for multiple rounds)
|
|
285
|
-
- Note classification for config.json
|
|
286
|
-
- Auto-infer `implementation_target` from STACK.md tech stack and COMPONENTS.md component inventory
|
|
213
|
+
6. Consume `.design/system/STACK.md` — note classification for config.json, auto-infer `implementation_target` from STACK.md + COMPONENTS.md.
|
|
287
214
|
|
|
288
215
|
7. Gather project brief in 2 rounds:
|
|
289
216
|
|
|
@@ -331,33 +258,9 @@ For users who want to skip branding and start designing immediately with a style
|
|
|
331
258
|
|
|
332
259
|
### 5a: Style selection
|
|
333
260
|
|
|
334
|
-
Read
|
|
335
|
-
|
|
336
|
-
```
|
|
337
|
-
─── pick a style ─────────────────────
|
|
338
|
-
|
|
339
|
-
minimal swiss-minimalist, clean-modern, scandinavian
|
|
340
|
-
bold neubrutalism, brutalist, cyberpunk
|
|
341
|
-
dark modern-dark, midnight, hacker-terminal
|
|
342
|
-
editorial editorial, magazine, newspaper
|
|
343
|
-
warm organic, earthy, handcrafted
|
|
344
|
-
playful retro-futurism, vaporwave, memphis
|
|
345
|
-
```
|
|
346
|
-
|
|
347
|
-
Use `AskUserQuestion` with:
|
|
348
|
-
- One option per mood group (showing the first 2-3 preset names as preview)
|
|
349
|
-
- **Surprise me** — "pick something unexpected for my stack"
|
|
350
|
-
|
|
351
|
-
When user picks a group, show the specific presets in that group with 1-line descriptions from INDEX.yml. Use `AskUserQuestion` to pick the specific preset.
|
|
352
|
-
|
|
353
|
-
If the user names a preset directly at any point, skip the group step.
|
|
261
|
+
Read `${CLAUDE_SKILL_DIR}/../../skills/gsp-style/styles/INDEX.yml` and present styles grouped by category. Use `AskUserQuestion` with one option per mood group (showing 2-3 preset names as preview) plus **Surprise me**. When user picks a group, drill into specific presets. If user names a preset directly, skip the group step.
|
|
354
262
|
|
|
355
|
-
**"Surprise me" logic:**
|
|
356
|
-
- Developer tools / CLI → dark or minimal presets
|
|
357
|
-
- Content / blog → editorial presets
|
|
358
|
-
- SaaS / dashboard → minimal or bold presets
|
|
359
|
-
- E-commerce → warm or playful presets
|
|
360
|
-
- No codebase detected → truly random pick
|
|
263
|
+
**"Surprise me" logic:** Weight by codebase type — dev tools → dark/minimal, content → editorial, SaaS → minimal/bold, e-commerce → warm/playful, unknown → random.
|
|
361
264
|
|
|
362
265
|
### 5b: Create minimal brand
|
|
363
266
|
|