hierarchy

Assess and improve visual hierarchy so the interface communicates priority immediately instead of making users decode it manually.

Use this when the problem is mainly priority and emphasis. If the bigger issue is arbitrary spacing, weak grouping, or monotonous layout rhythm, use arrange.

MANDATORY PREPARATION

Users start this workflow with /hierarchy. Once this skill is active, load $frontend-design — it contains design principles, anti-patterns, and the Context Gathering Protocol. Follow that protocol before proceeding — if no design context exists yet, you MUST load $setup first.

Assess Hierarchy Problems

Analyze where the interface is failing to prioritize clearly:

1. Run the grayscale test:
   • If color disappeared, would the screen still make sense?
   • Can you identify primary, secondary, and tertiary elements within about 2 seconds?