Laws of UX & Cognitive Principles

These are not style opinions. Each "law" is a named finding from perceptual psychology, cognitive science, or behavioral economics that constrains how every human uses every screen — desktop, mobile, watch, voice, kiosk. Jon Yablonski's Laws of UX (lawsofux.com, 2020) collected the design-facing subset; the originals trace to the researchers credited below. Cite the source when you invoke a law in a design review — "this fails Fitts" lands harder than "the button feels small."

Read each law as a fixed five-part block: Origin (who/when), Principle (the mechanism, with the math where it exists), In the UI (one concrete control or screen), Implication (the general rule you derive), Pitfall (the failure mode). Keep "In the UI" and "Implication" distinct: the first is an example, the second is the rule.

The laws also combine — most good interactions satisfy several at once and most bad ones violate a cluster. A fast, optimistic submit serves Doherty and Flow; a forgiving, system-parsed input field serves Postel and Tesler and Recognition-over-recall. When two laws appear to conflict (Hick says fewer choices, but Jakob says match the conventional five-tab bar users expect), Jakob usually wins for plumbing and Hick for content — convention is a learned default that costs nothing, novelty is the expensive part.

1. Targeting & decision laws (the geometric ones)

Fitts's Law

• Origin: Paul Fitts, 1954. Formalized in The information capacity of the human motor system.
• Principle: Time to acquire a target = T ≈ a + b·log₂(2D/W), where D = distance to target, W = target width along the motion axis. Acquisition time grows logarithmically with distance and shrinks as the target gets bigger. Doubling size helps far more than the formula's modest log on distance suggests in dense UIs.
• In the UI: A primary CTA rendered 48px tall and placed near the user's current focus is hit fast; the same action as a 16px text link in a far corner is slow and error-prone. Screen edges and corners have effectively infinite width (the pointer stops dead) — macOS menu bar, Windows Start corner, the right-click context menu spawned at the cursor (D≈0).
• Implication: Make important, frequent targets big and near. Anchor destructive or rare targets far and small. Exploit edges, corners, and the pointer's own position for the loudest actions.
• Pitfall: Tiny icon-only buttons crammed together (toolbar of 24px glyphs at 4px gaps) — every click is a coin-flip. Also: a big visual button with a small hit area (padding outside the clickable region) silently breaks the law.