Ux Toolkit

UX Toolkit

Professional-grade meta-skill for systematic UX evaluation across 9 domains. Framework-agnostic design works for web, mobile, and desktop applications.

When to Use

Invoke for:

• UI/UX heuristic evaluations (Nielsen + modern methodologies)
• Accessibility (WCAG 2.2) compliance audits
• User flow & friction analysis
• Responsive/cross-device testing
• Interaction & micro-interaction review
• Design system consistency audits
• Content & UX writing review
• AI/ML interface patterns
• Privacy & ethical design review

Audit Type Selection

What do you need to evaluate?
    │
    ├─► Full UX Audit ─────────► Load ALL references
    │
    ├─► Accessibility Only ────► Load accessibility-inspector.md
    │
    ├─► Usability Review ──────► Load heuristic-audit.md + user-flow-analysis.md
    │
    ├─► Visual/Responsive ─────► Load responsive-behavior.md + interaction-review.md
    │
    ├─► Design System ─────────► Load design-system-audit.md
    │
    ├─► Content Audit ─────────► Load content-ux-audit.md
    │
    ├─► AI Interface ──────────► Load ai-ux-patterns.md
    │
    └─► Privacy/Ethics ────────► Load privacy-ethics-audit.md

Sub-Workflows

| Domain | Reference | Purpose | |--------|-----------|---------| | Heuristic Audit | references/heuristic-audit.md | Nielsen's 10 + modern methodologies (OOUX, JTBD, Cognitive Walkthrough) | | A11Y Inspector | references/accessibility-inspector.md | WCAG 2.2 AA/AAA, keyboard nav, screen readers | | Flow Analysis | references/user-flow-analysis.md | Task paths, friction points, cognitive load | | Responsive | references/responsive-behavior.md | Breakpoints, touch targets, RTL/LTR, PWA | | Interactions | references/interaction-review.md | Micro-interactions, animations, feedback | | Design System | references/design-system-audit.md | Token consistency, component audit | | Content UX | references/content-ux-audit.md | UX writing, readability, voice & tone | | AI/ML Patterns | references/ai-ux-patterns.md | Explainability, trust, ML error handling | | Privacy & Ethics | references/privacy-ethics-audit.md | Dark patterns, consent, GDPR/DSA compliance |

Quick Start

1. Define Scope

Audit Scope:
├── Screens/Pages: [List target screens]
├── User Flows: [Primary conversion, core tasks]
├── Platform: [Web/Mobile/Desktop/All]
├── WCAG Target: [A/AA/AAA]
└── Priority Focus: [Accessibility/Usability/Performance]

2. Select Audit Type

| Type | References | Time | Coverage | |------|------------|------|----------| | Quick A11Y | accessibility-inspector.md | 1-2h | Automated + keyboard nav | | Heuristic Review | heuristic-audit.md | 2-4h | Nielsen's 10 + severity | | Full UX Audit | All 9 references | 1-2d | Complete evaluation | | Focused Audit | 2-3 specific refs | 3-6h | Targeted domain review |

3. Execute Workflow

Each reference contains:

• Checklist items w/ pass/fail criteria
• Severity + effort classification
• Remediation guidance
• Tool recommendations

4. Generate Report

python3 scripts/generate_report.py --type [full|heuristic|a11y|flow|responsive|interaction] --output report.md --format [md|json|csv]

Severity Classification

| Level | Impact | Frequency | Priority | Action | |-------|--------|-----------|----------|--------| | Critical | Blocks task | Any | P0 | Fix immediately | | Major | Significant friction | >50% users | P1 | Fix before release | | Minor | Reduced efficiency | 4 hours, architectural | Navigation restructure, focus management |

Modern Methodologies

Beyond Nielsen's 10 heuristics, this toolkit incorporates:

| Methodology | Focus | When to Use | |-------------|-------|-------------| | Cognitive Walkthrough | Task completion probability | Complex flows, onboarding | | OOUX | Object-noun consistency | Information architecture | | JTBD | Job stories validation | Feature validation | | Six Minds Framework | Cognitive architecture | Complex interfaces | | Baymard Heuristics | E-commerce specifics | Shopping flows |

WCAG Compliance Levels

| Level | Requirement | Target | |-------|-------------|--------| | A | Minimum accessibility | Baseline | | AA | Acceptable accessibility | Standard target | | AAA | Enhanced accessibility | Specific audiences |

WCAG 2.2 Status: This toolkit covers all 9 new WCAG 2.2 criteria (October 2023).

Platform Adapters

| Platform | Automated Testing | Manual Testing | |----------|------------------|----------------| | Web | axe-core, Lighthouse | Browser DevTools | | iOS | Xcode Accessibility Inspector | VoiceOver | | Android | Accessibility Scanner (ADB) | TalkBack | | Desktop | Platform-specific tools | Keyboard + screen reader | | Design Files | Figma plugins (Stark, A11y) | Manual review |

Integration Points

| Tool | Purpose | Usage | |------|---------|-------| | axe-core | Automated a11y | scripts/run_axe.js | | Lighthouse | Performance + a11y | Chrome DevTools | | Contrast Checker | Color ratios | scripts/check_contrast.py | | Readability | Content grade level | Flesch-Kincaid analysis | | Visual Regression | Layout stability | BackstopJS/Playwright |

Process Overview

1. Scope Definition     → Define screens/flows to audit
2. Reference Loading    → Load relevant sub-workflow(s)
3. Automated Scans      → Run axe-core, Lighthouse
4. Manual Review        → Execute checklists
5. Finding Capture      → Document w/ severity + effort
6. Prioritization       → Apply Impact × Frequency matrix
7. Report Generation    → Compile actionable report

Anti-Patterns to Detect

| Anti-Pattern | Category | Severity | |--------------|----------|----------| | Confirm-shaming | Dark Pattern | Critical | | Hidden costs | Dark Pattern | Critical | | Forced continuity | Dark Pattern | Major | | No loading feedback | Visibility | Major | | Keyboard traps | Accessibility | Critical | | Color-only indicators | Accessibility | Major | | Infinite scroll w/o footer | Navigation | Minor | | Auto-playing video w/ sound | Attention | Major |

Competitive Benchmarking

For comprehensive audits, compare key flows against 1-2 competitors:

| Metric | Your Product | Competitor A | Competitor B |
|--------|--------------|--------------|--------------|
| Task completion time | Xs | Xs | Xs |
| Click count | X | X | X |
| Error rate | X% | X% | X% |
| A11y score (Lighthouse) | X | X | X |

Report Formats

| Format | Use Case | Command | |--------|----------|---------| | Markdown | Documentation, PRs | --format md | | JSON | Jira/Linear import | --format json | | CSV | Spreadsheet analysis | --format csv |

Files Structure

ux-toolkit/
├── SKILL.md                          # This file
├── references/
│   ├── heuristic-audit.md            # Nielsen + modern heuristics
│   ├── accessibility-inspector.md    # WCAG 2.2 compliance
│   ├── user-flow-analysis.md         # Flow & friction analysis
│   ├── responsive-behavior.md        # Cross-device behavior
│   ├── interaction-review.md         # Micro-interactions
│   ├── design-system-audit.md        # Token & component audit
│   ├── content-ux-audit.md           # UX writing & readability
│   ├── ai-ux-patterns.md             # AI/ML interface patterns
│   └── privacy-ethics-audit.md       # Dark patterns & consent
├── scripts/
│   ├── check_contrast.py             # Color contrast checker
│   ├── generate_report.py            # Report generator
│   └── run_axe.js                    # Automated a11y testing
└── data/
    └── issues-database.json          # Common issues + remediation

---

Ref: Load specific references/*.md for detailed checklists & workflows.

Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

• Author: hackermanishackerman
• Source: hackermanishackerman/claude-skills-vault
• License: MIT
• Homepage: https://hackermanishackerman.github.io

Install and usage instructions live in the source repository linked above.