Detect frontend UX anti-patterns in code reviews and UI features.
npx skills add https://github.com/cassiozen/UX-antipatterns --skill ux-antipatterns
Please help me install this Agent Skill. Skill: ux-antipatterns Source: https://github.com/cassiozen/UX-antipatterns/tree/main Command: npx skills add https://github.com/cassiozen/UX-antipatterns --skill ux-antipatterns
Detects and prevents the frontend UX anti-patterns that frustrate users with layout shifts, missing feedback, lost input, racing states, or focus theft during reviews and implementations.
references/antipatterns.md, mapping symptoms to harm and fixes.Ask the agent to scan the frontend code for layout, feedback, and accessibility anti-patterns using the heuristics before merging.
High-intent search queries and answers about installing and using this skill.
To detect frontend UX anti-patterns during a code review, scan the UI code for layout shifts, missing feedback, lost input, racing states, and focus theft using established heuristics. Group findings by category, cite specific file incidents, and recommend concrete remediation steps before merging.
Common frontend UX anti-patterns that frustrate users include layout shifts, missing feedback, lost input, racing states, and focus theft. These issues typically occur in components, pages, forms, and interactive flows when accessibility and UX heuristics are not applied during implementation.
Yes, you can audit new UI features for accessibility and UX issues before merging by applying reference heuristics to the code. This process maps symptoms to harm explanations and provides concrete fixes, ensuring components, pages, forms, and interactive flows align with best practices.
To provide pull request feedback for frontend UX issues, load reference heuristics, scan the code, group findings by anti-pattern categories, and cite specific file and line incidents. Explain the harm caused by each issue and recommend concrete fixes to prevent user frustration.
The best way to prevent racing states and focus theft in web forms is to evaluate the interactive flows against established anti-pattern categories. Map the identified symptoms to their specific user harm and implement the concrete remediation steps provided by the heuristics.
pratosAnalyze codebase implementation details with precise file:line references.
vadimcomanescuIdentify website accessibility gaps against WCAG guidelines and return a prioritized remediation plan.
Chris-MaskeyCompress pull request review findings into one-line comments with location, problem, and fix.
alexwoxReview UI code against Web Interface Guidelines and output file:line findings.