From ux-cognitive-load
Cognitive load audit of UI code. Use this skill when the user wants to audit, review, or analyze UI components for cognitive load, usability, or UX quality. Triggers on: "ux audit", "cognitive load audit", "audit my form", "review this UI for usability", "check cognitive load", "is this form too complex", "analyze UX of these components", or any request to evaluate UI code against cognitive load principles, usability heuristics, or form design best practices. Also triggers when the user provides UI file paths and asks about complexity, overwhelm, or user confusion.
How this skill is triggered — by the user, by Claude, or both
Slash command
/ux-cognitive-load:ux-auditThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Analyzes UI code for cognitive load issues using three parallel specialist agents, then synthesizes findings into a unified report.
Analyzes UI code for cognitive load issues using three parallel specialist agents, then synthesizes findings into a unified report.
ARGUMENTS: file paths, glob patterns, or directory paths to audit
Check if the user provided file paths or glob patterns as arguments.
AskUserQuestion tool to ask the user which files or directories to audit. Suggest they provide paths like src/components/** or specific files.Store the resolved file list for the agents. If zero UI files resolve, tell the user no auditable files were found and stop.
Before spawning agents, do a quick scan yourself:
This context summary gets passed to each agent so they don't waste tokens re-discovering basic facts.
Spawn all three agents in a single message using three Agent tool calls so they run concurrently.
Use the Agent tool with subagent_type: "UX Auditor". Pass this prompt:
Context: {context summary from Phase 1}
Files to audit: {file list with full paths}
Perform a cognitive load audit of these UI files. Read each file and evaluate against your cognitive load framework. Return your findings in this exact format:
Cognitive Load Analysis
Issues
# Severity Issue Location Recommendation 1 critical/warning/info description file:line how to fix Completeness: X/10
(How thoroughly you were able to evaluate the code — 10 means you covered every principle, lower means some were not applicable or not assessable from code alone)
Use the Agent tool with subagent_type: "Design Advisor". Pass this prompt:
Context: {context summary from Phase 1}
Files to audit: {file list with full paths}
Evaluate these UI files for design pattern quality. Read each file and assess against your design principles framework. Return your findings in this exact format:
Design Patterns Analysis
Issues
# Severity Issue Location Recommendation 1 critical/warning/info description file:line how to fix Completeness: X/10
Use the Agent tool with subagent_type: "Code Reviewer". Pass this prompt:
Context: {context summary from Phase 1}
Files to audit: {file list with full paths}
Analyze these UI files for code-level anti-patterns affecting cognitive usability. Read each file and check against your code review checklist. Return your findings in this exact format:
Code Review
Issues
# Severity Issue Location Recommendation 1 critical/warning/info description file:line how to fix Completeness: X/10
Once all three agents return, synthesize their reports into the final audit:
# UX Cognitive Load Audit Report
## Summary
- **Overall Score:** X/10
- **Critical Issues:** N
- **Warnings:** N
- **Info:** N
- **Files Audited:** file1, file2, ...
## Cognitive Load Analysis
{UX Auditor agent output — full issues table}
### Completeness: X/10
## Design Patterns Analysis
{Design Advisor agent output — full issues table}
### Completeness: X/10
## Code Review
{Code Reviewer agent output — full issues table}
### Completeness: X/10
## Priority Action Items
1. **[file:location]** — What to fix and why it matters most
2. ...
3. ...
4. ...
5. ...
Present the full report inline. Do not save to a file unless the user explicitly asks.
npx claudepluginhub thegoateddev/autoskillresearch-marketplace --plugin ux-cognitive-loadAudits usability of existing front-end code or live websites using 15 principles, identifies component/system issues, rates severity, and suggests fixes.
Audits frontend code for design consistency, accessibility (WCAG AA), responsive behavior, and UI/UX best practices before deployment or after design system changes.
Audits UI code against web accessibility, performance, and responsive design guidelines. Invoke for UI review, accessibility audit, or design best practices check.