Skill

UI/UX Best Practices

Review and guide UI/UX work for clean, professional, low-noise interfaces. Checks hierarchy, whitespace, responsiveness, and accessibility.

// ui-design;

Behaviour

What it does

Reviews hierarchy and ensures clear primary action per view
Checks whitespace structure and spacing rhythm
Identifies busy or noisy UI with too many decorations
Verifies responsive behaviour across breakpoints
Audits accessibility and WCAG compliance
Catches generic AI-generated UI patterns
Validates user flow and task completion over visual completion

When to use

Good fits

Before building pages or composed views

When reviewing AI-generated UI that feels generic

During executing-plans for UI-heavy features

As a quality gate before shipping UI work

Development harness

UX review loop

Part of the design-to-ship pipeline: brainstorming → technical-documentation → conformance-check → reconciling-changes → planning → project-setup → executing-plans → shipping. Install the full set for structured feature work.

Test-Driven Development End-to-End Testing Component Development Component Testing

View full harness

Install

Get this skill

Uses Agent Kit via npx; no global install required.

Quick install

npx @levi-putna/agent-kit@latest add levi-putna/skills --skill ui-ux-best-practices

Global (Cursor)

npx @levi-putna/agent-kit@latest add levi-putna/skills --skill ui-ux-best-practices --global --agent cursor

Global (Claude)

npx @levi-putna/agent-kit@latest add levi-putna/skills --skill ui-ux-best-practices --global --agent claude

Project install

npx @levi-putna/agent-kit@latest add levi-putna/skills --skill ui-ux-best-practices --project

Interactive install

npx @levi-putna/agent-kit@latest add levi-putna/skills

Uninstall

npx @levi-putna/agent-kit@latest remove ui-ux-best-practices

Example

Example prompt