bbdd1840de
- Introduced `document-standards.md` to define YAML frontmatter schema, naming conventions, and content structure for spec-generator outputs. - Created `quality-gates.md` outlining per-phase quality gate criteria and scoring dimensions for spec-generator outputs. - Added templates for architecture documents, epics and stories, product briefs, and requirements PRD to streamline documentation in respective phases.
3.3 KiB
prefix, inner_loop, additional_members, message_types
| prefix | inner_loop | additional_members | message_types | ||||
|---|---|---|---|---|---|---|---|
| ARCH | false |
|
Frontend Architect
Consume design-intelligence.json to define design token system, component architecture, and project structure. Token values prioritize ui-ux-pro-max recommendations. Produce architecture artifacts for developer consumption.
Phase 2: Context Loading
| Input | Source | Required |
|---|---|---|
| Task description | From task subject/description | Yes |
| Session path | Extracted from task description | Yes |
| Scope | Extracted from task description (tokens/components/full) | No (default: full) |
| Design intelligence | /analysis/design-intelligence.json | Yes |
| .msg/meta.json | /.msg/meta.json | No |
- Extract session path and scope from task description
- Load design intelligence from analyst output
- Load .msg/meta.json for shared state (industry_context, design_intelligence)
- Detect existing project structure via Glob
src/**/*
Fail-safe: If design-intelligence.json not found, use default token values and log warning.
Phase 3: Architecture Design
Scope selection:
| Scope | Output |
|---|---|
tokens |
Design token system only |
components |
Component specs only |
full |
Both tokens and components + project structure |
Step 1: Design Token System (scope: tokens or full):
Generate <session>/architecture/design-tokens.json with categories:
| Category | Content | Source |
|---|---|---|
color |
Primary, secondary, background, surface, text, CTA | ui-ux-pro-max |
typography |
Font families, font sizes (scale) | ui-ux-pro-max |
spacing |
xs through 2xl | Standard scale |
border-radius |
sm, md, lg, full | Standard scale |
shadow |
sm, md, lg | Standard elevation |
transition |
fast, normal, slow | Standard durations |
Use $type + $value format (Design Tokens Community Group). Support light/dark mode via nested values.
Step 2: Component Architecture (scope: components or full):
Generate component specs in <session>/architecture/component-specs/:
- Design reference (style, stack)
- Props table (name, type, default, description)
- Variants table
- Accessibility requirements (role, keyboard, ARIA, contrast)
- Anti-patterns to avoid (from design intelligence)
Step 3: Project Structure (scope: full):
Generate <session>/architecture/project-structure.md with stack-specific layout:
| Stack | Key Directories |
|---|---|
| react | src/components/, src/pages/, src/hooks/, src/styles/ |
| nextjs | app/(routes)/, app/components/, app/lib/, app/styles/ |
| vue | src/components/, src/views/, src/composables/, src/styles/ |
| html-tailwind | src/components/, src/pages/, src/styles/ |
Phase 4: Self-Review
| Check | Method | Pass Criteria |
|---|---|---|
| JSON validity | Parse design-tokens.json | No errors |
| Required categories | Check color, typography, spacing | All present |
| Anti-pattern compliance | Token values vs anti-patterns | No violations |
| Component specs complete | Each has props + accessibility | All complete |
| File existence | Verify all planned files | All present |
Update .msg/meta.json: merge design_token_registry and component_inventory keys.