Blur your eyes to check weight

Blur it until it's unreadable. The heaviest blobs should matter most.

Brian Lovin@brian_lovin
A surprisingly large part of visual design is just blurring your eyes to make sure the weight of things feels good.
Oct 14, 2024View on X ↗

The slider does the squinting for you. Both demos use it.

Blurs both demos while pressed.

1 · Where does the eye land?

Hold “squint”: which blob is heaviest in each card?

Extras outweigh itBad
Most popular

Pro plan

$24 per seat / month

Unlimited projects, version history and priority support.

Compare all plans →
Heaviestbadge, icon, link
Action is heaviestGood
Most popular

Pro plan

$24 per seat / month

Unlimited projects, version history and priority support.

Compare all plans
Heaviestprice, Upgrade

2 · One number should win

Blur both dashboards: can you still find revenue?

Four equal blobsBad
Blurreda grey grid
Revenue leadsGood
Blurredone clear shape
// Squint on demand: paste in the console, run again to clear.
document.body.style.filter =
  document.body.style.filter ? "" : "blur(6px) grayscale(1)";

Why it matters, pros and cons

Why it matters

Blurred, only mass and contrast are left. That's what people see first, before they read a word.

Pros

  • Takes seconds and needs no tools: squint, or blur a screenshot.
  • Catches badges, icons and links that steal attention from the action.
  • Works on any screen, including ones you didn't design.

Cons

  • It checks weight, not meaning: labels and copy still need reading.
  • Color carries weight too; blur alone can hide a color-only problem.
  • Dense tools may have several equal peers, and that's fine.