UX/UI Mastery Plugin for Claude Code
The most comprehensive UX/UI design intelligence ever built for an AI coding assistant.
v3.0.0 | 19 Skills | 55 References | 10 Commands | 310,000+ Words | 87 Files
"Every pixel on a screen is ultimately processed by a human brain. This plugin ensures Claude understands that brain."
Why This Exists
Most design tools give you components. Most AI assistants give you opinions. Neither gives you the science of why users behave the way they do — and the production code to act on it.
This plugin gives Claude Code the equivalent of a senior UX designer's entire career knowledge: cognitive psychology, battle-tested heuristics, platform-native component code, real product case studies, and the latest 2025-2026 research — all activated automatically when you need it.
The result: Claude doesn't just suggest "make the button bigger." It tells you Fitts's Law predicts a 23% improvement at 48px, generates the accessible React component with all 10 states, and flags that your 14-option dropdown violates Hick's Law.
What Changed in v3.0
| Before (v2.0) | After (v3.0) |
|---|
| 12 skills, 30 references | 19 skills, 55 references |
| ~170K words of theory | 310K+ words of theory AND implementation |
| Zero code examples | 40+ production React, SwiftUI, and CSS components |
| Zero case studies | 18+ product deep-dives and failure analyses |
| No cognitive science | 25+ Laws of UX, 50+ cognitive biases, neurodesign |
| No Figma integration | Full Figma MCP design-to-code flywheel |
| Outdated platforms | iOS 26 Liquid Glass, Material 3 Expressive, modern CSS |
| No design critique tools | Structured critique with Liz Lerman methodology |
| 6 commands | 10 commands |
Installation
Prerequisites
- Claude Code CLI installed and authenticated
- No other dependencies — the plugin is pure markdown, zero config
Method 1: Install from GitHub Marketplace (Recommended for End Users)
This is the standard way to install Claude Code plugins. Run these commands inside a Claude Code session:
/plugin marketplace add phazurlabs/ux-ui-mastery
/plugin install ux-ui-mastery@ux-ui-mastery-marketplace
That's it. The plugin is now permanently installed and available in every session.
To choose installation scope:
- User scope (all projects): Plugin is registered in
~/.claude/settings.json
- Project scope (team-shared): Plugin is registered in
.claude/settings.json in your project
- Local scope (personal, gitignored): Plugin is registered in
.claude/settings.local.json
Method 2: Clone + Load Directly (For Development / Testing)
Clone the repo anywhere, then load it with the --plugin-dir flag:
git clone https://github.com/phazurlabs/ux-ui-mastery.git
claude --plugin-dir ./ux-ui-mastery
This loads the plugin for that session only. Great for testing or development.
Method 3: Clone + Register Permanently (Manual)
Step 1: Clone into the plugins directory:
mkdir -p ~/.claude/plugins
cd ~/.claude/plugins
git clone https://github.com/phazurlabs/ux-ui-mastery.git
Step 2: Register the plugin in your Claude Code settings. Edit ~/.claude/settings.json:
{
"enabledPlugins": {
"ux-ui-mastery": true
}
}
Step 3: Restart Claude Code. The plugin loads automatically every session.
Verify Installation
Start Claude Code and run any slash command:
/ux-audit
/cognitive-check
/component-build
/design-critique
/figma-to-code
Commands appear as /ux-ui-mastery:command-name (e.g., /ux-ui-mastery:ux-audit).
You can also test skill activation by asking about any trigger topic:
"What does Fitts's Law say about button sizing?"
"Audit this component for cognitive load"
"Build me a React modal with all states"
"What went wrong with the Snapchat 2018 redesign?"
The relevant skill and deep references load automatically based on your query.
Troubleshooting
| Problem | Solution |
|---|
| Commands not showing up | Restart Claude Code after installation |
/plugin command not recognized | Update Claude Code to the latest version |
| Skills not activating on topics | Verify plugin.json exists at .claude-plugin/plugin.json |
| Want to uninstall | Run /plugin uninstall ux-ui-mastery or remove from settings.json |
Requirements
- Claude Code CLI (latest version)
- No external dependencies — pure markdown, zero config, works offline
10 Commands at Your Fingertips
phazurlabs