majiayu000 Generic UX Designer
Professional UX expertise adapting to any project's constraints.
Combine with Research for Visual Work
For UI/visual design decisions, also use:
Skill(ui-research) # Research inspiration first
References:
- UX Principles - UX methodology
- UI Inspiration Sources - Visual research
When to Use This Skill
Use for:
- Designing new features or flows
- Improving existing user experience
- Conducting design reviews/critiques
- Evaluating user flows and interactions
- Making accessibility decisions
- Choosing between design alternatives
Don't use when:
- Visual styling/tokens → use
generic-design-system - Code architecture → use
generic-feature-developer - Code quality review → use
generic-code-reviewer
Design Thinking Process
- Empathize - Understand user needs, pain points, journeys
- Define - Problem statements, personas, success metrics
- Ideate - Brainstorm solutions, explore alternatives
- Prototype - Low-fidelity first, test assumptions
- Test - Usability testing, iterate on data
Research Decision Guide
When to Research vs Ship
| Situation | Action |
|---|---|
| New product/feature | Full research (interviews + testing) |
| Incremental change | Quick critique (heuristic review) |
| Bug fix | No research needed |
| A/B decision | Analytics + small test |
| Controversial design | Stakeholder alignment first |
Method Selection
- Need user motivation? → Interviews
- Need usability feedback? → Testing
- Need quick quality check? → Heuristic evaluation
- Need quantitative data? → Surveys/Analytics
- Have no users yet? → Competitor analysis + proto-personas
Research Scope by Confidence
| Confidence Level | Action |
|---|---|
| High (established pattern) | Skip research |
| Medium (some uncertainty) | Quick critique |
| Low (new territory) | Full research |
Reference: See UX_PRINCIPLES.md for detailed method frameworks
User Psychology Applied
Cognitive Load
- Reduce choices (Hick's Law)
- Chunk information (Miller's Law)
- Progressive disclosure
- Minimize memory load
Visual Hierarchy
- Size indicates importance
- Contrast draws attention
- Whitespace groups elements
- F-pattern/Z-pattern reading
Interaction Patterns
Navigation
| Pattern | Use Case |
|---|---|
| Top nav | Simple sites, < 7 items |
| Side nav | Complex apps, many sections |
| Bottom nav | Mobile apps, < 5 items |
| Tabs | Related content sections |
Forms
- Single column layout
- Inline validation
- Smart defaults
- Progress indicators
Feedback
| Pattern | Use Case |
|---|---|
| Toast | Non-blocking info |
| Modal | Blocking/important |
| Inline | Contextual feedback |
| Skeleton | Loading states |
Mobile Considerations
- Touch targets: 44x44px minimum
- 8px spacing between targets
- Thumb-friendly placement
- Bottom sheets for actions
Accessibility (UX Perspective)
| Aspect | Approach |
|---|---|
| Vision | High contrast, scalable text |
| Motor | Large targets, keyboard nav |
| Cognitive | Simple language, clear structure |
| Hearing | Captions, visual indicators |
Heuristic Evaluation in Practice
Quick Scan (5 minutes)
| Heuristic | Quick Check |
|---|---|
| Visibility | Is current state obvious? |
| Feedback | Does every action have response? |
| Consistency | Do similar things look/work similar? |
| Error Prevention | Can user easily make mistakes? |
| Recovery | Can user undo/fix errors? |
Common Violations to Flag
- Hidden system state (loading with no indicator)
- Silent failures (action with no feedback)
- Inconsistent patterns (different buttons for same action)
- Destructive without confirm (delete with no undo)
- Jargon in user-facing text
Presenting Findings
Issue: [What's wrong]
Heuristic: [Which violated]
Impact: [User consequence]
Suggestion: [How to fix]
Priority: P0/P1/P2
Design Critique Framework
| Aspect | Questions |
|---|---|
| Usability | Can users complete tasks? |
| Clarity | Is purpose immediately clear? |
| Consistency | Follows established patterns? |
| Hierarchy | Most important stands out? |
| Feedback | Users know system state? |
| Accessibility | Works for everyone? |
UX Patterns
Empty States
- Explain what goes here
- Guide to first action
- Show example content
Loading States
- Skeleton screens > spinners
- Progress for long operations
- Optimistic UI when safe
Error States
- Explain what happened
- Suggest how to fix
- Don't blame user
UX Output Checklist
Before presenting UX recommendation:
- User problem clearly defined
- Solution addresses root cause (not symptom)
- Accessibility considered
- Edge cases identified
- Implementation complexity noted
- Success metrics defined
Design Review Checklist
- Primary task achievable
- Clear visual hierarchy
- Keyboard navigable
- Touch targets sized
- Copy clear and helpful
See Also
- UX Principles - Research methods, heuristics, psychology
- Design Patterns - Visual patterns and components
generic-design-system- For tokens, styling, visual consistencygeneric-feature-developer- For implementation architecture- Project
CLAUDE.md- Project-specific constraints
READ UX_PRINCIPLES.md for:
- Full research method frameworks → methods section
- Complete Nielsen heuristics → evaluation section
- Quick critique workflow → critique section