Production-ready UI/UX design skills for AI coding agents: frontend design, design systems, accessibility,…
🎨 MAX-DESIGN
以下摘录自该仓库的 README(片段) · 在 GitHub 读完整 README →
**One complete, production-minded UI/UX skill for AI coding agents.** Build distinctive, accessible, responsive interfaces with coherent systems and real behavior—not generic template UI.
**Discover → Define → Design → Build → Critique → Verify** ✨
🚀 What is MAX-DESIGN?
MAX-DESIGN combines the complete product-interface workflow with specialist playbooks for frontend design, information architecture, UX writing, forms, design systems, data visualization, design review, motion, accessibility, localization resilience, and UI testing.
**Install once, use everything.** The repository root contains the SKILL.md skill entrypoint. When you install from this repository with the Skills CLI, the CLI discovers the root skill and installs the toolkit as **one max-design skill**, rather than twelve separate peer skills.
The installed skill includes its SKILL.md, specialist playbooks, decision documents, examples, scripts, and searchable design-knowledge catalog. It is framework-agnostic and has no third-party runtime dependencies. The bundled validator requires Node.js 20+.
📦 Installation
✅ Skills CLI (recommended)
Install the complete toolkit as one skill:
List available skills before installing:
Install only the unified skill explicitly:
Install it to all detected supported agents:
Install globally for the selected agent(s):
Target a specific agent, for example Codex or Claude Code:
The CLI installs the whole root skill directory, so the paths docs/, examples/, knowledge/, scripts/, and skills/ remain available inside the installed max-design directory. See the Skills CLI documentation for supported agents and options.
**Upgrading from the previous multi-skill layout:** an older installation may still have the 12 skills installed as separate directories. Remove those old standalone entries from the agent/location where you installed them, then run the install command above again. The CLI does not automatically remove directories left by an earlier installation.
🛠️ Manual installation
Copy the full toolkit into one .agents/skills/max-design/ directory. Do not copy only skills/*: the scripts and design-knowledge catalog are siblings of that folder.
**macOS / Linux:**
**Windows PowerShell:**
For a different agent, use that agent's supported skill directory and keep the same single max-design/ folder. Preserve the folder structure so relative documentation and script paths continue to work.
🧠 Bundled specialist playbooks
These are reference workflows **inside the unified MAX-DESIGN skill**, not separate skills installed side by side.
| Playbook | Purpose |
| --- | --- |
| **max-design** | Coordinates discovery, visual direction, implementation, critique, and verification |
| **frontend-design** | Builds distinctive, polished, responsive interfaces |
| **information-architecture** | Structures navigation, hierarchy, search, and user task flows |
| **ux-writing-content** | Writes clear labels, helper text, onboarding, success, and error copy |
| **forms-ux** | Designs accessible forms, validation, submission, and recovery |
| **design-system** | Audits and safely extends tokens, themes, and reusable components |
| **data-visualization** | Selects and verifies accurate, accessible charts and data displays |
| **design-review** | Prioritizes evidence-based UI findings by user impact |
| **interaction-motion** | Adds purposeful transitions and understandable motion |
| **accessibility-audit** | Reviews semantics, keyboard use, focus, contrast, and reduced motion |
| **resilient-localization** | Hardens UI against long text, localization, unexpected data, and failures |