Visual Hierarchy Analyzer

Input

Design Description

Landing page: top has a small logo left, nav links right. Hero is a centered headline (~28px), a gray subhead, and a blue 'Sign up' button the same size as a secondary 'Learn more' button beside it. Below are three equal feature cards. The testimonial and pricing are far down, and there's a second identical CTA in the footer.

Design Type

landing

Analysis Focus

conversion

Output (excerpt)

HIERARCHY ISSUES (conversion): 1) Headline at 28px is too quiet for a hero — bump to 44-56px to win the first 3 seconds. 2) Primary and secondary CTAs share weight — de-emphasize 'Learn more' (ghost/text style) so the eye commits to 'Sign up.' 3) Pricing and testimonials are below a long scroll — pull one proof point near the hero. 4) Two identical CTAs split focus; vary phrasing. PRIORITY FIX: enlarge headline + single dominant CTA. Expected lift: clearer scan path, faster decision.

Input

Design Description

Newsletter email: full-width hero image with white text baked into it, a light gray body text on white background (~13px), one orange button, and a footer with tiny 10px legal text and low-contrast unsubscribe link.

Design Type

email

Analysis Focus

accessibility

Output (excerpt)

ACCESSIBILITY HIERARCHY ISSUES: 1) Text baked into the hero image is invisible to screen readers and breaks when images are blocked — move headline to live HTML. 2) 13px light-gray body on white likely fails WCAG AA contrast — darken to at least #595959 and raise to 15-16px. 3) 10px legal text is illegible — min 12px. 4) Low-contrast unsubscribe risks compliance and trust — make it clearly visible. PRIORITY: live text + contrast. These also improve deliverability and skim-ability.

Input

Design Description

Analytics dashboard ported to mobile: a top row of four KPI cards squeezed side by side, a large line chart, then a dense data table with 8 columns. Everything is the same font size and weight, and the most important metric (revenue) sits third from left.

Design Type

dashboard

Analysis Focus

mobile

Output (excerpt)

MOBILE HIERARCHY ISSUES: 1) Four KPI cards in one row crush below ~90px wide — stack to a 2x2 grid and lead with Revenue, not third-from-left. 2) Uniform size/weight means nothing leads the eye — make the hero metric ~2x larger and bold. 3) An 8-column table is unusable on mobile — switch to a card list or horizontal scroll with a pinned first column. 4) The chart needs breathing room above the table. PRIORITY: reorder for importance + responsive KPI grid.