establish-visual-hierarchy

What problem does it solve?

This skill helps you determine which UI element users notice first, second, and third so the screen communicates priority instead of feeling equally weighted.

Core Features & Use Cases

• Multi-factor hierarchy assessment: Evaluates visual weight using size, weight, color contrast, whitespace, and de-emphasis.
• De-emphasis of competitors: Identifies secondary elements that distract from the primary focus and recommends how to soften them.
• PASS/FAIL decision criteria: Flags common failures like relying only on font size or making everything look equally important.

Use it when you are reviewing a marketing page, a dashboard card, an empty-state screen, or any component where the visual priority feels unclear (e.g., the primary CTA isn’t getting attention).

Quick Start

Tell the AI to evaluate a UI design by listing each element with its importance and returning a ranked hierarchy plus recommendations.