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

1. Empathize - Understand user needs, pain points, journeys
2. Define - Problem statements, personas, success metrics
3. Ideate - Brainstorm solutions, explore alternatives
4. Prototype - Low-fidelity first, test assumptions
5. 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

1. Explain what goes here
2. Guide to first action
3. Show example content

Loading States

1. Skeleton screens > spinners
2. Progress for long operations
3. Optimistic UI when safe

Error States

1. Explain what happened
2. Suggest how to fix
3. 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 consistency
• generic-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