Agent skill
generic-ux-designer
Quellcode ansehen: travisjneuman/.claude
Installation
npx skills add travisjneuman/.claude --skill generic-ux-designer141
Installationen
EU-hosted inference API
Power your AI agent skills with open-source models.
Drop-in OpenAI-compatible API. No data leaves Europe.
MiniMax
MiniMax M3
$0.50 / $1.90
per M tokens
Z.ai
GLM 5.3 Flash
$0.20 / $0.60
per M tokens
MoonshotAI
Kimi K3
$4.00 / $18.00
per M tokens
DeepSeek
DeepSeek V4.1 Flash
$0.40 / $1.42
per M tokens
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 firstReferences:
- 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/P2Design 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
Verwandte Skills
Mehr aus dieser Quelle: travisjneuman/.claude
So verwenden Sie diesen Skill
- 1
Install generic-ux-designer by running
npx skills add travisjneuman/.claude --skill generic-ux-designerin your project directory. Führen Sie den obigen Installationsbefehl in Ihrem Projektverzeichnis aus. Die Skill-Datei wird von GitHub heruntergeladen und in Ihrem Projekt platziert. - 2
Keine Konfiguration erforderlich. Ihr KI-Agent (Claude Code, Cursor, Windsurf usw.) erkennt installierte Skills automatisch und nutzt sie als Kontext bei der Code-Generierung.
- 3
Der Skill verbessert das Verständnis Ihres Agenten für generic-ux-designer, und hilft ihm, etablierte Muster zu befolgen, häufige Fehler zu vermeiden und produktionsreifen Code zu erzeugen.
Was Sie erhalten
Skills sind Klartext-Anweisungsdateien — kein ausführbarer Code. Sie kodieren Expertenwissen über Frameworks, Sprachen oder Tools, das Ihr KI-Agent liest, um seine Ausgabe zu verbessern. Das bedeutet null Laufzeit-Overhead, keine Abhängigkeitskonflikte und volle Transparenz: Sie können jede Anweisung vor der Installation lesen und prüfen.
Kompatibilität
Dieser Skill funktioniert mit jedem KI-Coding-Agenten, der das skills.sh-Format unterstützt, einschließlich Claude Code (Anthropic), Cursor, Windsurf, Cline, Aider und anderen Tools, die projektbezogene Kontextdateien lesen. Skills sind auf Transportebene framework-agnostisch — der Inhalt bestimmt, für welche Sprache oder welches Framework er gilt.
Data sourced from the skills.sh registry and GitHub. Install counts and security audits are updated regularly.