ref-sp-ux-designlisted

Design what a human sees and operates from evidence rather than taste: Gestalt grouping, visual hierarchy, spacing, typographic scale and measure, emphasis, palette construction in perceptually uniform colour, long-form readability, and mobile-first layout — with every claim labelled as research, standard, convention, or folklore. Use when: designing or reviewing a UI, page, screen, or component; asked why a layout feels off, cluttered, or unbalanced; choosing spacing, margins, padding, or a grid; picking font sizes, line height, or line length; deciding where bold, italic, or capitals belong; building or fixing a colour palette; turning a wall of text into a readable article or blog post; designing mobile-first or choosing breakpoints; or judging a design claim, trend, or 'law of UX' against what the research actually supports.
swiftpostlabs/agentic-tools · ★ 0 · Web & Frontend · score 71

Install: claude install-skill swiftpostlabs/agentic-tools

# UX Design ## Purpose Make design decisions defensible. Separate what perceptual research actually establishes from what is standard, what is merely a house convention, and what is folklore repeated until it sounded true. Trends rot; mechanisms do not. Everything in this skill is organised around **why** something works, so it survives the next redesign cycle. ## When to use this skill - Designing or reviewing a UI, page, screen, or component. - "This feels off / cluttered / unbalanced / cheap" — and nobody can say why. - Choosing spacing, margins, padding, or a layout grid. - Picking type sizes, line height, or line length; deciding where bold, italic, or caps belong. - Building or repairing a colour palette. - Turning a wall of text into something people will actually read. - Mobile-first layout and breakpoint decisions. - Someone cites a "law of UX", a trend, or a design-system rule as if it settled the argument. **Route elsewhere when:** the question is whether something *passes* — contrast ratio, target size, reflow, focus visibility, any WCAG threshold. That is `.agents/skills/ref-sp-ux-accessibility/SKILL.md`, which owns every normative number. This skill tells you how to build a palette; that one tells you whether the pair is legal. **The ownership rule, stated so it can be checked:** this skill names WCAG success criteria by number (SC 1.4.1, SC 2.5.8) and never states their threshold *values*. One deliberate exception is recorded in `./references/typography.