skillfed

UX Designer

UX Designer walks you through a five-phase methodology for building user-centered experiences: organizing content logically, mapping user flows, creating wireframes, testing prototypes with real users, and delivering production-ready designs. Each phase includes specific activities, validation checklists, and practical guidance on accessibility, design patterns, and tools like Figma and component libraries.

UX Designer guides you through a five-phase process from research and information architecture to prototyping, testing, and developer handoff.

AI-generated summary based on this skill's SKILL.md

32 7 MIT updated by daffy0208

Install

daffy0208/ai-dev-standards/ux-designer · repository language: TypeScript

git clone https://github.com/daffy0208/ai-dev-standards
cp -r ai-dev-standards/skills/ux-designer ~/.claude/skills/ux-designer
npx skillfed install daffy0208/ai-dev-standards/ux-designer

Frequently asked questions

AI-generated answers based on this skill's SKILL.md and metadata

What are the UX design process steps?

UX Designer guides you through five phases: research and information architecture to organize content logically, user flow mapping to visualize journeys, wireframing to establish layouts, usability testing with real users to validate decisions, and design handoff with production-ready specs for developers. Each phase includes validation checklists and practical accessibility considerations aligned with WCAG standards.

How do I create wireframes and prototypes with UX Designer?

UX Designer teaches wireframing fundamentals and prototyping techniques using tools like Figma. You'll learn to translate user flows into visual layouts, establish information hierarchy, apply interaction design principles, and build clickable prototypes for usability testing. The skill covers form design patterns, error states, and navigation patterns to ensure intuitive user experiences.

How can I ensure my designs meet accessibility standards?

UX Designer emphasizes accessibility throughout the design process, providing WCAG compliance guidance and checklists. You'll learn to design inclusive interfaces, implement accessible form patterns, test for usability across different user needs, and validate that your wireframes and prototypes meet accessibility requirements before handoff to developers.

What's involved in user research to design workflow?

UX Designer connects user research directly to design outcomes. You'll organize research findings into information architecture, map user flows based on research insights, create wireframes addressing user needs, and conduct usability testing to validate design decisions. This structured approach ensures designs are grounded in real user behavior and requirements.

How do I improve user experience with design systems?

UX Designer covers building reusable design systems and component libraries that scale across products. You'll establish consistent patterns for forms, navigation, error states, and interactions, then hand off detailed specifications to developers. Design systems ensure coherent experiences while streamlining the design-to-development workflow.

What's the best approach to testing prototypes with users?

UX Designer provides usability testing guidance to validate your design decisions with real users. You'll learn to conduct tests on wireframes and prototypes, gather feedback on navigation and interaction patterns, identify accessibility issues, and iterate based on findings before final handoff. Testing ensures your designs solve actual user problems.

SKILL.md

rendered from the published skill — quoted content, verbatim

UX Designer

Design intuitive, accessible user experiences grounded in research.

Core Principle

Design for users, not yourself. Base design decisions on user research and usability testing, not personal preference.

5-Phase UX Design Process

Phase 1: Information Architecture

Goal: Organize content and functionality logically

Activities:

  • Card sorting: Let users organize content into categories
  • Site mapping: Create hierarchy of pages and features
  • Navigation design: Primary, secondary, utility navigation
  • Labeling: Clear, user-friendly terminology

Validation:

  • [ ] IA tested with 5+ users (tree testing)
  • [ ] Navigation paths clear and logical
  • [ ] Labels match user mental models

Phase 2: User Flows

Goal: Map paths users take to complete tasks

Key Flows to Design:

  • Onboarding: First-time user experience
  • Core tasks: Primary use cases (80% of usage)
  • Error

(truncated - see the full file via the links below)

Read as markdown · JSON record · Browse the source repository

File tree — 3 files
skills/ux-designer/README.md
skills/ux-designer/SKILL.md
skills/ux-designer/manifest.yaml

Related skills

Tags

interface-design user-research-based accessibility-first prototyping-tools interaction-patterns design-systems usability-testing responsive-design information-hierarchy design-handoff