Quality Checklist

Quality Checklist

A systematic pass through every dimension of design quality.

How to use

• /quality-checklist Run a quality evaluation on any design in this conversation.

Constraints

Hierarchy

• [ ] Clear primary element on every screen
• [ ] Visual weight matches content priority
• [ ] No unintentional competing elements at the same hierarchy level
• [ ] Eye path follows the intended reading order

Typography

• [ ] Type scale uses a consistent ratio
• [ ] Weight usage is systematic with named purposes
• [ ] Line height varies appropriately (tighter headlines, looser body)
• [ ] No more than 4-6 sizes per screen with clear justification
• [ ] Typeface matches product voice

Color

• [ ] Every color has a clear, non-overlapping role
• [ ] Semantic colors are consistent everywhere
• [ ] Neutrals do 80-90% of the heavy lifting
• [ ] Sufficient contrast for accessibility (WCAG AA minimum)

Space

• [ ] Spacing follows a consistent scale
• [ ] Proximity signals correct relationships
• [ ] Density matches the use case
• [ ] Margins create appropriate breathing room

Craft

• [ ] Border radii consistent across element types
• [ ] Alignment pixel-perfect where intended
• [ ] All states covered: loading, empty, error, success, overflow
• [ ] Transitions purposeful and consistently timed

System

• [ ] Design could scale to 10 more screens without breaking
• [ ] Another designer could extend this without asking questions
• [ ] Components are reusable, not one-offs
• [ ] System breaks are intentional, not accidental

Anti-Patterns

• Checking only visual polish and ignoring information architecture
• Treating the checklist as pass/fail instead of diagnostic
• Running the checklist once and never revisiting

Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

• Author: Dragoon0x
• Source: Dragoon0x/taste-skills
• License: MIT

Install and usage instructions live in the source repository linked above.