Agent skill

moai-design-craft

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.

Stars 894
Forks 157

Install this agent skill to your Project

npx add-skill https://github.com/modu-ai/moai-adk/tree/main/.claude/skills/moai-design-craft

Metadata

Additional technical details for this skill

tags
design, craft, intent-first, design-direction, domain-exploration, design-memory, critique
status
active
updated
2026-03-28
version
1.1.0
category
domain
modularized
true
related skills
moai-domain-uiux, moai-design-tools, moai-domain-frontend

SKILL.md

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, vocabulary
  • modules/design-memory.md.moai/design/system.md read/write protocol
  • modules/critique-workflow.md — Post-build critique: observe → diagnose → rebuild, hard rules and rejection criteria

Quick Reference

Design Direction (plan phase)

When manager-spec detects design-relevant keywords, trigger Design Direction:

  1. Read .moai/design/system.md (if it exists) for established vocabulary and intent
  2. Explore domain: What is the user doing? What is the mental model? What does success feel like?
  3. Define design intent in 1–3 sentences
  4. Identify 3–5 domain vocabulary terms
  5. Write design direction to .moai/design/system.md

Design Audit (review phase)

When /moai review --design is invoked:

  1. Read .moai/design/system.md for current design system rules
  2. Scan UI components against the rules
  3. Report violations with file:line references
  4. Suggest minimal fixes preserving existing structure

Design Critique (review phase)

When /moai review --critique is invoked:

  1. Observe: What does the built interface actually do? (not what it was supposed to do)
  2. Diagnose: Where does the implementation drift from intent?
  3. Decide: Patch (small drift) or rebuild (fundamental misalignment)

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.1.0 Last Updated: 2026-03-28

Expand your agent's capabilities with these related and highly-rated skills.

Didn't find tool you were looking for?

Be as detailed as possible for better results