From mellow-engineering
Quick UX self-review during implementation. Usage: /design:check [file path or current changes]
How this command is triggered — by the user, by Claude, or both
Slash command
/mellow-engineering:design-check [file path or 'current' for uncommitted changes]The summary Claude sees in its command listing — used to decide when to auto-load this command
# Design Quick Check
A lightweight self-review for UX quality during implementation. Run this before committing UI code.
## Step 1: Identify What to Check
<target>
{{argument}}
</target>
If argument is a file path:
If argument is "current" or empty:
## Step 2: Run Design Reviewer
Use the consolidated `design-reviewer` agent for quick feedback:
### Design Reviewer Prompt
## Step 3: Quick Summary
Provide a brief summary:
## When to Use This
Run `/design:check` before:
- Committing a new Screen or View
- Adding UI copy (labels, errors, empty states)
- Implementing loading/e...A lightweight self-review for UX quality during implementation. Run this before committing UI code.
If argument is a file path:
Read: [file path]
If argument is "current" or empty:
git diff --name-only | grep -E '\.(swift|tsx?)$'
Use the consolidated design-reviewer agent for quick feedback:
Task design-reviewer(mode: "quick-check"): "Quick design check on [file]"
Quick design check on this file:
File: [content]
Check for:
## Copy Quality
1. Button labels specific? (not "OK", "Submit", "Yes")
2. Error messages helpful? (what happened + what to do)
3. Empty states have guidance? (not just "No items")
4. Verbs consistent? (Create/Add, Delete/Remove, etc.)
5. Loading text appropriate? (or just spinner for <2s)
## State Handling
1. Empty state handled? (when no data exists)
2. Loading state visible? (skeleton or spinner)
3. Error state with retry? (not silent failure)
4. All switch cases covered? (exhaustive)
5. Boolean flags vs enum? (prefer enum for >2 states)
Only report issues found, skip if good.
Format: P1/P2/P3 with line number and suggested fix.
Provide a brief summary:
## Design Check: [filename]
**Status:** ✅ Good / ⚠️ Minor Issues / ❌ Issues Found
### Issues (if any)
**P2: [Issue]**
- Line [X]: [description]
- Fix: [suggestion]
### Quick Fixes
1. [Actionable fix 1]
2. [Actionable fix 2]
Run /design:check before:
[ ] Empty state with illustration + CTA
[ ] Loading state with skeleton/spinner
[ ] Error state with message + retry
[ ] Success state with content
[ ] Buttons: [Verb] [Object] format
[ ] Errors: What + Why + What to do
[ ] Empty: Title + Subtitle + CTA
[ ] Placeholders: Examples not labels
Generic button:
// ❌ Before
Button("OK") { }
// ✅ After
Button("Save Note") { }
Missing error state:
// ❌ Before
if isLoading { ProgressView() }
else { ContentView() }
// ✅ After
switch state {
case .loading: LoadingView()
case .error(let e): ErrorView(error: e, retry: retry)
case .success(let data): ContentView(data: data)
}
Vague error:
// ❌ Before
Text("Error")
// ✅ After
VStack {
Text("Couldn't save note")
Text("Check your connection and try again")
Button("Retry") { retry() }
}
/workflows:reviewnpx claudepluginhub get-mellow/claude-plugins --plugin mellow-engineering/design-reviewReviews UI files or components interactively for design, usability, code quality, and performance issues. Configures via sequential questions on focus, context, and platform.
/design-reviewReviews UI files, directories, or staged git changes against design conventions, anti-patterns, accessibility, performance, RTL, i18n, and brand standards. Supports --check, --fix, and --json output.
/SKILLReviews SwiftUI and Swift code for best practices, modern APIs, data flow, navigation, accessibility, performance. Outputs issues by file with before/after fixes and prioritized summary.
/polish-sweepScans codebase scope (components/, app/, or path) for UX polish issues like missing feedback, inconsistencies, dead-ends, and code patterns; produces prioritized report with fixes.
/ux-auditRuns a structured 6-lens UX review of a live surface (URL, file, or screenshot), producing a severity-tagged Polaris-style report with findings, evidence, and fixes.