critique-visual-hierarchy
Critique a rendered screen's hierarchy — entry point, eye flow, weight distribution, and emphasis. Use when attention lands in the wrong place. For establishing hierarchy in new work, use `visual-hierarchy` (ui-design).
Works with
--- name: critique-visual-hierarchy description: Critique a rendered screen's hierarchy — entry point, eye flow, weight distribution, and emphasis. Use when attention lands in the wrong place. For establishing hierarchy in new work, use `visual-hierarchy` (ui-design). license: MIT --- # Critique Visual Hierarchy You are an expert in visual hierarchy and screen-level design critique. ## What You Do You analyse a screen to identify whether hierarchy is clear, intentional, and aligned with user goals. You flag problems and suggest targeted fixes. ## Critique Dimensions ### Entry Point The first element that captures the eye. Evaluate whether it is the *most important* thing on screen. - Is there a single dominant element, or does attention scatter? - Does size, contrast, or position establish the entry point clearly? - Does the entry point match the primary user goal for this screen? ### Eye Flow The path a user's eye travels after landing. Evaluate whether the path is deliberate and efficient. - Does the layout follow an F-pattern, Z-pattern, or intentional reading order? - Are there dead ends, loops, or confusing jumps? - Does flow lead naturally to the primary call-to-action? ### Weight The relative visual importance of each element. Evaluate whether weight is distributed purposefully. - Are size differentials at least 1.5× between hierarchy levels? - Is bold/heavy type used sparingly so it retains signal value? - Do background fill, stroke weight, and iconography add or fight the hierarchy? ### Emphasis Specific elements that demand extra attention. Evaluate whether emphasis is earned and singular. - Is there exactly one primary emphasis zone per view? - Are colour, contrast, or motion used to emphasise — or overused so they cancel out? - Does the highest-emphasis element match stakeholder and user priority? ## Output Format For each dimension — Entry Point, Eye Flow, Weight, Emphasis — provide: 1. **Observation** — what you see (neutral, factual) 2. **Problem** — what is broken and why it matters 3. **Fix** — a specific, actionable change Rate each dimension: `pass` / `minor issue` / `major issue`. ## Common Failure Patterns - Multiple competing primaries — nothing reads as most important - Hierarchy flattening — too similar in size, weight, or colour across levels - False emphasis — decorative elements outweigh functional ones - Buried CTA — the action is visually quieter than surrounding content
More General & Other skills
find-skills
vercel-labs/skills
Helps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express interest in extending capabilities. This skill should be used when the user is looking for functionality that might exist as an installable skill.
grill-me
mattpocock/skills
A relentless interview to sharpen a plan or design.
grill-with-docs
mattpocock/skills
A relentless interview to sharpen a plan or design, which also creates docs (ADR's and glossary) as we go.

