diff --git a/.agents/skills/audit/SKILL.md b/.agents/skills/audit/SKILL.md index fa777e5c0..313959a02 100644 --- a/.agents/skills/audit/SKILL.md +++ b/.agents/skills/audit/SKILL.md @@ -108,7 +108,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -127,7 +127,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.agents/skills/critique/SKILL.md b/.agents/skills/critique/SKILL.md index 3b59cca66..eba93446f 100644 --- a/.agents/skills/critique/SKILL.md +++ b/.agents/skills/critique/SKILL.md @@ -143,7 +143,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -208,7 +208,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.agents/skills/impeccable/reference/craft.md b/.agents/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.agents/skills/impeccable/reference/craft.md +++ b/.agents/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.agents/skills/validate/SKILL.md b/.agents/skills/validate/SKILL.md deleted file mode 100644 index 62e4ac05d..000000000 --- a/.agents/skills/validate/SKILL.md +++ /dev/null @@ -1,91 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. -user-invocable: true -argument-hint: "[area to validate]" ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, ask the user directly to clarify what you cannot infer. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.claude/skills/audit/SKILL.md b/.claude/skills/audit/SKILL.md index fa777e5c0..313959a02 100644 --- a/.claude/skills/audit/SKILL.md +++ b/.claude/skills/audit/SKILL.md @@ -108,7 +108,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -127,7 +127,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.claude/skills/critique/SKILL.md b/.claude/skills/critique/SKILL.md index 6accc0d59..2c5864182 100644 --- a/.claude/skills/critique/SKILL.md +++ b/.claude/skills/critique/SKILL.md @@ -145,7 +145,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -210,7 +210,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.claude/skills/impeccable/reference/craft.md b/.claude/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.claude/skills/impeccable/reference/craft.md +++ b/.claude/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.claude/skills/validate/SKILL.md b/.claude/skills/validate/SKILL.md deleted file mode 100644 index 127461ec0..000000000 --- a/.claude/skills/validate/SKILL.md +++ /dev/null @@ -1,91 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. -user-invocable: true -argument-hint: "[area to validate]" ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, STOP and call the AskUserQuestion tool to clarify. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.codex/skills/audit/SKILL.md b/.codex/skills/audit/SKILL.md index fd7a485bd..444fd5978 100644 --- a/.codex/skills/audit/SKILL.md +++ b/.codex/skills/audit/SKILL.md @@ -107,7 +107,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: $animate, $validate, $quieter, $shape, $optimize, $adapt, $clarify, $distill, $delight, $onboard, $normalize, $audit, $harden, $polish, $extract, $bolder, $arrange, $typeset, $critique, $colorize, $overdrive) +- **Suggested command**: Which command to use (prefer: $animate, $quieter, $shape, $optimize, $adapt, $clarify, $distill, $delight, $onboard, $normalize, $audit, $harden, $polish, $extract, $bolder, $arrange, $typeset, $critique, $colorize, $overdrive) ### Patterns & Systemic Issues @@ -126,7 +126,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `$command-name`** — Brief description (specific context from audit findings) 2. **[P?] `$command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: $animate, $validate, $quieter, $shape, $optimize, $adapt, $clarify, $distill, $delight, $onboard, $normalize, $audit, $harden, $polish, $extract, $bolder, $arrange, $typeset, $critique, $colorize, $overdrive. Map findings to the most appropriate command. End with `$polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: $animate, $quieter, $shape, $optimize, $adapt, $clarify, $distill, $delight, $onboard, $normalize, $audit, $harden, $polish, $extract, $bolder, $arrange, $typeset, $critique, $colorize, $overdrive. Map findings to the most appropriate command. End with `$polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.codex/skills/critique/SKILL.md b/.codex/skills/critique/SKILL.md index 3902edd38..8dff55390 100644 --- a/.codex/skills/critique/SKILL.md +++ b/.codex/skills/critique/SKILL.md @@ -142,7 +142,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: $animate, $validate, $quieter, $shape, $optimize, $adapt, $clarify, $distill, $delight, $onboard, $normalize, $audit, $harden, $polish, $extract, $bolder, $arrange, $typeset, $critique, $colorize, $overdrive) +- **Suggested command**: Which command could address this (from: $animate, $quieter, $shape, $optimize, $adapt, $clarify, $distill, $delight, $onboard, $normalize, $audit, $harden, $polish, $extract, $bolder, $arrange, $typeset, $critique, $colorize, $overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -207,7 +207,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: $animate, $validate, $quieter, $shape, $optimize, $adapt, $clarify, $distill, $delight, $onboard, $normalize, $audit, $harden, $polish, $extract, $bolder, $arrange, $typeset, $critique, $colorize, $overdrive +- Only recommend commands from: $animate, $quieter, $shape, $optimize, $adapt, $clarify, $distill, $delight, $onboard, $normalize, $audit, $harden, $polish, $extract, $bolder, $arrange, $typeset, $critique, $colorize, $overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.codex/skills/impeccable/reference/craft.md b/.codex/skills/impeccable/reference/craft.md index 67614a755..6748e3259 100644 --- a/.codex/skills/impeccable/reference/craft.md +++ b/.codex/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run $validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.codex/skills/validate/SKILL.md b/.codex/skills/validate/SKILL.md deleted file mode 100644 index be2568d5b..000000000 --- a/.codex/skills/validate/SKILL.md +++ /dev/null @@ -1,90 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. -argument-hint: "[area to validate]" ---- - -## MANDATORY PREPARATION - -Invoke $impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run $impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run $validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, ask the user directly to clarify what you cannot infer. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → $arrange, copy issues → $clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.cursor/skills/audit/SKILL.md b/.cursor/skills/audit/SKILL.md index f944d6111..37f353e71 100644 --- a/.cursor/skills/audit/SKILL.md +++ b/.cursor/skills/audit/SKILL.md @@ -106,7 +106,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -125,7 +125,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.cursor/skills/critique/SKILL.md b/.cursor/skills/critique/SKILL.md index d9793b008..7f0204530 100644 --- a/.cursor/skills/critique/SKILL.md +++ b/.cursor/skills/critique/SKILL.md @@ -141,7 +141,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -206,7 +206,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.cursor/skills/impeccable/reference/craft.md b/.cursor/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.cursor/skills/impeccable/reference/craft.md +++ b/.cursor/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.cursor/skills/validate/SKILL.md b/.cursor/skills/validate/SKILL.md deleted file mode 100644 index b4c183888..000000000 --- a/.cursor/skills/validate/SKILL.md +++ /dev/null @@ -1,89 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, ask the user directly to clarify what you cannot infer. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.gemini/skills/audit/SKILL.md b/.gemini/skills/audit/SKILL.md index f944d6111..37f353e71 100644 --- a/.gemini/skills/audit/SKILL.md +++ b/.gemini/skills/audit/SKILL.md @@ -106,7 +106,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -125,7 +125,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.gemini/skills/critique/SKILL.md b/.gemini/skills/critique/SKILL.md index 6a2ca17dd..289476584 100644 --- a/.gemini/skills/critique/SKILL.md +++ b/.gemini/skills/critique/SKILL.md @@ -141,7 +141,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -206,7 +206,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.gemini/skills/impeccable/reference/craft.md b/.gemini/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.gemini/skills/impeccable/reference/craft.md +++ b/.gemini/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.gemini/skills/validate/SKILL.md b/.gemini/skills/validate/SKILL.md deleted file mode 100644 index b4c183888..000000000 --- a/.gemini/skills/validate/SKILL.md +++ /dev/null @@ -1,89 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, ask the user directly to clarify what you cannot infer. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.kiro/skills/audit/SKILL.md b/.kiro/skills/audit/SKILL.md index f944d6111..37f353e71 100644 --- a/.kiro/skills/audit/SKILL.md +++ b/.kiro/skills/audit/SKILL.md @@ -106,7 +106,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -125,7 +125,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.kiro/skills/critique/SKILL.md b/.kiro/skills/critique/SKILL.md index ff002dc40..4a40fa87b 100644 --- a/.kiro/skills/critique/SKILL.md +++ b/.kiro/skills/critique/SKILL.md @@ -141,7 +141,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -206,7 +206,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.kiro/skills/impeccable/reference/craft.md b/.kiro/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.kiro/skills/impeccable/reference/craft.md +++ b/.kiro/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.kiro/skills/validate/SKILL.md b/.kiro/skills/validate/SKILL.md deleted file mode 100644 index b4c183888..000000000 --- a/.kiro/skills/validate/SKILL.md +++ /dev/null @@ -1,89 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, ask the user directly to clarify what you cannot infer. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.opencode/skills/audit/SKILL.md b/.opencode/skills/audit/SKILL.md index fa777e5c0..313959a02 100644 --- a/.opencode/skills/audit/SKILL.md +++ b/.opencode/skills/audit/SKILL.md @@ -108,7 +108,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -127,7 +127,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.opencode/skills/critique/SKILL.md b/.opencode/skills/critique/SKILL.md index 5b02968d4..c76de0c3b 100644 --- a/.opencode/skills/critique/SKILL.md +++ b/.opencode/skills/critique/SKILL.md @@ -145,7 +145,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -210,7 +210,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.opencode/skills/impeccable/reference/craft.md b/.opencode/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.opencode/skills/impeccable/reference/craft.md +++ b/.opencode/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.opencode/skills/validate/SKILL.md b/.opencode/skills/validate/SKILL.md deleted file mode 100644 index c7b6b6433..000000000 --- a/.opencode/skills/validate/SKILL.md +++ /dev/null @@ -1,91 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. -user-invocable: true -argument-hint: "[area to validate]" ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, STOP and call the `question` tool to clarify. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.pi/skills/audit/SKILL.md b/.pi/skills/audit/SKILL.md index f944d6111..37f353e71 100644 --- a/.pi/skills/audit/SKILL.md +++ b/.pi/skills/audit/SKILL.md @@ -106,7 +106,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -125,7 +125,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.pi/skills/critique/SKILL.md b/.pi/skills/critique/SKILL.md index 20b81c1c0..f4081a9eb 100644 --- a/.pi/skills/critique/SKILL.md +++ b/.pi/skills/critique/SKILL.md @@ -143,7 +143,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -208,7 +208,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.pi/skills/impeccable/reference/craft.md b/.pi/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.pi/skills/impeccable/reference/craft.md +++ b/.pi/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.pi/skills/validate/SKILL.md b/.pi/skills/validate/SKILL.md deleted file mode 100644 index b4c183888..000000000 --- a/.pi/skills/validate/SKILL.md +++ /dev/null @@ -1,89 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, ask the user directly to clarify what you cannot infer. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.rovodev/skills/audit/SKILL.md b/.rovodev/skills/audit/SKILL.md index fa777e5c0..313959a02 100644 --- a/.rovodev/skills/audit/SKILL.md +++ b/.rovodev/skills/audit/SKILL.md @@ -108,7 +108,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -127,7 +127,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.rovodev/skills/critique/SKILL.md b/.rovodev/skills/critique/SKILL.md index 79d8f0cea..8ed006ad1 100644 --- a/.rovodev/skills/critique/SKILL.md +++ b/.rovodev/skills/critique/SKILL.md @@ -145,7 +145,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -210,7 +210,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.rovodev/skills/impeccable/reference/craft.md b/.rovodev/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.rovodev/skills/impeccable/reference/craft.md +++ b/.rovodev/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.rovodev/skills/validate/SKILL.md b/.rovodev/skills/validate/SKILL.md deleted file mode 100644 index 62e4ac05d..000000000 --- a/.rovodev/skills/validate/SKILL.md +++ /dev/null @@ -1,91 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. -user-invocable: true -argument-hint: "[area to validate]" ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, ask the user directly to clarify what you cannot infer. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.trae-cn/skills/audit/SKILL.md b/.trae-cn/skills/audit/SKILL.md index fa777e5c0..313959a02 100644 --- a/.trae-cn/skills/audit/SKILL.md +++ b/.trae-cn/skills/audit/SKILL.md @@ -108,7 +108,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -127,7 +127,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.trae-cn/skills/critique/SKILL.md b/.trae-cn/skills/critique/SKILL.md index 99347dc60..8a86bd133 100644 --- a/.trae-cn/skills/critique/SKILL.md +++ b/.trae-cn/skills/critique/SKILL.md @@ -143,7 +143,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -208,7 +208,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.trae-cn/skills/impeccable/reference/craft.md b/.trae-cn/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.trae-cn/skills/impeccable/reference/craft.md +++ b/.trae-cn/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.trae-cn/skills/validate/SKILL.md b/.trae-cn/skills/validate/SKILL.md deleted file mode 100644 index 62e4ac05d..000000000 --- a/.trae-cn/skills/validate/SKILL.md +++ /dev/null @@ -1,91 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. -user-invocable: true -argument-hint: "[area to validate]" ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, ask the user directly to clarify what you cannot infer. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file diff --git a/.trae/skills/audit/SKILL.md b/.trae/skills/audit/SKILL.md index fa777e5c0..313959a02 100644 --- a/.trae/skills/audit/SKILL.md +++ b/.trae/skills/audit/SKILL.md @@ -108,7 +108,7 @@ For each issue, document: - **Impact**: How it affects users - **WCAG/Standard**: Which standard it violates (if applicable) - **Recommendation**: How to fix it -- **Suggested command**: Which command to use (prefer: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command to use (prefer: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) ### Patterns & Systemic Issues @@ -127,7 +127,7 @@ List recommended commands in priority order (P0 first, then P1, then P2): 1. **[P?] `/command-name`** — Brief description (specific context from audit findings) 2. **[P?] `/command-name`** — Brief description (specific context) -**Rules**: Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. +**Rules**: Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive. Map findings to the most appropriate command. End with `/polish` as the final step if any fixes were recommended. After presenting the summary, tell the user: diff --git a/.trae/skills/critique/SKILL.md b/.trae/skills/critique/SKILL.md index 99347dc60..8a86bd133 100644 --- a/.trae/skills/critique/SKILL.md +++ b/.trae/skills/critique/SKILL.md @@ -143,7 +143,7 @@ For each issue, tag with **P0-P3 severity** (consult [heuristics-scoring](refere - **[P?] What**: Name the problem clearly - **Why it matters**: How this hurts users or undermines goals - **Fix**: What to do about it (be concrete) -- **Suggested command**: Which command could address this (from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) +- **Suggested command**: Which command could address this (from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive) #### Persona Red Flags > *Consult [personas](reference/personas.md)* @@ -208,7 +208,7 @@ List recommended commands in priority order, based on the user's answers: ... **Rules for recommendations**: -- Only recommend commands from: /animate, /validate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive +- Only recommend commands from: /animate, /quieter, /shape, /optimize, /adapt, /clarify, /distill, /delight, /onboard, /normalize, /audit, /harden, /polish, /extract, /bolder, /arrange, /typeset, /critique, /colorize, /overdrive - Order by the user's stated priorities first, then by impact - Each item's description should carry enough context that the command knows what to focus on - Map each Priority Issue to the appropriate command diff --git a/.trae/skills/impeccable/reference/craft.md b/.trae/skills/impeccable/reference/craft.md index d2961057f..8cddbc9db 100644 --- a/.trae/skills/impeccable/reference/craft.md +++ b/.trae/skills/impeccable/reference/craft.md @@ -52,7 +52,7 @@ Iterate through these checks visually: 1. **Does it match the brief?** Compare the live result against every section of the design brief. Fix discrepancies. 2. **Does it pass the AI slop test?** If someone saw this and said "AI made this," would they believe it immediately? If yes, it needs more design intention. -3. **Run /validate.** Fix any P0 or P1 issues. +3. **Check against impeccable's DON'T guidelines.** Fix any anti-pattern violations. 4. **Check every state.** Navigate through empty, error, loading, and edge case states. Each one should feel intentional, not like an afterthought. 5. **Check responsive.** Resize the viewport. Does it adapt well or just shrink? 6. **Check the details.** Spacing consistency, type hierarchy clarity, color contrast, interactive feedback, motion timing. diff --git a/.trae/skills/validate/SKILL.md b/.trae/skills/validate/SKILL.md deleted file mode 100644 index 62e4ac05d..000000000 --- a/.trae/skills/validate/SKILL.md +++ /dev/null @@ -1,91 +0,0 @@ ---- -name: validate -description: Fast visual validation after UX/UI changes. Checks anti-patterns, spacing consistency, design system adherence, and copy quality in a single pass. Use after completing any UI work, when the user wants a quick quality check, or proactively after implementing a feature. -user-invocable: true -argument-hint: "[area to validate]" ---- - -## MANDATORY PREPARATION - -Invoke /impeccable, which contains design principles, anti-patterns, and the **Context Gathering Protocol**. Follow the protocol before proceeding. If no design context exists yet, you MUST run /impeccable teach first. - ---- - -A fast, focused quality gate. Not a full audit or critique; this is the 2-minute check you run after every UI change to catch the most common and damaging issues before they ship. - -Think of this as a design linter: opinionated, fast, and actionable. Flag what's wrong, say how to fix it, move on. - -## When to Run - -Run /validate after: -- Implementing or modifying any UI component -- Completing a feature's visual design -- Before requesting a design review from a human -- Any time you're about to mark UI work as "done" - -## Validation Pass - -Read the changed files. If browser automation is available, take a screenshot for visual inspection. Then run through ALL of the following checks in a single pass. Be fast and direct. - -### 1. Anti-Pattern Scan - -Check against ALL **DON'T** guidelines in the impeccable skill. The most common offenders: -- AI color palette (purple gradients, cyan-on-dark, neon glows) -- Identical card grids, hero metric layouts -- Overused fonts (Inter, Roboto, system defaults) -- Glassmorphism, gradient text, dark-mode-by-default -- Cards inside cards, everything centered, modals for everything - -**The test**: Would someone immediately guess an AI made this? - -### 2. Spacing & Rhythm - -- Are margins, paddings, and gaps consistent within the same visual context? -- Is there varied rhythm (tight groupings vs generous separations), or is everything evenly spaced? -- Do similar elements at the same hierarchy level use the same spacing? -- Are spacing values from the design system tokens, or are there magic numbers? - -### 3. Design System Adherence - -- Are colors from the project's palette/tokens, or are there one-off hex values? -- Are font sizes, weights, and families from the type scale? -- Do border radii, shadows, and transitions match existing patterns? -- Are interactive elements styled consistently with others of the same type? - -### 4. Visual Consistency - -- Do elements that should look the same actually look the same? -- Is the visual hierarchy clear? (One primary action, clear reading order) -- Are alignment and grid lines maintained across the section? -- Do hover/focus/active states exist and feel consistent? - -### 5. Copy Quality - -- Is any text redundant with what's already visible? (Headers restating the page title, labels repeating obvious context) -- Are labels, buttons, and messages concise? Every word should earn its place. -- Is the tone consistent with the rest of the interface? -- Are error/empty/loading states handled with helpful copy? - -## Output Format - -Report findings as a flat list, grouped by severity: - -**Severity levels:** -- **P0 (Broken)**: Visually broken, inaccessible, or fundamentally wrong. Fix before shipping. -- **P1 (Anti-pattern)**: Clear design anti-pattern that undermines quality. Fix now. -- **P2 (Inconsistency)**: Spacing, token, or style drift from the design system. Fix soon. -- **P3 (Polish)**: Minor refinement opportunity. Fix if time allows. - -For each finding: -``` -[P0-P3] [Category] Short description of what's wrong - → Fix: Concrete action to take (file:line if applicable) -``` - -Keep the total list short. If everything looks good, say so. Don't invent issues. - -## After Validation - -If P0 or P1 issues are found, fix them immediately. For P2/P3 issues, ask the user directly to clarify what you cannot infer. whether the user wants them addressed now or noted for later. - -If the issues map cleanly to an existing command (e.g., spacing issues → /arrange, copy issues → /clarify), suggest that command instead of fixing manually. \ No newline at end of file