Entry point: /faion-net — invoke this skill for automatic routing to the appropriate domain.

UX/UI Designer Orchestrator

Communication: User's language | Docs/code: English

Purpose

Orchestrates UX/UI design activities by coordinating specialized sub-skills. Routes tasks to appropriate specialists for research, design, or accessibility work.

Philosophy: "Design is not just what it looks like. Design is how it works." — Steve Jobs

Context Discovery

Auto-Investigation

Check for existing design artifacts and UI setup:

Signal	How to Check	What It Tells Us
Figma links	`Grep("figma.com", "*/.md")`	Design files exist
Storybook	`Glob("*/.storybook/")`	Component library exists
Design tokens	`Glob("*/tokens.")`	Design system exists
Tailwind config	`Glob("*/tailwind.config.")`	Tailwind used
a11y config	`Grep("eslint-plugin-jsx-a11y", "**/package.json")`	A11y linting enabled
User personas	`Glob("*/personas.md")`	User research done

Read existing assets:

Check existing components for design patterns
Read Storybook stories for component API
Review tailwind.config for design tokens

Discovery Questions

Use AskUserQuestion to understand UX/UI needs.

Q1: Design Phase

question: "What phase of design work are you in?"
header: "Phase"
multiSelect: false
options:
  - label: "Research (understand users)"
    description: "User interviews, testing, personas"
  - label: "Design (create solutions)"
    description: "Wireframes, prototypes, visual design"
  - label: "Evaluate (test designs)"
    description: "Usability testing, heuristic evaluation"
  - label: "Accessibility audit"
    description: "WCAG compliance, a11y improvements"

Routing:

"Research" → Skill(faion-ux-researcher)
"Design" → Skill(faion-ui-designer)
"Evaluate" → Skill(faion-ux-researcher) → usability-testing
"Accessibility" → Skill(faion-accessibility-specialist)

Q2: Design Fidelity (if Design phase)

question: "What fidelity of design do you need?"
header: "Fidelity"
multiSelect: false
options:
  - label: "Low-fi (wireframes, structure)"
    description: "Layout and flow, not visuals"
  - label: "High-fi (visual design)"
    description: "Colors, typography, polished UI"
  - label: "Design system / components"
    description: "Reusable component library"
  - label: "Code implementation"
    description: "Turn designs into working UI"

Routing:

"Low-fi" → wireframing, information-architecture
"High-fi" → visual-design, prototyping
"Design system" → design-tokens, component-library
"Code" → Coordinate with Skill(faion-frontend-developer)

Q3: User Access (if Research phase)

question: "Do you have access to real users?"
header: "Users"
multiSelect: false
options:
  - label: "Yes, can recruit users easily"
    description: "Have user base or recruitment budget"
  - label: "Limited (internal team, friends)"
    description: "Can do guerrilla testing"
  - label: "No user access"
    description: "Need proxy methods"

Context impact:

"Easy access" → Full user interviews, usability testing
"Limited" → Guerrilla testing, shorter sessions
"No access" → Heuristic evaluation, competitor analysis, personas from research

Q4: Platform (affects design patterns)

question: "What platform are you designing for?"
header: "Platform"
multiSelect: true
options:
  - label: "Web (desktop)"
    description: "Desktop browser experience"
  - label: "Web (mobile responsive)"
    description: "Mobile-first or responsive"
  - label: "Native mobile app"
    description: "iOS or Android native"
  - label: "Voice UI"
    description: "Voice assistants, conversational"

Context impact:

"Desktop" → Standard web patterns, larger screens
"Mobile responsive" → Mobile-first, touch targets, responsive
"Native mobile" → Platform guidelines (HIG, Material)
"Voice UI" → VUI methodologies, conversation design

Architecture

faion-ux-ui-designer (orchestrator)
├── faion-ux-researcher (30 methodologies)
│   └── Research, testing, personas, journey mapping
├── faion-ui-designer (30 methodologies)
│   └── Wireframes, prototypes, design systems, VUI, spatial
└── faion-accessibility-specialist (22 methodologies)
    └── WCAG, ADA, a11y testing, heuristics

Total: 82 methodologies

Sub-Skills

Sub-Skill	Focus	Methodologies	Location
faion-ux-researcher	User research, testing, analysis	30	~/.claude/skills/faion-ux-researcher
faion-ui-designer	Wireframes, prototypes, design systems, VUI, spatial	30	~/.claude/skills/faion-ui-designer
faion-accessibility-specialist	WCAG, ADA, a11y testing, heuristics	22	~/.claude/skills/faion-accessibility-specialist

Quick Decision Guide

If you need...	Route to	Examples
Research & Understanding	faion-ux-researcher	User interviews, surveys, usability testing, personas, journey maps, competitive analysis
Design Solutions	faion-ui-designer	Wireframes, prototypes, design systems, design tokens, VUI, spatial UI, Figma/Adobe
Accessibility & Compliance	faion-accessibility-specialist	WCAG 2.2, ADA, a11y testing, heuristic evaluation, assistive tech
Multi-domain tasks	Multiple sub-skills	Discovery (research → design), validation (design → a11y), full cycle (research → design → a11y)

Common Workflows

Discovery Phase

1. faion-ux-researcher: User interviews
2. faion-ux-researcher: Competitive analysis
3. faion-ux-researcher: Personas
4. faion-ux-researcher: Journey mapping

Design Phase

1. faion-ui-designer: Wireframing
2. faion-ui-designer: Prototyping
3. faion-ui-designer: Design systems (if needed)

Validation Phase

1. faion-accessibility-specialist: Heuristic evaluation
2. faion-ux-researcher: Usability testing
3. faion-accessibility-specialist: WCAG audit

Full Cycle

1. faion-ux-researcher: Discovery
2. faion-ui-designer: Design
3. faion-accessibility-specialist: A11y validation
4. faion-ux-researcher: User testing
5. Iterate

Execution Protocol

Task Analysis

Identify task domain (research, design, or a11y)
Determine if single or multi-domain task
Route to appropriate sub-skill(s)

Single-Domain Tasks

Task → Identify domain → Invoke sub-skill → Return results

Multi-Domain Tasks

Task → Break into phases → Invoke sub-skills sequentially → Synthesize results

Coordination

Pass research findings from ux-researcher to ui-designer
Send designs from ui-designer to accessibility-specialist for validation
Loop back to ux-researcher for user testing validation
Maintain consistent artifacts across sub-skills

Integration Points

External Skill	Collaboration
faion-product-manager	Receives product requirements, provides research insights
faion-software-developer	Provides design specs, receives implementation questions
faion-marketing-manager	Collaborates on landing pages, conversion optimization
faion-researcher	Shares market research, personas, competitor insights

Output Formats

Orchestrator outputs depend on sub-skills invoked:

From faion-ux-researcher

Research reports
Personas
Journey maps
Usability test results
Competitive analysis matrices

From faion-ui-designer

Wireframes and prototypes
Design system documentation
Design tokens (JSON/YAML)
VUI conversation flows
Spatial UI mockups

From faion-accessibility-specialist

WCAG audit reports
ADA compliance documentation
Heuristic evaluation reports
Assistive technology test results
VPAT documents

Navigation

For detailed methodologies, see sub-skill documentation:

faion-ux-researcher SKILL.md - Research methodologies
faion-ui-designer SKILL.md - Design methodologies
faion-accessibility-specialist SKILL.md - Accessibility methodologies

Sources

Nielsen Norman Group - 10 Usability Heuristics
IDEO Design Kit - Human-Centered Design
WCAG 2.2 - Accessibility
Material Design - Google Design System
Human Interface Guidelines - Apple Design

UX/UI Designer Orchestrator v3.0 82 Methodologies | 3 Sub-Skills | Specialized Routing