skills.rest
FradSer
FradSerCOMMUNITY
Explore all skills by this author →
Website𝕏@FradSerGitHub

better-interface

Reviews interfaces holistically across accessibility, layout, writing, typography, colors, and UI domains.

588|49|Updated Aug 4, 2025
Search Tags:#design review#Tailwind#ux# accessibility#ui audit#interface review#Typography
One-click install
npx skills add https://github.com/FradSer/dotclaude --skill better-interface
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: better-interface
Source: https://github.com/FradSer/dotclaude/tree/main/interfaces/skills/better-interface
Command: npx skills add https://github.com/FradSer/dotclaude --skill better-interface

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Interface reviews often fragment into disconnected single-discipline audits that miss systemic issues, duplicate findings, or lack evidence. This Skill coordinates six domain references into one consolidated, prioritized review with verified findings and a clear verdict.

Core Features & Use Cases

  • Cross-Discipline Orchestration: Coordinates six domain references (accessibility, layout, writing, typography, colors, ui) in a fixed review order, assigning each finding to the domain that owns the underlying rule.
  • Quick and Full Modes: Quick mode caps at 5 HIGH/MEDIUM findings on the primary user path; full mode covers the entire scope including empty, loading, error, and narrow-width states with up to 15 findings.
  • Evidence-Based Findings: Every finding cites file and line, consolidates systemic root causes into single rows, records considered-but-rejected candidates, and ends with a Block, Needs changes, or Approve verdict.
  • Use Case: Ask for a full interface review of a checkout flow; the Skill inspects all six domains, runs available verification checks, and returns one ranked findings table with exact locations and fixes.

Quick Start

Ask the AI to run a full better-interface review of the current screen or flow and report consolidated findings by severity.

Frequently Asked Questions about better-interface

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

FAQPage Schema
How do I run a holistic UI review across accessibility, layout, and typography?▼

Invoke the better-interface skill with a scope such as a screen, flow, or feature. It reads six domain references in a fixed order, inspects the code and rendered states, and returns one consolidated findings table ranked by severity.

What is the difference between quick and full interface review modes?▼

Quick mode covers the primary user path and reports only HIGH and MEDIUM findings, capped at 5. Full mode covers the entire requested scope across all six domains, including empty, loading, and error states, with up to 15 findings.

Does the interface review work with Tailwind and CSS-in-JS projects?▼

Yes. The review first identifies the project's framework, styling system, tokens, and component conventions, then applies findings within that established system rather than imposing a new styling approach.

Can the review edit my code to fix the findings?▼

Reviews are read-only by default. Code is only modified when you explicitly request implementation, in which case the consolidated report becomes the change scope and verification is re-run afterward.

What happens if a domain reference file is missing?▼

That domain is marked Not reviewed with the missing reference named, and the review continues with the remaining domains. The skill never recreates missing rules from memory or claims coverage it did not perform.

Related Skills

Explore More Design & Creative Skills→
majesticlabs-devmajesticlabs-dev
47

viewcomponent-coder

Create and test reusable ViewComponent-based UI components in Rails.

Official
Advanced
alo-expalo-exp
6

gsd-review-fix

Apply atomic fixes with DCO sign-off and verify via tests and re-review.

Official
Advanced
samymitysamymity
1

browser-qa

Automate end-to-end browser QA for web applications with smoke, interaction, visual regression, and accessibility checks.

Community
Intermediate
artosetrovartosetrov

fix-design-system-finding

Apply a library-backed fix to a single Figma design-system node.

Community
Intermediate