Design Craft Specialist
Intent-First design philosophy integrated into MoAI workflows. Ensures design decisions flow from intent and domain understanding, not from visual impulse.
Core Philosophy
Intent-First: Before any visual or component decision, establish why — the domain, the user, the interaction contract, and the craft principles that apply.
The three craft operations:
| Operation |
When |
What It Does |
| Design Direction |
At /moai plan (design keywords) |
Domain exploration, intent capture, vocabulary alignment |
| Design Audit |
At /moai review --design |
Checks implementation against .moai/design/system.md |
| Design Critique |
At /moai review --critique |
Post-build craft review: observe, diagnose, rebuild decision |
Module Index
modules/intent-first.md — Intent-First process: domain exploration, design direction, vocabularymodules/design-memory.md — .moai/design/system.md read/write protocolmodules/critique-workflow.md — Post-build critique: observe → diagnose → rebuild, hard rules and rejection criteriamodules/web-copy-craft.md — Web copy guidelines: anti-AI writing, headline formulas, CTA patterns, body copy rhythm
Quick Reference
Design Direction (plan phase)
When manager-spec detects design-relevant keywords, trigger Design Direction:
- Read
.moai/design/system.md (if it exists) for established vocabulary and intent
- Explore domain: What is the user doing? What is the mental model? What does success feel like?
- Define design intent in 1–3 sentences
- Identify 3–5 domain vocabulary terms
- Write design direction to
.moai/design/system.md
Design Audit (review phase)
When /moai review --design is invoked:
- Read
.moai/design/system.md for current design system rules
- Scan UI components against the rules
- Report violations with file:line references
- Suggest minimal fixes preserving existing structure
Design Critique (review phase)
When /moai review --critique is invoked:
- Observe: What does the built interface actually do? (not what it was supposed to do)
- Diagnose: Where does the implementation drift from intent?
- Decide: Patch (small drift) or rebuild (fundamental misalignment)
Web Copy Craft (run phase)
When expert-frontend or team-designer generates web pages, apply copy craft rules:
- Use headline formulas: Number Anchor, Reversal, Direct Question, Empathy Hook, Declaration
- Vary sentence rhythm — never three consecutive sentences with the same structure
- Replace vague intensifiers with specific facts (numbers, names, dates)
- Eliminate AI filler phrases ("In today's fast-paced world", "Unlock the potential")
- CTA buttons: verb-first, outcome-oriented, one per viewport
Works Well With
moai-domain-uiux — Design tokens, WCAG, accessibility (complementary, not overlapping)moai-design-tools — Figma/Pencil tool mechanics (complementary, not overlapping)moai-domain-frontend — Component implementation patterns
Version: 1.2.0
Last Updated: 2026-03-30
Common Rationalizations
| Rationalization |
Reality |
| "Design direction is just aesthetics, the code works the same" |
Design intent drives user perception and brand consistency. Code without design direction produces generic, forgettable interfaces. |
| "I will figure out the design vocabulary during implementation" |
Naming components without a design vocabulary produces inconsistent names. Establish vocabulary before building. |
| "Design memory is unnecessary, the design system is the reference" |
Design systems define what to use. Design memory captures why decisions were made and what was rejected. |
| "Post-build critique is just a formality" |
Critique reveals drift between intent and execution. Without it, the gap accumulates with each iteration. |
| "This is an internal tool, design does not matter" |
Internal users have the same cognitive load as external users. Poor design increases training cost and error rates. |
Red Flags
- Implementation diverges from stated design direction without documented reason
- Component naming inconsistent with established design vocabulary
- Design decisions made without referencing design memory or prior decisions
- No post-build critique performed after major UI implementation
- Brand voice or visual identity not consulted before UI copy changes
Verification
1---2name: moai-design-craft3description: Intent-First design craft specialist covering design direction, domain vocabulary, design memory, and post-build critique. Use when establishing design intent or auditing code against design principles.4license: Apache-2.05---6
7# Design Craft Specialist
8
9Intent-First design philosophy integrated into MoAI workflows. Ensures design decisions flow from intent and domain understanding, not from visual impulse.
10
11## Core Philosophy
12
13**Intent-First**: Before any visual or component decision, establish *why* — the domain, the user, the interaction contract, and the craft principles that apply.
14
15The three craft operations:
16
17| Operation | When | What It Does |
18|-----------|------|--------------|
19| Design Direction | At `/moai plan` (design keywords) | Domain exploration, intent capture, vocabulary alignment |
20| Design Audit | At `/moai review --design` | Checks implementation against `.moai/design/system.md` |
21| Design Critique | At `/moai review --critique` | Post-build craft review: observe, diagnose, rebuild decision |
22
23## Module Index
24
25- `modules/intent-first.md` — Intent-First process: domain exploration, design direction, vocabulary
26- `modules/design-memory.md` — `.moai/design/system.md` read/write protocol
27- `modules/critique-workflow.md` — Post-build critique: observe → diagnose → rebuild, hard rules and rejection criteria
28- `modules/web-copy-craft.md` — Web copy guidelines: anti-AI writing, headline formulas, CTA patterns, body copy rhythm
29
30## Quick Reference
31
32### Design Direction (plan phase)
33
34When manager-spec detects design-relevant keywords, trigger Design Direction:
35
361. Read `.moai/design/system.md` (if it exists) for established vocabulary and intent
372. Explore domain: What is the user doing? What is the mental model? What does success feel like?
383. Define design intent in 1–3 sentences
394. Identify 3–5 domain vocabulary terms
405. Write design direction to `.moai/design/system.md`
41
42### Design Audit (review phase)
43
44When `/moai review --design` is invoked:
45
461. Read `.moai/design/system.md` for current design system rules
472. Scan UI components against the rules
483. Report violations with file:line references
494. Suggest minimal fixes preserving existing structure
50
51### Design Critique (review phase)
52
53When `/moai review --critique` is invoked:
54
551. Observe: What does the built interface actually do? (not what it was supposed to do)
562. Diagnose: Where does the implementation drift from intent?
573. Decide: Patch (small drift) or rebuild (fundamental misalignment)
58
59### Web Copy Craft (run phase)
60
61When expert-frontend or team-designer generates web pages, apply copy craft rules:
62
631. Use headline formulas: Number Anchor, Reversal, Direct Question, Empathy Hook, Declaration
642. Vary sentence rhythm — never three consecutive sentences with the same structure
653. Replace vague intensifiers with specific facts (numbers, names, dates)
664. Eliminate AI filler phrases ("In today's fast-paced world", "Unlock the potential")
675. CTA buttons: verb-first, outcome-oriented, one per viewport
68
69## Works Well With
70
71- `moai-domain-uiux` — Design tokens, WCAG, accessibility (complementary, not overlapping)
72- `moai-design-tools` — Figma/Pencil tool mechanics (complementary, not overlapping)
73- `moai-domain-frontend` — Component implementation patterns
74
75---
76
77Version: 1.2.0
78Last Updated: 2026-03-30
79
80<!-- moai:evolvable-start id="rationalizations" -->
81## Common Rationalizations
82
83| Rationalization | Reality |
84|---|---|
85| "Design direction is just aesthetics, the code works the same" | Design intent drives user perception and brand consistency. Code without design direction produces generic, forgettable interfaces. |
86| "I will figure out the design vocabulary during implementation" | Naming components without a design vocabulary produces inconsistent names. Establish vocabulary before building. |
87| "Design memory is unnecessary, the design system is the reference" | Design systems define what to use. Design memory captures why decisions were made and what was rejected. |
88| "Post-build critique is just a formality" | Critique reveals drift between intent and execution. Without it, the gap accumulates with each iteration. |
89| "This is an internal tool, design does not matter" | Internal users have the same cognitive load as external users. Poor design increases training cost and error rates. |
90
91<!-- moai:evolvable-end -->
92
93<!-- moai:evolvable-start id="red-flags" -->
94## Red Flags
95
96- Implementation diverges from stated design direction without documented reason
97- Component naming inconsistent with established design vocabulary
98- Design decisions made without referencing design memory or prior decisions
99- No post-build critique performed after major UI implementation
100- Brand voice or visual identity not consulted before UI copy changes
101
102<!-- moai:evolvable-end -->
103
104<!-- moai:evolvable-start id="verification" -->
105## Verification
106
107- [ ] Design direction documented before implementation begins
108- [ ] Component names match the established design vocabulary
109- [ ] Design memory consulted for relevant prior decisions
110- [ ] Post-build critique completed comparing intent vs execution
111- [ ] Brand visual identity referenced in color, typography, and spacing choices
112
113<!-- moai:evolvable-end -->
gabrielmoreira