skills.rest
jezweb
jezwebCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ux-compare

Compares UX pattern libraries across multiple reference apps to produce recommendation documents.

989|102|Updated Oct 20, 2025
Search Tags:#comparison#Markdown#ux#recommendations#pattern library#design research#Competitive analysis
One-click install
npx skills add https://github.com/jezweb/claude-skills --skill ux-compare
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ux-compare
Source: https://github.com/jezweb/claude-skills/tree/main/plugins/dev-tools/skills/ux-compare
Command: npx skills add https://github.com/jezweb/claude-skills --skill ux-compare

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Deciding how to design a feature without knowing how leading apps handle it leads to guesswork. This Skill synthesizes multiple UX pattern libraries into an opinionated comparison document that identifies conventions, tradeoffs, and gaps.

Core Features & Use Cases

  • Cross-App Pattern Analysis: Reads 2+ pattern-library.md files produced by ux-extract and walks them category by category to identify convergence, divergence, unique approaches, and absences.
  • Opinionated Recommendations: Produces safe defaults, deliberate-choice tradeoffs, patterns to avoid, and gaps worth filling for a new or existing build.
  • Staleness and Coverage Tracking: Flags stale extracts and coverage gaps so recommendations are honestly qualified.
  • Use Case: Before building a billing page, compare how claude.ai, Linear, Notion, and Superhuman handle empty states and destructive actions, then receive a decision-ready document with cited sources.

Quick Start

Ask Claude to compare UX patterns across your extracted reference apps, for example by saying "compare how these apps handle empty states".

Frequently Asked Questions about ux-compare

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I compare UX patterns across multiple apps?▼

Run ux-extract on each reference app first to generate pattern-library.md files, then run the comparison to walk each category across libraries. The output identifies convergence, divergence, unique approaches, and absences with recommendations.

What is a UX pattern library comparison used for?▼

It is used before building a feature to learn conventions from reference apps, during design reviews to check whether a pattern is deliberate, and to produce design briefs where convergent patterns become the baseline.

Can I compare UX patterns with only one pattern library?▼

No, a comparison requires at least two pattern libraries. With only one library the skill stops and suggests running ux-extract on more apps first, since a single library is just a reference, not a comparison.

Does UX comparison require a browser or live app access?▼

No, the comparison is pure markdown analysis of existing pattern-library.md files. No browser is needed because the extraction step already captured the app data.

What are the limits of comparing many apps at once?▼

Comparisons scale non-linearly: 3 apps is comfortable and 5 is the upper bound of readability. Beyond 5 libraries, bucket apps into tiers or run several narrower comparisons instead of one large one.

Related Skills

Explore More Design & Creative Skills→
quranquran
1.9k

agent-browser

Automate browser interactions for web testing, form filling, screenshots, and data extraction.

Official
Advanced
xpert-aixpert-ai
8

prototype

Confirm design briefs before building clickable frontend prototypes.

Official
Intermediate
gonzalezpazmonicagonzalezpazmonica
47

visual-quality

Analyze UI screenshots against Figma exports for visual quality.

Community
Advanced
saolalabsaolalab
37

user-research

Synthesize qualitative user research into actionable recommendations.

Official
Basic