@hegemonart/get-design-done 1.14.8 → 1.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.claude-plugin/marketplace.json +5 -3
- package/.claude-plugin/plugin.json +15 -5
- package/CHANGELOG.md +97 -0
- package/README.md +30 -0
- package/SKILL.md +4 -1
- package/agents/a11y-mapper.md +25 -0
- package/agents/component-benchmark-harvester.md +112 -0
- package/agents/component-benchmark-synthesizer.md +88 -0
- package/agents/design-auditor.md +92 -8
- package/agents/design-context-builder.md +6 -0
- package/agents/design-executor.md +5 -2
- package/agents/design-pattern-mapper.md +2 -0
- package/agents/design-verifier.md +11 -0
- package/agents/motion-mapper.md +45 -0
- package/agents/token-mapper.md +36 -0
- package/agents/visual-hierarchy-mapper.md +29 -0
- package/connections/design-corpora.md +158 -0
- package/package.json +16 -2
- package/reference/anti-patterns.md +69 -0
- package/reference/audit-scoring.md +34 -3
- package/reference/brand-voice.md +199 -0
- package/reference/checklists.md +30 -3
- package/reference/components/README.md +90 -0
- package/reference/components/TEMPLATE.md +184 -0
- package/reference/components/accordion.md +217 -0
- package/reference/components/button.md +195 -0
- package/reference/components/card.md +200 -0
- package/reference/components/checkbox.md +207 -0
- package/reference/components/drawer.md +201 -0
- package/reference/components/input.md +208 -0
- package/reference/components/label.md +200 -0
- package/reference/components/link.md +193 -0
- package/reference/components/modal-dialog.md +210 -0
- package/reference/components/popover.md +197 -0
- package/reference/components/radio.md +203 -0
- package/reference/components/select-combobox.md +219 -0
- package/reference/components/switch.md +194 -0
- package/reference/components/tabs.md +213 -0
- package/reference/components/tooltip.md +201 -0
- package/reference/data/google-fonts.csv +51 -0
- package/reference/data/palettes.csv +41 -0
- package/reference/data/styles.csv +39 -0
- package/reference/design-system-guidance.md +177 -0
- package/reference/design-systems-catalog.md +151 -0
- package/reference/framer-motion-patterns.md +411 -0
- package/reference/gestalt.md +219 -0
- package/reference/iconography.md +231 -0
- package/reference/motion.md +102 -0
- package/reference/palette-catalog.md +82 -0
- package/reference/performance.md +304 -0
- package/reference/registry.json +359 -28
- package/reference/registry.schema.json +2 -1
- package/reference/review-format.md +2 -2
- package/reference/style-vocabulary.md +62 -0
- package/reference/surfaces.md +114 -0
- package/reference/typography.md +80 -0
- package/reference/visual-hierarchy-layout.md +306 -0
- package/skills/benchmark/SKILL.md +105 -0
|
@@ -5,14 +5,14 @@
|
|
|
5
5
|
},
|
|
6
6
|
"metadata": {
|
|
7
7
|
"description": "Get Design Done — 5-stage agent-orchestrated design pipeline with 9 connections, handoff-first workflow, bidirectional Figma write-back, 22+ specialized agents, queryable knowledge layer (intel store, dependency analysis, learnings extraction), and a self-improvement loop (reflector, frontmatter + budget feedback, global-skills layer). Ships with a full CI/CD pipeline (Node 22/24 × Linux/macOS/Windows) and release automation (auto-tag + GitHub Release + release-time smoke test).",
|
|
8
|
-
"version": "1.
|
|
8
|
+
"version": "1.16.0"
|
|
9
9
|
},
|
|
10
10
|
"plugins": [
|
|
11
11
|
{
|
|
12
12
|
"name": "get-design-done",
|
|
13
13
|
"source": "./",
|
|
14
14
|
"description": "Agent-orchestrated 5-stage design pipeline: Brief → Explore → Plan → Design → Verify. 22+ specialized agents, 9 connections (Figma, Refero, Preview, Storybook, Chromatic, Figma Writer, Graphify, Pinterest, Claude Design), Claude Design handoff, bidirectional Figma write-back, and a queryable intel store (.design/intel/) for dependency and learnings queries. Standalone commands: style, darkmode, compare, figma-write, graphify, handoff, analyze-dependencies, skill-manifest, extract-learnings. Embeds NNG heuristics, WCAG thresholds, typographic systems, motion framework, and anti-pattern catalog. Ships with a full CI/CD pipeline (Node 22/24 × Linux/macOS/Windows) and release automation. Optimization layer (v1.0.4.1, retroactive): gdd-router + gdd-cache-manager skills, PreToolUse budget-enforcer hook, tier-aware agent frontmatter, lazy checker gates, streaming synthesizer, /gdd:warm-cache + /gdd:optimize commands, and cost telemetry at .design/telemetry/costs.jsonl — targeting 50-70% per-task token-cost reduction with no quality-floor regression.",
|
|
15
|
-
"version": "1.
|
|
15
|
+
"version": "1.16.0",
|
|
16
16
|
"author": {
|
|
17
17
|
"name": "hegemonart"
|
|
18
18
|
},
|
|
@@ -61,7 +61,9 @@
|
|
|
61
61
|
"schema-validation",
|
|
62
62
|
"cost-optimization",
|
|
63
63
|
"cache-aware",
|
|
64
|
-
"budget"
|
|
64
|
+
"budget",
|
|
65
|
+
"component-specs",
|
|
66
|
+
"design-system-benchmarks"
|
|
65
67
|
]
|
|
66
68
|
}
|
|
67
69
|
]
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "get-design-done",
|
|
3
3
|
"short_name": "gdd",
|
|
4
|
-
"version": "1.
|
|
4
|
+
"version": "1.16.0",
|
|
5
5
|
"description": "Agent-orchestrated 5-stage design pipeline: Brief → Explore → Plan → Design → Verify. 22+ specialized agents, 9 connections (Figma, Refero, Preview, Storybook, Chromatic, Figma Writer, Graphify, Pinterest, Claude Design), handoff-first workflow via Claude Design bundles, bidirectional Figma write-back (annotations, Code Connect), queryable intel store (`.design/intel/`) for O(1) design surface lookups, and self-improvement loop (reflector agent, frontmatter + budget feedback, global-skills layer at `~/.claude/gdd/global-skills/`). Standalone commands: style, darkmode, compare, figma-write, graphify, handoff, analyze-dependencies, skill-manifest, extract-learnings, reflect, apply-reflections. Embeds NNG heuristics, WCAG thresholds, typographic systems, motion framework, and anti-pattern catalog. Ships with a full CI/CD pipeline (Node 22/24 × Linux/macOS/Windows, lint + schema + frontmatter + stale-ref + shellcheck + gitleaks + injection-scan + blocking size-budget) and release automation (auto-tag + GitHub Release + release-time smoke test). Optimization layer (v1.0.4.1, retroactive): gdd-router + gdd-cache-manager skills, PreToolUse budget-enforcer hook, tier-aware agent frontmatter, lazy checker gates, streaming synthesizer, /gdd:warm-cache + /gdd:optimize commands, and cost telemetry at .design/telemetry/costs.jsonl — targeting 50-70% per-task token-cost reduction with no quality-floor regression.",
|
|
6
6
|
"author": {
|
|
7
7
|
"name": "hegemonart",
|
|
@@ -53,10 +53,20 @@
|
|
|
53
53
|
"cost-optimization",
|
|
54
54
|
"cache-aware",
|
|
55
55
|
"budget",
|
|
56
|
-
"
|
|
57
|
-
"
|
|
58
|
-
"
|
|
59
|
-
"
|
|
56
|
+
"iconography",
|
|
57
|
+
"brand-voice",
|
|
58
|
+
"performance-budget",
|
|
59
|
+
"framer-motion",
|
|
60
|
+
"motion-design",
|
|
61
|
+
"micro-polish",
|
|
62
|
+
"surfaces",
|
|
63
|
+
"make-interfaces-feel-better",
|
|
64
|
+
"palette-catalog",
|
|
65
|
+
"style-vocabulary",
|
|
66
|
+
"industry-palettes",
|
|
67
|
+
"ui-style-vocabulary",
|
|
68
|
+
"component-specs",
|
|
69
|
+
"design-system-benchmarks"
|
|
60
70
|
],
|
|
61
71
|
"skills": ["./skills/"]
|
|
62
72
|
}
|
package/CHANGELOG.md
CHANGED
|
@@ -4,6 +4,103 @@ All notable changes to get-design-done are documented here. Versions follow [sem
|
|
|
4
4
|
|
|
5
5
|
---
|
|
6
6
|
|
|
7
|
+
## [1.16.0] — 2026-04-24
|
|
8
|
+
|
|
9
|
+
### Added — Component Benchmark Corpus: Tooling + Waves 1–2 (15 specs)
|
|
10
|
+
|
|
11
|
+
This release builds the infrastructure to harvest per-component design knowledge from 18 design systems and ships 15 canonical component specs at `reference/components/`. Every spec follows a locked shape — Purpose · Anatomy · Variants · States · Sizing · Typography · Keyboard & a11y · Motion · Do/Don't · Anti-patterns · Citations · Grep signatures — making the corpus greppable, diffable, and agent-consumable.
|
|
12
|
+
|
|
13
|
+
#### Tooling
|
|
14
|
+
|
|
15
|
+
- **`agents/component-benchmark-harvester.md`** — given a component name, harvests per-source excerpts from 18 design systems (see `connections/design-corpora.md`), consumes Phase 15 impeccable salvage, emits raw harvest to `.planning/benchmarks/raw/<component>.md` with source-attributed excerpts and convergence pre-analysis.
|
|
16
|
+
- **`agents/component-benchmark-synthesizer.md`** — reads the raw harvest and emits a canonical `reference/components/<name>.md` using the locked TEMPLATE.md shape. Convergence analysis is explicit: NORM (≥4 systems agree) vs. DIVERGE (systems disagree with rationale).
|
|
17
|
+
- **`skills/benchmark/SKILL.md`** — new `/gdd:benchmark` command with 4 modes: `<component>` (single), `--wave <N>` (full wave), `--list` (coverage table), `--refresh <component>` (re-harvest on design-system version bump).
|
|
18
|
+
- **`connections/design-corpora.md`** — 18-system catalog with canonical URLs, licensing/attribution notes, and fallback chain (canonical → archive.org → Refero MCP → Pinterest MCP).
|
|
19
|
+
- **`reference/components/TEMPLATE.md`** — locked 12-section spec shape. All future component specs must conform.
|
|
20
|
+
- **`reference/components/README.md`** — corpus index with category tables (Wave 1–5) and coverage summary.
|
|
21
|
+
|
|
22
|
+
#### Wave 1 — Inputs (8 specs)
|
|
23
|
+
|
|
24
|
+
- **`reference/components/button.md`** — primary/secondary/ghost/destructive/icon-only variants, 96% press scale norm, WAI-ARIA button keyboard contract, `transition:all` BAN, non-descriptive-label anti-pattern.
|
|
25
|
+
- **`reference/components/input.md`** — text/search/password/number, placeholder-as-label anti-pattern, floating vs. static label trade-off (static preferred), `aria-describedby` error linking, WAI-ARIA textbox contract.
|
|
26
|
+
- **`reference/components/select-combobox.md`** — native vs. custom decision tree, WAI-ARIA listbox + combobox contracts (verbatim), `aria-activedescendant` pattern, multi-select approaches, virtualised list note, async empty state.
|
|
27
|
+
- **`reference/components/checkbox.md`** — binary/indeterminate states, `fieldset`+`legend` group requirement, `.indeterminate` JS property, WAI-ARIA checkbox contract.
|
|
28
|
+
- **`reference/components/radio.md`** — arrow-key auto-advance behavior, Tab-as-group-unit pattern, single-radio anti-pattern, WAI-ARIA radiogroup contract.
|
|
29
|
+
- **`reference/components/switch.md`** — switch vs. checkbox semantic distinction (`role="switch"` not `role="checkbox"`), spring thumb animation, pill track (`border-radius: 9999px`), immediate-action rule.
|
|
30
|
+
- **`reference/components/link.md`** — link vs. button semantic boundary, underline requirement for inline links (WCAG 1.4.1), external-link disclosure, `rel="noopener noreferrer"`, non-descriptive link text anti-pattern.
|
|
31
|
+
- **`reference/components/label.md`** — four association methods ranked (`<label for>` → `aria-labelledby` → `aria-label` → `<legend>`), `.sr-only` CSS pattern, legend-for-groups rule, placeholder failure analysis.
|
|
32
|
+
|
|
33
|
+
#### Wave 2 — Containers (7 specs)
|
|
34
|
+
|
|
35
|
+
- **`reference/components/card.md`** — stretched-link pattern for nested interactivity, `<article>` vs `<div>` semantics, elevated/outlined/clickable variants, `aria-busy` skeleton state.
|
|
36
|
+
- **`reference/components/modal-dialog.md`** — focus trap, Escape contract, portal rendering, `aria-modal`+`aria-labelledby` requirement, `role="alertdialog"` for confirmations, scroll-lock, focus return on close.
|
|
37
|
+
- **`reference/components/drawer.md`** — focus trap (same as modal), swipe-to-close for bottom sheet, side direction routing, nav drawer vs. content drawer role distinction, slide-in motion.
|
|
38
|
+
- **`reference/components/popover.md`** — Floating UI positioning (flip+shift+arrow middlewares), non-modal vs. modal distinction, `aria-expanded`+`aria-controls` trigger contract, `role="tooltip"` on interactive content anti-pattern.
|
|
39
|
+
- **`reference/components/tooltip.md`** — no-interactive-content rule, hover+focus trigger (not hover-only), Escape dismiss, 300ms delay, `aria-describedby` contract, tooltip vs. popover boundary.
|
|
40
|
+
- **`reference/components/accordion.md`** — `h2`–`h6` header requirement, `aria-expanded`-on-trigger rule, `grid-template-rows` CSS height animation trick, `role="region"` landmark note (skip if >6 items).
|
|
41
|
+
- **`reference/components/tabs.md`** — roving tabindex pattern, arrow-key navigation (not Tab), automatic vs. manual activation modes, tablist label requirement, `hidden` on inactive panels.
|
|
42
|
+
|
|
43
|
+
---
|
|
44
|
+
|
|
45
|
+
## [1.15.0] — 2026-04-24
|
|
46
|
+
|
|
47
|
+
### Added — Design Knowledge Expansion: 10 foundational references + MIFB micro-polish + UUPM ingest
|
|
48
|
+
|
|
49
|
+
This release closes the plugin's shallow-coverage gaps across iconography, performance, brand voice, visual hierarchy, Gestalt principles, design-system governance, and adds two new UUPM-sourced knowledge bases (palette catalog + style vocabulary). It also lands the complete MIT-licensed MIFB (make-interfaces-feel-better) micro-polish track.
|
|
50
|
+
|
|
51
|
+
#### Impeccable removal
|
|
52
|
+
|
|
53
|
+
All `impeccable-*` skill coupling removed from the plugin. References in `reference/checklists.md` and `reference/review-format.md` replaced with native GDD equivalents (`DESIGN-CONTEXT.md`, `/gdd:fast`, `design:design-critique`). Salvage archive at `.planning/research/impeccable-salvage/` for Phase 16.
|
|
54
|
+
|
|
55
|
+
#### 10 new foundational reference files
|
|
56
|
+
|
|
57
|
+
- **`reference/iconography.md`** — Optical sizing, stroke-weight rules, metaphor taxonomy (functional/status/nav/brand), dark-mode variants, icon animation guidelines, semantic vs. decorative labeling, touch-target pairing, catalog of 9 public icon libraries (Lucide, Phosphor, Heroicons, Radix Icons, Tabler, Iconoir, Remix, SF Symbols, Feather). Metaphor taxonomy absorbs UUPM `icons.csv` (MIT).
|
|
58
|
+
- **`reference/performance.md`** — Core Web Vitals targets by project type (SaaS/marketing/e-commerce/docs/dashboards), LCP/INP/CLS/TTFB budgets, critical CSS, image budgets, animation frame budget (16.67ms), JS bundle budgets (<170KB gzipped), font budgets, Lighthouse CI hookup. React runtime section absorbs UUPM `react-performance.csv` (MIT).
|
|
59
|
+
- **`reference/design-systems-catalog.md`** — Quick-reference index of 18 major design systems: Material 3, Apple HIG, Radix+WAI-ARIA, shadcn/ui, Polaris, Carbon, Fluent 2, Primer, Atlassian, Ant Design, Mantine, Chakra, Base Web, Nord, Spectrum, Lightning, Evergreen, Gestalt (Pinterest).
|
|
60
|
+
- **`reference/brand-voice.md`** — 5 voice axes (Formal↔Casual, Serious↔Playful, Expert↔Approachable, Reverent↔Irreverent, Authoritative↔Collaborative), 12 Jungian archetypes + 6 design-register variants, tone-by-context table (8 contexts), 20+ industry-vertical context table. Industry-context absorbs UUPM `products.csv` + `ui-reasoning.csv` (MIT).
|
|
61
|
+
- **`reference/visual-hierarchy-layout.md`** — Z-order/depth cues, whitespace principles, asymmetry/rhythm, compositional grids (4/8/12/16-col), figure-ground, reading-order patterns (F/Z/inverted-triangle), progressive disclosure. Landing-archetypes subsection absorbs UUPM `landing.csv` (24 patterns, MIT).
|
|
62
|
+
- **`reference/gestalt.md`** — All 8 Gestalt principles (Proximity, Similarity, Continuity, Closure, Figure-Ground, Common Fate, Common Region, Prägnanz), each with definition, design application, scoring rubric, and CSS grep signatures. UUPM `ux-guidelines.csv` deduped across gestalt/heuristics/anti-patterns/priority-matrix (MIT).
|
|
63
|
+
- **`reference/design-system-guidance.md`** — Token versioning/deprecation, multi-brand token architecture (base/semantic/component layers), platform translation (Style Dictionary/Tokens Studio/Terrazzo), governance/RFC model, documentation standard, maturity rubric levels 0–5.
|
|
64
|
+
- **`reference/framer-motion-patterns.md`** — Spring vs. tween config, AnimatePresence (including `initial={false}` rule), layout animations, variants+staggering, gesture motion (`whileHover`, `whileTap` canonical 0.96), scroll-linked animations, `prefers-reduced-motion` compliance, 60fps GPU-safe property rules, MotionConfig, common pitfalls. UUPM `stacks/react.csv` framer rows absorbed (MIT).
|
|
65
|
+
- **`reference/palette-catalog.md`** — 40+ industry-vertical color palettes with 12 semantic token roles each, all WCAG 4.5:1 body / 3:1 UI verified. Data sibling at `reference/data/palettes.csv`. UUPM `colors.csv` absorbed (MIT).
|
|
66
|
+
- **`reference/style-vocabulary.md`** — 38+ named UI aesthetics (Glassmorphism, Brutalism, Neumorphism, Bento, Claymorphism, Aurora, AI-Native, Swiss Modernism 2.0, Vaporwave, Editorial Grid, HUD/Sci-Fi FUI, and more) with keywords, signature effects, best-for, avoid-for, era. Data sibling at `reference/data/styles.csv`. UUPM `styles.csv` absorbed (MIT).
|
|
67
|
+
|
|
68
|
+
#### MIFB micro-polish track
|
|
69
|
+
|
|
70
|
+
Source: [jakub.kr/writing/details-that-make-interfaces-feel-better](https://jakub.kr/writing/details-that-make-interfaces-feel-better) (MIT, Jakub Krehel)
|
|
71
|
+
|
|
72
|
+
- **`reference/surfaces.md`** (new) — Concentric radius formula (`outerRadius = innerRadius + padding`), optical alignment offsets, 3-layer shadow system (exact `rgba` values), image outline rule (pure black/white opacity only), hit-area `::after` pseudo-element pattern.
|
|
73
|
+
- **`reference/typography.md`** extended — `text-wrap: balance` (headings, ≤6 lines Chromium), `text-wrap: pretty` (body/captions), `-webkit-font-smoothing: antialiased` at `:root` only, `font-variant-numeric: tabular-nums` for dynamic numerals. UUPM `typography.csv` (57 pairings) absorbed into expanded pairings catalog (MIT). `reference/data/google-fonts.csv` registered as data sibling.
|
|
74
|
+
- **`reference/motion.md`** extended — 6 new subsections: interruptible animations (transitions vs. keyframes decision table), split-and-stagger enter/exit pattern, contextual icon cross-fade (canonical `scale 0.25→1`, `opacity 0→1`, `blur 4→0`, `bounce: 0`), scale-on-press canonical `0.96`, `<AnimatePresence initial={false}>` rule, `will-change` GPU-compositable property table.
|
|
75
|
+
- **`reference/anti-patterns.md`** — 4 new BAN entries: BAN-10 same-radius-nested, BAN-11 tinted image outline, BAN-12 `transition: all`, BAN-13 `will-change: all`. Each with grep signature and fix pointer.
|
|
76
|
+
- **`reference/checklists.md`** — New "Micro-polish check" gate (14 items across typography/surfaces/motion). `scale(0.97)` mention reconciled to canonical `0.96`.
|
|
77
|
+
|
|
78
|
+
#### ⚠️ BREAKING — 7th audit pillar: Micro-polish (weight redistribution)
|
|
79
|
+
|
|
80
|
+
A new **Micro-polish** pillar (5%) has been added to `reference/audit-scoring.md`. Weight was redistributed from the Anti-Pattern Compliance pillar (10% → 5%). **Total remains 100%, but per-pillar weights changed.** Cross-cycle score comparisons that mix v1.14.x and v1.15.0 audit reports should account for this weight shift.
|
|
81
|
+
|
|
82
|
+
#### Mapper extensions
|
|
83
|
+
|
|
84
|
+
All four mapper agents (`motion-mapper`, `token-mapper`, `visual-hierarchy-mapper`, `a11y-mapper`) gain "Micro-polish findings" output sections with grep-driven detection of BAN-10/11/12/13 and MIFB rule violations.
|
|
85
|
+
|
|
86
|
+
#### Agent integrations
|
|
87
|
+
|
|
88
|
+
- `design-context-builder` — reads `brand-voice.md` for archetype resolution, `palette-catalog.md` for palette proposal, `style-vocabulary.md` for style-direction picker.
|
|
89
|
+
- `design-auditor` — reads `iconography.md`, `performance.md`, `gestalt.md`, `framer-motion-patterns.md`, `surfaces.md`; includes 7th pillar micro_polish in output schema.
|
|
90
|
+
- `design-executor` — reads `brand-voice.md` (type:copy), `design-system-guidance.md` (type:tokens), `framer-motion-patterns.md` (type:motion), `performance.md` (type:layout).
|
|
91
|
+
- `design-pattern-mapper` — extended with `iconography-system` and `brand-voice` categories.
|
|
92
|
+
- `design-verifier` — micro_polish added as supplemental dimension.
|
|
93
|
+
|
|
94
|
+
#### Attribution
|
|
95
|
+
|
|
96
|
+
- Jakub Krehel (MIT) — micro-polish rules in typography.md, surfaces.md, motion.md, anti-patterns.md BAN-10/11/12/13, checklists.md Micro-polish gate.
|
|
97
|
+
- nextlevelbuilder/ui-ux-pro-max-skill v2.5.0 (MIT) — data snapshot ingested into iconography, performance, brand-voice, visual-hierarchy-layout, typography, framer-motion-patterns, palette-catalog, style-vocabulary, gestalt/heuristics/anti-patterns/priority-matrix dedup. **One-shot snapshot — no live re-sync contract.**
|
|
98
|
+
|
|
99
|
+
#### UUPM deferrals (explicitly routed, not discarded)
|
|
100
|
+
|
|
101
|
+
- `charts.csv` → Phase 19 `reference/data-visualization.md`
|
|
102
|
+
- `app-interface.csv` → Phase 17 component-corpus authoring
|
|
103
|
+
- `stacks/*.csv` (14 non-React) → future stack-playbook phase
|
|
7
104
|
## [1.14.8] — 2026-04-24
|
|
8
105
|
|
|
9
106
|
### Added — Phase 14.7 First-Run Proof Path
|
package/README.md
CHANGED
|
@@ -76,6 +76,13 @@ You don't need to be a designer. The pipeline carries the design expertise so yo
|
|
|
76
76
|
|
|
77
77
|
Built-in quality gates catch real problems: Handoff Faithfulness scoring on Claude Design bundles, contrast audits across the full palette × surface matrix, anti-pattern detection from the NNG catalog, dark-mode architecture verification, and motion-system consistency checks.
|
|
78
78
|
|
|
79
|
+
### v1.15.0 Highlights — Design Knowledge Expansion
|
|
80
|
+
|
|
81
|
+
- **10 new foundational references** — `iconography.md`, `performance.md`, `brand-voice.md`, `visual-hierarchy-layout.md`, `gestalt.md`, `design-system-guidance.md`, `design-systems-catalog.md`, `framer-motion-patterns.md`, `palette-catalog.md`, `style-vocabulary.md`. Agents now have authoritative answers on icon sizing, Web Vitals budgets, brand voice axes, Gestalt principles, DS governance, and 40+ industry-vertical color palettes.
|
|
82
|
+
- **MIFB micro-polish track** — MIT content from [Jakub Krehel](https://jakub.kr/writing/details-that-make-interfaces-feel-better): new `reference/surfaces.md` (concentric radius, 3-layer shadow), `text-wrap: balance/pretty`, canonical press scale `0.96`, `AnimatePresence initial={false}`, `bounce: 0` icon cross-fade, and 4 new BAN entries. All four mapper agents gain "Micro-polish findings" detection. New 7th audit pillar: **Micro-polish** (5%).
|
|
83
|
+
- **UUPM data ingest** — One-shot MIT snapshot from [nextlevelbuilder/ui-ux-pro-max-skill](https://github.com/nextlevelbuilder/ui-ux-pro-max-skill) v2.5.0: icon metaphor taxonomy, React perf heuristics, 20+ industry verticals, 24 landing-page archetypes, 57 font pairings, 40+ WCAG-verified palettes, 38+ UI aesthetic styles — all rewritten in GDD voice.
|
|
84
|
+
- **⚠️ Breaking** — 7th audit pillar changes Anti-Pattern Compliance weight (10%→5%). Cross-cycle score comparisons spanning v1.14.x and v1.15.0 should account for this weight shift.
|
|
85
|
+
|
|
79
86
|
### v1.14.0 Highlights
|
|
80
87
|
|
|
81
88
|
- **AI-native canvas tools** — paper.design (MCP canvas read/write, screenshot verification) and pencil.dev (git-tracked `.pen` spec files, no MCP required) complete a full canvas→code→verify→canvas round-trip.
|
|
@@ -382,6 +389,29 @@ After each design cycle, `/gdd:reflect` reads `.design/learnings/`, `.design/tel
|
|
|
382
389
|
|
|
383
390
|
---
|
|
384
391
|
|
|
392
|
+
## Component Benchmark Corpus
|
|
393
|
+
|
|
394
|
+
Per-component design specifications harvested from 18 major design systems and synthesized into a locked, agent-consumable format. Every spec is ≤350 lines, greppable, diff-friendly, and cross-linked to `reference/anti-patterns.md`.
|
|
395
|
+
|
|
396
|
+
**Wave 1 — Inputs (v1.16.0)**: Button · Input · Select/Combobox · Checkbox · Radio · Switch · Link · Label
|
|
397
|
+
|
|
398
|
+
**Wave 2 — Containers (v1.16.0)**: Card · Modal/Dialog · Drawer/Sheet · Popover · Tooltip · Accordion · Tabs
|
|
399
|
+
|
|
400
|
+
**Wave 3–5 — Feedback, Navigation, Data** (Phase 17): Toast · Alert · Progress · Skeleton · Badge · Chip · Breadcrumb · Pagination · Stepper · Table/Grid · Date Picker · File Upload · Rich Text · Virtualized List
|
|
401
|
+
|
|
402
|
+
Each spec includes: WAI-ARIA keyboard contracts (verbatim), convergence analysis (NORM = ≥4 systems agree · DIVERGE = systems differ), grep signatures for CI detection, and a failing-example block.
|
|
403
|
+
|
|
404
|
+
```bash
|
|
405
|
+
/gdd:benchmark button # harvest + synthesize a single spec
|
|
406
|
+
/gdd:benchmark --wave 1 # run all Wave 1 specs
|
|
407
|
+
/gdd:benchmark --list # coverage table
|
|
408
|
+
/gdd:benchmark --refresh modal-dialog # re-harvest after design-system update
|
|
409
|
+
```
|
|
410
|
+
|
|
411
|
+
Sources: `connections/design-corpora.md` — Material 3, Apple HIG, Radix, WAI-ARIA APG, shadcn/ui, Polaris, Carbon, Fluent 2, Primer, Atlassian, Ant Design, Mantine, Chakra, Base Web, Nord, Spectrum, Lightning, Gestalt (Pinterest).
|
|
412
|
+
|
|
413
|
+
---
|
|
414
|
+
|
|
385
415
|
## Authority Watcher
|
|
386
416
|
|
|
387
417
|
Subscribe to a curated whitelist of design-authority sources, diff it against a snapshot, and feed only genuinely new, classified entries into the Self-Improvement reflector. Authority monitoring — not trend watching.
|
package/SKILL.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
name: get-design-done
|
|
3
3
|
short_name: gdd
|
|
4
4
|
description: "Master design pipeline for Claude Code. 5-stage workflow: Brief → Explore → Plan → Design → Verify. Run 'brief' first in any new project to capture the design problem, then 'explore' to inventory the codebase and interview for context. Invoke without arguments for status and auto-routing."
|
|
5
|
-
argument-hint: "[brief|explore|plan|design|verify|handoff|map|next|help|status|style|darkmode|compare|figma-write|graphify|discuss|list-assumptions|progress|health|todo|stats|note|plant-seed|add-backlog|review-backlog|scan|discover|settings|update|reapply-patches|audit|pause|resume|new-cycle|debug|quick|new-project|complete-cycle|fast|do|ship|undo|pr-branch|sketch|sketch-wrap-up|spike|spike-wrap-up|reflect|apply-reflections|analyze-dependencies|extract-learnings|skill-manifest|warm-cache|optimize|cache-manager|watch-authorities|check-update]"
|
|
5
|
+
argument-hint: "[brief|explore|plan|design|verify|handoff|map|next|help|status|style|darkmode|compare|figma-write|graphify|discuss|list-assumptions|progress|health|todo|stats|note|plant-seed|add-backlog|review-backlog|scan|discover|settings|update|reapply-patches|audit|pause|resume|new-cycle|debug|quick|new-project|complete-cycle|fast|do|ship|undo|pr-branch|sketch|sketch-wrap-up|spike|spike-wrap-up|reflect|apply-reflections|analyze-dependencies|extract-learnings|skill-manifest|warm-cache|optimize|cache-manager|watch-authorities|check-update|benchmark]"
|
|
6
6
|
user-invocable: true
|
|
7
7
|
---
|
|
8
8
|
|
|
@@ -85,6 +85,8 @@ Each stage produces artifacts in `.design/` inside the current project.
|
|
|
85
85
|
| `extract-learnings [--cycle <slug>]` | `get-design-done:extract-learnings` | Extract decisions, lessons, patterns, and surprises from a completed cycle → `.design/cycles/<slug>/LEARNINGS.md` |
|
|
86
86
|
| `skill-manifest [--refresh]` | `get-design-done:skill-manifest` | List or refresh the local skill manifest used by the router for discovery |
|
|
87
87
|
| `watch-authorities [--refresh] [--since <date>] [--feed <name>] [--schedule <cadence>]` | `get-design-done:gdd-watch-authorities` | Run design-authority-watcher — fetch curated feeds, diff snapshot, classify new entries → `.design/authority-report.md` (consumed by `/gdd:reflect`) |
|
|
88
|
+
| `benchmark <component\|--wave N\|--list\|--refresh component>` | `get-design-done:gdd-benchmark` | Harvest + synthesize per-component design specs from 18 design systems → `reference/components/<name>.md` |
|
|
89
|
+
| `benchmark <component\|--wave N\|--list\|--refresh component>` | `get-design-done:gdd-benchmark` | Harvest + synthesize per-component design specs from 18 design systems → `reference/components/<name>.md` |
|
|
88
90
|
|
|
89
91
|
## Handoff Routing
|
|
90
92
|
|
|
@@ -203,6 +205,7 @@ If `$ARGUMENTS` is a stage or command name — invoke it directly, no state chec
|
|
|
203
205
|
/gdd:reflect → Skill("get-design-done:gdd-reflect")
|
|
204
206
|
/gdd:apply-reflections → Skill("get-design-done:gdd-apply-reflections")
|
|
205
207
|
/gdd:watch-authorities → Skill("get-design-done:gdd-watch-authorities")
|
|
208
|
+
/gdd:benchmark → Skill("get-design-done:gdd-benchmark")
|
|
206
209
|
/gdd:pause → Skill("get-design-done:gdd-pause")
|
|
207
210
|
/gdd:resume → Skill("get-design-done:gdd-resume")
|
|
208
211
|
# --- Lifecycle ---
|
package/agents/a11y-mapper.md
CHANGED
|
@@ -109,6 +109,31 @@ scope: static-only
|
|
|
109
109
|
|
|
110
110
|
## Scope note
|
|
111
111
|
Static scan only. Runtime contrast, focus-trap, and screen-reader behavior require a live audit (Phase 8).
|
|
112
|
+
|
|
113
|
+
## Micro-polish a11y findings
|
|
114
|
+
|
|
115
|
+
After the standard accessibility map, scan and report:
|
|
116
|
+
|
|
117
|
+
1. **Interactive elements visually < 40×40 without hit-area extension**
|
|
118
|
+
- Grep: `<button`, `<a`, elements with `onClick` where width/height classes suggest small size (e.g., `w-4 h-4`, `w-5 h-5`, `w-6 h-6`) without `::after` pseudo-element or explicit padding expansion
|
|
119
|
+
- Fix: add `::after { content:''; position:absolute; inset:-10px }` to reach 40×40 minimum
|
|
120
|
+
- This pairs with existing WCAG touch-target check but adds the concrete `::after` fix pointer
|
|
121
|
+
|
|
122
|
+
2. **Icon buttons without expanded click area**
|
|
123
|
+
- Grep: `<button[^>]*>` containing only an `<svg>` or icon component with small container size
|
|
124
|
+
- Flag if no `p-2` or larger padding that would expand the hit area
|
|
125
|
+
- Fix: add `p-2` (8px each side) to 24px icon → 40px total; or use `::after` pattern
|
|
126
|
+
|
|
127
|
+
### Output format:
|
|
128
|
+
```
|
|
129
|
+
## Micro-polish a11y findings
|
|
130
|
+
|
|
131
|
+
| Finding | File | Line | Element | Measured Size | Fix |
|
|
132
|
+
|---------|------|------|---------|---------------|-----|
|
|
133
|
+
| small-hit-area | ... | ... | IconButton (close) | 20×20px | Add p-2 padding or ::after inset:-10px |
|
|
134
|
+
|
|
135
|
+
Total: N findings. (0 = clean)
|
|
136
|
+
```
|
|
112
137
|
```
|
|
113
138
|
|
|
114
139
|
## Constraints
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: component-benchmark-harvester
|
|
3
|
+
description: Given a component name, harvests design-system excerpts from 18 sources (design-corpora.md) and emits raw, source-attributed output to .planning/benchmarks/raw/<component>.md. Spawned by /gdd:benchmark.
|
|
4
|
+
tools: Read, Write, WebFetch, Bash, Grep, Glob
|
|
5
|
+
color: yellow
|
|
6
|
+
default-tier: sonnet
|
|
7
|
+
tier-rationale: "Network fetch + multi-source synthesis is open-ended; Haiku misses cross-system nuance, Opus overkill for structured harvesting."
|
|
8
|
+
parallel-safe: conditional-on-touches
|
|
9
|
+
typical-duration-seconds: 120
|
|
10
|
+
reads-only: false
|
|
11
|
+
writes:
|
|
12
|
+
- ".planning/benchmarks/raw/"
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
@reference/shared-preamble.md
|
|
16
|
+
|
|
17
|
+
# component-benchmark-harvester
|
|
18
|
+
|
|
19
|
+
## Role
|
|
20
|
+
|
|
21
|
+
You are the harvesting agent for the component benchmark corpus. Given a component name
|
|
22
|
+
(e.g. "button", "modal-dialog"), you systematically gather per-source excerpts from the
|
|
23
|
+
18 design systems catalogued in `connections/design-corpora.md` and emit a consolidated
|
|
24
|
+
raw harvest file at `.planning/benchmarks/raw/<component>.md`.
|
|
25
|
+
|
|
26
|
+
The raw harvest is **input to `component-benchmark-synthesizer`** — it is not the final
|
|
27
|
+
spec. Focus on breadth and attribution; the synthesizer does convergence analysis.
|
|
28
|
+
|
|
29
|
+
## Required Reading
|
|
30
|
+
|
|
31
|
+
The orchestrating skill supplies a `<required_reading>` block in the prompt. Read every
|
|
32
|
+
listed file before acting. Minimum expected inputs:
|
|
33
|
+
|
|
34
|
+
- `connections/design-corpora.md` — system catalog with URLs, licenses, fallback chain
|
|
35
|
+
- `.planning/research/impeccable-salvage/` — any files relevant to the target component
|
|
36
|
+
|
|
37
|
+
## Step 1 — Check impeccable salvage
|
|
38
|
+
|
|
39
|
+
Before any network fetch, `Grep` the impeccable salvage directory for the component name
|
|
40
|
+
(case-insensitive). Extract any relevant prose as the first source in the raw file.
|
|
41
|
+
|
|
42
|
+
## Step 2 — Fetch each design system
|
|
43
|
+
|
|
44
|
+
For each of the 18 systems in `design-corpora.md`:
|
|
45
|
+
|
|
46
|
+
1. Attempt `WebFetch` on `<canonical-url>/<component-slug>` (try common slug variants:
|
|
47
|
+
kebab-case, camelCase, plain name).
|
|
48
|
+
2. On fetch failure, try the fallback chain: archive.org → Refero MCP → Pinterest MCP.
|
|
49
|
+
3. Extract the relevant sections: anatomy, variants, states, a11y/keyboard, do/don't.
|
|
50
|
+
4. Note which fallback tier was used (if any).
|
|
51
|
+
|
|
52
|
+
**Prioritise signal over volume.** One precise quoted sentence beats three paraphrased
|
|
53
|
+
paragraphs. For WAI-ARIA APG keyboard contracts, quote verbatim.
|
|
54
|
+
|
|
55
|
+
## Step 3 — Write raw harvest file
|
|
56
|
+
|
|
57
|
+
Write `.planning/benchmarks/raw/<component>.md` with this structure:
|
|
58
|
+
|
|
59
|
+
```markdown
|
|
60
|
+
# <Component Name> — Raw Benchmark Harvest
|
|
61
|
+
|
|
62
|
+
Harvested: <ISO date>
|
|
63
|
+
Target: reference/components/<component>.md
|
|
64
|
+
|
|
65
|
+
## Convergence Notes (pre-synthesis)
|
|
66
|
+
|
|
67
|
+
_Fill in patterns you noticed while harvesting — what ≥4 systems agree on._
|
|
68
|
+
|
|
69
|
+
## Sources
|
|
70
|
+
|
|
71
|
+
### <System Name>
|
|
72
|
+
> Source: [<System Name>](<url>) — <license> — accessed <date>
|
|
73
|
+
> Source tier: canonical | archive.org | refero | pinterest
|
|
74
|
+
|
|
75
|
+
**Anatomy:** …
|
|
76
|
+
**Variants:** …
|
|
77
|
+
**States:** …
|
|
78
|
+
**Keyboard & a11y:** …
|
|
79
|
+
**Do/Don't:** …
|
|
80
|
+
|
|
81
|
+
### <next system>
|
|
82
|
+
…
|
|
83
|
+
```
|
|
84
|
+
|
|
85
|
+
One `###` section per source. Omit a source only if the fallback chain is fully
|
|
86
|
+
exhausted — document the failure with `**Status: unreachable**`.
|
|
87
|
+
|
|
88
|
+
## Step 4 — Convergence pre-analysis
|
|
89
|
+
|
|
90
|
+
After all sources, add a `## Convergence Notes (pre-synthesis)` summary identifying:
|
|
91
|
+
- What the majority of systems (≥4) agree on → mark `NORM`
|
|
92
|
+
- Where systems meaningfully diverge → mark `DIVERGE` with a brief note
|
|
93
|
+
|
|
94
|
+
This pre-analysis seeds the synthesizer's convergence analysis.
|
|
95
|
+
|
|
96
|
+
## Output Contract
|
|
97
|
+
|
|
98
|
+
- File: `.planning/benchmarks/raw/<component>.md`
|
|
99
|
+
- One `###` block per harvested source (≥4 blocks minimum for a useful spec)
|
|
100
|
+
- WAI-ARIA APG keyboard contracts quoted verbatim
|
|
101
|
+
- Convergence pre-analysis section present
|
|
102
|
+
|
|
103
|
+
## Completion Marker
|
|
104
|
+
|
|
105
|
+
End your response with:
|
|
106
|
+
|
|
107
|
+
```
|
|
108
|
+
## HARVEST COMPLETE
|
|
109
|
+
Component: <name>
|
|
110
|
+
Sources harvested: <N>
|
|
111
|
+
Raw file: .planning/benchmarks/raw/<component>.md
|
|
112
|
+
```
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: component-benchmark-synthesizer
|
|
3
|
+
description: Reads a raw harvest file from .planning/benchmarks/raw/<component>.md and emits a canonical component spec at reference/components/<name>.md using the locked TEMPLATE.md shape. Spawned by /gdd:benchmark after harvesting.
|
|
4
|
+
tools: Read, Write, Grep, Glob
|
|
5
|
+
color: green
|
|
6
|
+
default-tier: sonnet
|
|
7
|
+
tier-rationale: "Synthesis across ≥4 sources with explicit convergence analysis requires multi-step reasoning; Haiku loses cross-source nuance, Opus overkill for structured template fill."
|
|
8
|
+
parallel-safe: conditional-on-touches
|
|
9
|
+
typical-duration-seconds: 90
|
|
10
|
+
reads-only: false
|
|
11
|
+
writes:
|
|
12
|
+
- "reference/components/"
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
@reference/shared-preamble.md
|
|
16
|
+
|
|
17
|
+
# component-benchmark-synthesizer
|
|
18
|
+
|
|
19
|
+
## Role
|
|
20
|
+
|
|
21
|
+
You are the synthesis agent for the component benchmark corpus. You read a raw harvest
|
|
22
|
+
file at `.planning/benchmarks/raw/<component>.md` (produced by `component-benchmark-harvester`)
|
|
23
|
+
and emit a canonical component spec at `reference/components/<name>.md`, following
|
|
24
|
+
`reference/components/TEMPLATE.md` exactly.
|
|
25
|
+
|
|
26
|
+
Your primary intellectual task is **convergence analysis**: determine what the design
|
|
27
|
+
systems agree on (norms) vs. where they meaningfully diverge (trade-offs), and encode
|
|
28
|
+
that signal in the spec so future agents know what is non-negotiable.
|
|
29
|
+
|
|
30
|
+
## Required Reading
|
|
31
|
+
|
|
32
|
+
The orchestrating skill supplies a `<required_reading>` block in the prompt. Read every
|
|
33
|
+
listed file before acting. Minimum expected inputs:
|
|
34
|
+
|
|
35
|
+
- `.planning/benchmarks/raw/<component>.md` — the raw harvest to synthesize
|
|
36
|
+
- `reference/components/TEMPLATE.md` — the locked spec shape you must follow
|
|
37
|
+
- `reference/anti-patterns.md` — for cross-linking anti-pattern entries
|
|
38
|
+
|
|
39
|
+
## Convergence Analysis Rules
|
|
40
|
+
|
|
41
|
+
After reading all source sections from the raw file:
|
|
42
|
+
|
|
43
|
+
1. **Count agreement** — if ≥4 of the 18 systems agree on a property (anatomy element,
|
|
44
|
+
state name, keyboard key, constraint), mark it `**Norm** (≥N/18 systems agree)`.
|
|
45
|
+
2. **Flag divergence** — if systems meaningfully disagree on a property, mark it
|
|
46
|
+
`**Diverge** — <brief note on what differs and why>`.
|
|
47
|
+
3. **Do not invent** — if fewer than 2 sources mention a property, omit it from the spec
|
|
48
|
+
rather than guessing. The corpus is additive; gaps will be filled when more sources
|
|
49
|
+
are harvested.
|
|
50
|
+
|
|
51
|
+
## Output Rules
|
|
52
|
+
|
|
53
|
+
- Strictly follow `reference/components/TEMPLATE.md` — every section must be present,
|
|
54
|
+
in order, even if sparse.
|
|
55
|
+
- **Max 350 lines** — dense, diff-friendly, greppable. Extract verbose prose to
|
|
56
|
+
`reference/` cross-links rather than embedding it.
|
|
57
|
+
- **WAI-ARIA keyboard contract** — quote verbatim from WAI-ARIA APG source. Mark the
|
|
58
|
+
source attribution inline.
|
|
59
|
+
- **Failing-example block** — each spec must include a `## Failing Example` section
|
|
60
|
+
showing what a broken implementation looks like (missing a11y attribute, wrong role,
|
|
61
|
+
broken keyboard handler). Include at least one grep detection pattern:
|
|
62
|
+
```
|
|
63
|
+
# Grep: detect common failure
|
|
64
|
+
grep -r "pattern" src/
|
|
65
|
+
```
|
|
66
|
+
- **Benchmark citations** — every claim carries an inline citation: `(Material 3, Polaris)`
|
|
67
|
+
or `(WAI-ARIA APG §4.2)`.
|
|
68
|
+
|
|
69
|
+
## Output Path
|
|
70
|
+
|
|
71
|
+
Write the final spec to `reference/components/<name>.md` (kebab-case, matching the
|
|
72
|
+
component slug used in harvesting).
|
|
73
|
+
|
|
74
|
+
Update `reference/components/README.md`:
|
|
75
|
+
- Find the correct category section (Inputs / Containers / Feedback / Navigation / Advanced)
|
|
76
|
+
- Add a one-line entry: `| [Name](name.md) | <one-line purpose> | <anatomy snippet> |`
|
|
77
|
+
|
|
78
|
+
## Completion Marker
|
|
79
|
+
|
|
80
|
+
End your response with:
|
|
81
|
+
|
|
82
|
+
```
|
|
83
|
+
## SYNTHESIS COMPLETE
|
|
84
|
+
Component: <name>
|
|
85
|
+
Spec: reference/components/<name>.md
|
|
86
|
+
Lines: <N>
|
|
87
|
+
Systems cited: <N>
|
|
88
|
+
```
|