Skip to main content
Skill Gallery
Interface Quality Product And Design Combo

UI/UX Quality Review

A practical UI/UX review skill for agents and humans. Each principle has a human view and an agent view: the principle on top, then the checkable rules and thresholds an agent runs against the screen.

Try in BuildOS Read guide SKILL.md

Sources

7

Refs

3

Steps

7

Outputs

3

What It Does

Use it when the job needs a real procedure.

Reviewing an app screen, dashboard, mobile flow, product workflow, modal, form, table, or chart.

Reviewing AI-generated UI from v0, Lovable, Cursor, or Bolt before it ships.

The user asks for a UI/UX audit without naming accessibility, marketing, design systems, research, calm, or delight as the main lens.

Diagnosing why a UI feels amateur, cluttered, or hard to trust.

You need a compact findings list with severity, evidence, and concrete fixes.

Outputs

interface auditfix listagent checks

The page is for humans first. The files in the rail make the same procedure available to agents.

Try It

Start with one of these prompts.

Audit this screen region by region and return the highest-leverage fixes.

Try in BuildOS

Turn this UI critique into agent-checkable rules.

Try in BuildOS

Procedure

The operating path

  1. 1

    Preflight. Confirm the user task on this surface in one sentence — if unclear, ask before reviewing. Capture or request: screenshots at mobile (375px), tablet (768px), desktop (1280px); light and dark mode if supported; interactive states (hover, focus, active, disabled, loading, error, empty) for primary controls; the design tokens in play (Inkprint for BuildOS surfaces) so fixes can be expressed in tokens, not arbitrary values. When only markup or code is available, reason directly from it — note unverifiable items (rendered contrast, real breakpoint behavior) instead of stalling on missing screenshots.

  2. 2

    If the UI is AI-generated or looks generic, load ui_ux_quality_review.ai_ui_smoke_test and run the fingerprint scan first.

  3. 3

    Load ui_ux_quality_review.foundation_checks and review areas 1–6 in order: flow & states, visual hierarchy, spacing & layout, typography, color & contrast, component consistency. Flow problems outrank pixel problems — if the user cannot complete the job, lead with that and keep cosmetic findings brief.

  4. 4

    Load ui_ux_quality_review.polish_and_fit_checks and review areas 7–11 in order: visual noise, icons & affordances, feedback & states, charts & data clarity, responsive fit. Skip chart checks when no data viz is present.

  5. 5

    For a targeted question (for example "fix my typography"), load only the reference covering that area and run just those checks — but still flag any blocking flow issue you notice.

  6. 6

    Tag out-of-scope findings for escalation instead of dropping them — route each by finding type to the owning sibling per Routing.

  7. 7

    Assemble the findings report using the Contract below, ordered by severity then user impact, ending with the top 3 fixes.

Boundaries

What the skill refuses or checks carefully

A finding without evidence is not a finding — if it cannot be tied to a specific component, class, region, or coordinate, do not include it.

Do not assign severity without referencing the rubric.

Do not over-index on personal taste. Tie each issue to comprehension, task completion, confidence, accessibility, or maintainability.

Do not recommend decorative gradients, extra cards, or ornamental effects as the first fix — subtraction beats addition.

Do not make every element the same visual weight, and do not stack contrast levers to make everything important.

Do not allow off-scale spacing or font-size values, and do not assume desktop spacing works on mobile.