|
| 1 | +--- |
| 2 | +name: uxui-principles |
| 3 | +description: 'Evaluate interfaces against 168 research-backed UX/UI principles and detect UX antipatterns. Use this skill when: (1) Auditing an interface design for UX issues, (2) Checking if a UI follows research-backed best practices, (3) Detecting antipatterns and UX smells in existing designs, (4) Reviewing AI-powered interfaces for trust, transparency, and human override, (5) Checking user flows against decision and feedback principles, (6) Injecting UX context into a coding session before implementation. Triggers: "audit this interface", "check UX", "evaluate design", "find antipatterns", "UX review", "does this follow UX principles", "review my UI", "check this flow", "vibe coding UX".' |
| 4 | +--- |
| 5 | + |
| 6 | +# UX/UI Principles |
| 7 | + |
| 8 | +A collection of 5 agent skills backed by 168 research-based UX/UI principles and 2,098+ academic citations. Evaluate interfaces, detect antipatterns, and inject UX expertise into your AI-assisted workflow. |
| 9 | + |
| 10 | +**Repository:** https://github.com/uxuiprinciples/agent-skills |
| 11 | + |
| 12 | +## Install |
| 13 | + |
| 14 | +```bash |
| 15 | +npx skills add uxuiprinciples/agent-skills |
| 16 | +``` |
| 17 | + |
| 18 | +## Skills in This Collection |
| 19 | + |
| 20 | +### uxui-evaluator |
| 21 | + |
| 22 | +Evaluate interface descriptions against 168 research-backed UX/UI principles. Returns structured findings with severity, matched principles, and remediation steps. |
| 23 | + |
| 24 | +**Use when:** You want a comprehensive UX audit of a screen, component, or interaction pattern. |
| 25 | + |
| 26 | +### interface-auditor |
| 27 | + |
| 28 | +Detect UX antipatterns (smells) using the uxuiprinciples smell taxonomy. Returns matched symptoms, severity levels, and step-by-step remediation recipes. |
| 29 | + |
| 30 | +**Use when:** Something feels wrong with a design but you need to pinpoint the specific antipattern. |
| 31 | + |
| 32 | +### ai-interface-reviewer |
| 33 | + |
| 34 | +Audit AI-powered interfaces against 44 principles covering transparency, trust calibration, human override, consent, agentic workflows, and conversational design. |
| 35 | + |
| 36 | +**Use when:** Reviewing a chatbot, AI assistant, copilot feature, or any interface with AI-generated output. |
| 37 | + |
| 38 | +### flow-checker |
| 39 | + |
| 40 | +Check user flows against decision, error recovery, and feedback principles. Identifies drop-off risks and missing states. |
| 41 | + |
| 42 | +**Use when:** Designing or reviewing a multi-step flow such as onboarding, checkout, or form submission. |
| 43 | + |
| 44 | +### vibe-coding-advisor |
| 45 | + |
| 46 | +Inject UX context into vibe coding sessions. Reviews planned implementation against UX principles before code is written. |
| 47 | + |
| 48 | +**Use when:** Starting a new component or feature and you want UX guidance baked in from the start. |
| 49 | + |
| 50 | +## How It Works |
| 51 | + |
| 52 | +1. Add the skill collection to your agent |
| 53 | +2. Describe the interface, screen, or flow you want to evaluate |
| 54 | +3. The skill returns structured findings: severity level, principle violated, and remediation steps |
| 55 | +4. API key optional: connect to uxuiprinciples.com for enriched output with full citations and detailed remediation recipes |
| 56 | + |
| 57 | +## Example Usage |
| 58 | + |
| 59 | +``` |
| 60 | +Evaluate this checkout flow against UX principles: |
| 61 | +- Step 1: Cart summary with item list and total |
| 62 | +- Step 2: Email entry (no guest checkout option) |
| 63 | +- Step 3: Payment form (card only) |
| 64 | +- Step 4: Confirmation page |
| 65 | +``` |
| 66 | + |
| 67 | +The skill returns findings like: |
| 68 | +- **High severity:** No guest checkout violates Principle #47 (Minimize Friction at Critical Moments) |
| 69 | +- **Medium severity:** Single payment method violates Principle #89 (Provide Alternatives) |
| 70 | +- **Low severity:** Missing order edit option on confirmation page |
| 71 | + |
| 72 | +## Principles Coverage |
| 73 | + |
| 74 | +| Category | Principles | |
| 75 | +|----------|-----------| |
| 76 | +| Visual Hierarchy & Layout | 1-24 | |
| 77 | +| Navigation & Wayfinding | 25-48 | |
| 78 | +| Forms & Input | 49-72 | |
| 79 | +| Feedback & System Status | 73-96 | |
| 80 | +| Error Handling | 97-120 | |
| 81 | +| Trust & Credibility | 121-144 | |
| 82 | +| AI Interface Patterns | 145-168 | |
0 commit comments