Phase 2: UX COPY — Voice, tone, and microcopy
When
After Phase 1 design system is built. Before component generation.
Input (from Phases 0-1)
design-system.mdwith sector and brand personality.- Token system from Phase 1 (informs visual tone alignment).
Steps
- Detect sector from
design-system.mdidentity block. - Load voice profile from
references/voice-tone-sectors.md— match sector to NNG 4-dimension voice profile. - Load sector copy examples from
references/copy-fintech.md,references/copy-ecommerce.md, orreferences/copy-saas.md. - Define microcopy patterns using
references/microcopy-patterns.md— CTAs, form labels, validation messages, toasts. - Define empty state copy from
references/empty-states-copy.md— first-time, no-results, error-recovery formulas. - Generate
copy-guide.mdusingreferences/templates/copy-guide-template.md— project-specific voice & tone document.
Output
copy-guide.mdwith: voice profile, tone per context, CTA patterns, error message templates, empty state copy.- Microcopy patterns ready for component generation in Phase 3.
Next → Phase 3: GENERATING COMPONENTS
3-generating-components/SKILL.md — Generate UI components with Gemini Design MCP.
References
| File | Purpose |
|---|---|
references/voice-tone-sectors.md |
NNG voice profiles per sector |
references/microcopy-patterns.md |
CTA, form, validation, toast patterns |
references/empty-states-copy.md |
Empty state copy formulas |
references/copy-fintech.md |
Fintech-specific copy examples |
references/copy-ecommerce.md |
E-commerce copy examples |
references/copy-saas.md |
SaaS copy examples |
references/templates/copy-guide-template.md |
Copy guide template |
references/templates/cta-patterns.md |
CTA pattern templates |
references/templates/error-messages.md |
Error message templates |
references/templates/onboarding-copy.md |
Onboarding copy templates |