Make Claude Code ship UI that thinks before it renders.
UX Engine is a Claude Code plugin: eight skills of senior-designer reasoning, four commands that run them. User intent first, hierarchy enforced, one design system across every screen.
Built for Claude Code. Installs in any agent that reads skills: Cursor, Codex, OpenCode. · one-time payment
>/ux-design users admin page
ux-designer · intent discovery
Who uses this page day-to-day, and what's the worst mistake they could make on it?
>support team · deleting the wrong account
Brief locked
Delete moves to overflow + typed confirmation
Search becomes the primary action · 5 columns, not 12
Empty, loading and error states specced up front
✓Wireframe + spec ready. Building for intent, not schema.
30-day money-back guarantee, no questions asked
Built by @designmotionhq
- followers on @designmotionhq
- 55k+
- followers on @designmotionhq
- monthly views on UI/UX content
- 1M+
- monthly views on UI/UX content
- pattern breakdowns published free
- 76
- pattern breakdowns published free
Your AI ships admin panels that hurt to use.
Claude Code, Cursor, Bolt, v0. They produce clean Tailwind, decent spacing, cohesive colors. Then they ship a 12-column table with Delete next to Edit and call it a dashboard. That's not a product. It's a schema browser.
Without UX Engine
- 12-column table dumping every field
- Edit and Delete equally weighted on every row
- Search hidden in a “Filter” dropdown
- No empty state: blank rows on no results
- “Active” status as green text only
- No loading state: first paint feels broken
With UX Engine
- 5 columns: identity, status, last seen, plan, actions
- Destructive in overflow + typed confirmation
- Search as the primary action on the page
- Empty state with an “Invite your first user” CTA
- Status pill: icon + label, colorblind-safe
- 5-row skeleton matching the final layout
One price. One payment. Yours forever.
No subscription: pay once, keep it, get a year of updates.
one-time payment · Built for Claude Code. Installs in any agent that reads skills: Cursor, Codex, OpenCode.
- All 8 skills, 2 sub-agents, 4 slash commands
- Premium PDF manual with worked examples, plus the 2.0 supplement
- 12 months of updates included
- Roadmap features ship to you: accessibility, mobile-first, multi-framework
- Email support, 72h response
One license per developer. Buying for a team? Add seats.
Try it for 30 days. If it doesn't change how Claude ships UI, one email to support@designmotionhq.com gets you a full refund. No questions, no forms.
Eight skills, four commands, one design system.
The four commands are the dependable way in: each one runs the skills it needs, every time. Naming a skill works every time too, as in use visual-character on this screen. On a plain prompt, Claude consults them when the match is obvious and skips them when it is not, so drive it with one or the other.
Intent Discovery
Forces the who / what / worst-case questions before a single line of UI is written.
Information Hierarchy
Ranks actions primary / secondary / tertiary and enforces scanning patterns and density.
State Completeness
Guarantees all six states: loading, empty, partial, error, success, offline.
Form UX
Field grouping, label placement, validation strategy, smart defaults, progressive disclosure.
Feedback & Affordance
Feedback under 100ms, confirmation on destructive actions, clickable looks clickable.
UX Auditor
Point it at any UI and get a severity-ranked, shippable fix list, not vague advice.
Design SystemNew in 2.0
Writes DESIGN.md at your project root, then enforces it. Off-system values get flagged, never invented in silence.
Visual CharacterNew in 2.0
One explicit decision per axis: type, color, space, finish. No falling back on the model's default look.
- /ux-design
- Wireframe + spec before you implement, via the ux-designer sub-agent.
- /ux-audit
- A prioritized, actionable audit of a file, URL, or screen.
- /ux-review
- A UX pass on your current diff before merge: state gaps, hierarchy, affordance, copy.
- /restyleNew in 2.0
- Diagnoses an existing UI axis by axis, applies DESIGN.md, hands back a before/after.
New in 2.0
One design system, written downdesign-system
Screen 1 picks a blue and 24px of padding, screen 2 picks another, screen 3 invents a third button style. The skill writes a DESIGN.md at your project root: tokens, component variants, voice, every value carrying the reason it exists. It reads your Tailwind config and CSS variables first, so it consolidates the system you already have. After that, an off-system value is either a declared extension or it gets flagged. Silent invention is how drift starts.
A look that is a decision, not a defaultvisual-character
Every model has a statistically safest aesthetic, and UI that falls back on it reads as AI-made. This skill forces one explicit choice per axis: type, color, space, finish. It ships with no house style on purpose, so the result looks like your product and not like this plugin. Then the lineup test: would this screenshot be recognizable among ten AI-generated UIs for the same prompt?
Fix the screens you already shipped/restyle [path]
Point it at an existing UI. It reports what that UI currently does on each axis and whether it was a decision or a default, applies your DESIGN.md, and hands back a before/after you can read in seconds. Visual only: logic, component structure and copy meaning stay exactly where you left them.
Buy. Unzip. Two minutes.
No marketplace registration. No license activation. The ZIP goes wherever you keep your tools, Claude Code picks it up with a local path, and the package ships the exact commands.
Any skills-based agent works too: one copy into ~/.agents/skills/, no plugin system needed. Cursor, Codex and OpenCode are tested.
Things you probably want to know.
Do the skills fire on their own?
The four slash commands do, every time: each one runs the skills it needs. Naming a skill works too, every time: “use visual-character on this screen”. Left to itself on a plain prompt, Claude consults the skills when the match is obvious and skips them when it isn't. We tested “build a pricing card component in React” on a clean setup with no other plugin: four files, no skill invoked. So use a command or name the skill, and you get the same output either way. Making them apply on their own, consistently, is the next release.
I already own 1.0. What do I pay?
Nothing. Your license covers twelve months of updates and 2.0 is one of them. Re-download the ZIP with the link from your purchase email: your Lemon Squeezy portal always serves the current version.
Buying for a team?
One license per developer. Pick the number of seats on the pricing card: one order, one receipt, one download, and sharing the ZIP among the developers covered by those seats is allowed. More than ten seats: email support@designmotionhq.com.
Does it work outside Claude Code?
Yes, in any agent that loads skills in the standard SKILL.md format. Cursor, Codex and OpenCode are tested. The package ships the same product as 14 skills; one copy into ~/.agents/skills/ installs them, and agent-skills/INSTALL.md has the commands. The commands become skills you invoke by name, and the two sub-agents run inside your conversation instead of a separate agent.
Will it slow down my workflow?
The opposite. The 30 seconds of intent questions at the start of a UI task saves the three rebuild cycles that usually follow LLM UI generation. Most users ship the first version of a screen and are done.
Can I skip the questions?
Yes. Provide the intent up front and it generates the brief directly. Say “skip the questions” and it builds with stated assumptions, flagged for your review.
Does it work with my design system?
Yes, and 2.0 starts from yours. Before proposing a single token, design-system reads your Tailwind config, your CSS variables, your theme files and your most reused component: whatever you already encode is the system, and DESIGN.md consolidates it instead of competing with it. Only the genuine gaps get asked about, five questions maximum.
How do I install an update?
Uninstall the plugin, then install the new folder. Not install on top: both versions publish the same marketplace name, so Claude Code answers “already installed”, reports success, and leaves you on the old one. The package ships a WHATS-NEW file with the three exact commands. You get an email whenever a new version lands in your portal.
What if I don't like it?
30-day refund, no questions asked. Email support@designmotionhq.com with your order ID.
Who built this?
designmotionhq, the account behind 55k+ followers and 1M+ monthly views on UI/UX content. UX Engine encodes three years of design tips, audits, and patterns into a tool that ships them with you.
The free breakdowns UX Engine is built on.
One pattern, one video, one takeaway. 76 of them, free to read.
interactionCSS Has Selector
One line of CSS. The whole card reacts to its own checkbox.
visualDe-AI Landing Hero
Your landing page looks AI-made. Five tells. Five fixes.
visualReverse-Engineered Linear
Why does Linear feel expensive? Five decisions. None need a designer.
interactionBulk Actions
Bulk actions are a system, not a lone checkbox.
interactionDisabled Buttons
The button is disabled, and nobody tells you why.
interactionHover Trap
Hover works on your laptop but is dead on mobile.
From people who installed it.
“The UX engine became a standard plugin in my Claude, really love it”
Developer, UX Engine customer
“I have a software company, I would love to see you overhaul our software”
Founder, software company
Stop debugging interfaces. Start designing them.
One plugin. Eight skills. Two agents. Four commands. Your Claude Code, but with senior-designer reasoning baked in.
30-day money-back guarantee, no questions asked
Built for Claude Code. Installs in any agent that reads skills: Cursor, Codex, OpenCode. · one-time payment