UX laws & cognitive principles
Fitts, Hick, Miller, Tesler, Doherty, Weber–Fechner, Von Restorff, peak–end… 17 laws with formula/threshold, a measurability tag, and a computable proxy.
Knowledge block for a computable UI-quality index (0–100). Privileges formulas, thresholds, and countable proxies. Measurability tags: *[AUTO] = derivable from DOMrenderstatic layout · [BEHAV] = needs interaction/telemetry data · [JUDGE]*= expert/heuristic judgment.*
1. Fitts's Law
Statement: Time to acquire a target is a function of its distance and size — bigger/closer targets are faster to hit. Formula: MT = a + b·log₂(2A/W) (Fitts original) or Shannon form MT = a + b·log₂(A/W + 1). The log term is the Index of Difficulty (ID), in bits. a,b empirical (regression). 2D extension uses effective width W along motion axis. Measurability: [AUTO] — target W (px), distance A from likely cursorthumb origin, and edgecorner pinning are all measurable from the rendered layout. Index signal: For each primary action, compute ID = log₂(AW+1); penalize small (<44px touch / <24px pointer) or far-from-flow targets. Reward screen-edgecorner placement (infinite effective width). Proxy: min_hit_area_px, primary_action_ID_bits, % interactive targets below WCAG/Apple 44px min.
2. Hick–Hyman Law
Statement: Decision time grows logarithmically with the number of equally-probable choices. Formula: RT = a + b·log₂(n + 1). With unequal probabilities, RT = a + b·Σ pᵢ·log₂(1/pᵢ + 1) (entropy form). Measurability: [AUTO] for n (count of competing controls per decision point); [BEHAV] for actual RT. Index signal: Count competing choices per decision surface (menu items, nav links, toolbar buttons, form-field options). Flag decision points with high n; reward chunkingprogressive disclosurecategorization (which reduces effective n per step). Proxy: max_choices_per_decision_point, mean_nav_breadth, presence of grouping.
3. Miller's Law (7 ± 2)
Statement: Working memory holds ~7 (range 5–9) chunks; design should chunk information, not assume a magic number. Threshold: capacity ≈ 5–9 items (modern estimates: ~4 chunks, Cowan). Chunking expands effective capacity. Measurability: [AUTO] — count ungrouped items in any listmenugroup. Index signal: Flag flat listsmenusoption groups exceeding ~7 items without subgrouping. Reward chunked phone/card numbers, grouped form sections. Proxy: % groups with >9 ungrouped peers, chunking_present.
4. Tesler's Law (Conservation of Complexity)
Statement: Every system has irreducible complexity; it can only be shifted between user and system, never eliminated. Formula/threshold: none (conservation principle). Heuristic: an engineer-week reducing complexity beats millions of users spending an extra minute. Measurability: [JUDGE] — qualitative; partial [AUTO] proxy via input burden. Index signal: Measure complexity borne by the user: count required manual inputs that could be inferreddefaultedauto-filled. Proxy: required_fields_without_smart_default, manual_steps_vs_automatable_steps. Lower user-borne complexity → higher score.
5. Jakob's Law
Statement: Users spend most time on other sites/apps, so they expect yours to work the same way — honor established conventions. Formula/threshold: none. Measurability: [JUDGE] / [AUTO] via convention checklist. Index signal: Conformance to platform/web conventions: logo top-left links home, cart top-right, nav placement, primary-button styling, recognized icon semantics (hamburger, gear, magnifier). Proxy: convention_conformance_score (checklist hit-rate against a pattern library).
6. Doherty Threshold
Statement: Productivity soars when system and user interact below a response latency where neither waits on the other. Threshold: < 400 ms response time (Doherty & Thadhani, IBM 1982). Productivity peaks ~400ms; diminishing returns below ~100ms. (Note also Nielsen/Miller perceptual tiers: 0.1s = instant, 1s = unbroken flow, 10s = attention lost.) Measurability: [BEHAV]/[AUTO] — measurable from render/interaction timing (TTI, INP, response-to-input latency). Index signal: Hard, automatable gate. Score interaction latency against 400ms (and 100ms/1s tiers); reward perceived-performance tricks (skeletons, optimistic UI, progress indicators >1s). Proxy: INP_ms, % interactions >400ms, feedback_within_400ms_bool.
7. Weber–Fechner Law
Statement: Perceived change is proportional to the relative (not absolute) change of a stimulus; perception scales logarithmically. Formula: Weber: ΔI/I = k (JND is a constant fraction of baseline). Fechner (integrated): S = k·ln(I) + C (sensation ∝ log of stimulus). Measurability: [AUTO] for magnitude ratios in the render (sizes, durations, color/contrast deltas). Index signal: (a) Typographic/spacing scales should be ratio-based (modular scale 1.2–1.5×) so steps are perceptibly distinct — flag near-equal sizes (<Weber fraction apart) that read as "accidentally different." (b) Favor incremental redesigns over jarring overhauls. Proxy: type_scale_ratio_consistency, adjacent_size_steps_below_JND.
8. Goal-Gradient Effect
Statement: Motivation/effort increases as one nears a goal; perceived progress accelerates completion. Formula/threshold: none closed-form (Hull's gradient: response strength rises with proximity to reward); empirically supported by endowed-progress experiments. Measurability: [BEHAV] (completion/abandon rates per step); [AUTO] for presence of progress mechanics. Index signal: Reward visible progress indicators, step counters, endowed progress ("step 1 of 4 already done"), and front-loaded perceived progress in multi-step flows. Proxy: progress_indicator_present, endowed_progress_bool, step-wise abandonment_curve.
9. Zeigarnik Effect
Statement: People remember/feel pull toward incomplete tasks more than completed ones. Formula/threshold: none. Measurability: [BEHAV] / [AUTO] for presence of completion cues. Index signal: Reward incompleteness cues that drive re-engagement: progress bars showing remaining work, profile-completion meters, checklists, "draft saved" resume affordances. Proxy: completion_meter_present, resumable_state_bool.
10. Serial Position Effect (Primacy + Recency)
Statement: Items at the beginning (primacy) and end (recency) of a list are best recalled; middle items are weakest. Formula/threshold: none (U-shaped recall curve). Measurability: [AUTO] — positional; check whether high-value items occupy first/last slots. Index signal: Verify primarydestructivemost-used actions sit at list extremities (e.g., key nav items first & last, primary CTA at end of a toolbar). Proxy: primary_action_at_extremity_bool, important_items_in_middle_penalty.
11. Peak–End Rule
Statement: People judge an experience largely by its most intense moment (peak) and its end, not the average. Formula/threshold: none (memory-vs-experienced-utility, Kahneman). Measurability: [BEHAV]/[JUDGE]; [AUTO] for presence of designed peak/end moments. Index signal: Reward a deliberate positive peak (delight moment) and a strong ending (success/confirmation screens, satisfying completion states); penalize abrupt or error-laden endings. Proxy: success_state_quality, end_of_flow_friction, presence of micro-delight.
12. Von Restorff (Isolation) Effect
Statement: When multiple similar items are present, the one that differs is most likely noticed and remembered. Formula/threshold: none. Measurability: [AUTO] — visual-salience contrast is computable from render (colorsizeweight deltas vs. neighbors). Index signal: Exactly one primary CTA should be visually isolated/salient per view; penalize multiple competing "primary" emphases (salience collision) and penalize a primary action that fails to stand out. Proxy: count_primary_emphasis_per_view (target 1), CTA_salience_contrast_score. Caveat: don't isolate via color alone (a11y).
13. Postel's Law (Robustness Principle)
Statement: "Be conservative in what you send, liberal in what you accept" — tolerate varied/imperfect user input, output cleanly. Formula/threshold: none. Measurability: [AUTO] via input-tolerance tests. Index signal: Reward input forgiveness: accept phonedatecard formats withwithout spacesdashes, trim whitespace, case-insensitive emails, paste tolerance, lenient validation with normalization. Proxy: input_normalization_coverage, % fields rejecting trivially-fixable input.
14. Occam's Razor
Statement: Among designs that achieve the goal, the one with the fewest elements/assumptions is best — remove the unnecessary. Formula/threshold: none (parsimony heuristic). Measurability: [AUTO] via element/step counts relative to task. Index signal: Penalize redundant elements, decorative chrome, and steps that don't advance the task. Proxy: elements_per_task, steps_to_complete_primary_task, interactive_to_decorative_ratio. Lower (sufficient) complexity → higher score.
15. Parkinson's Law
Statement: Work expands to fill the time available; in UX, tasks expand to consume the time/affordance given — so constrain it. Formula/threshold: none. Measurability: [BEHAV] (task-time distributions); [AUTO] for presence of constraints. Index signal: Reward time-saving constraints: autofill, smart defaults, deadlines/timers, sane field limits, "skip" paths. Proxy: time_on_task vs. theoretical minimum, autofill_default_coverage.
16. Flow (Csíkszentmihályi)
Statement: Optimal engagement occurs when challenge matches skill, with clear goals and immediate feedback — keep users "in the zone." Formula/threshold: none closed-form; conditions: clear goals, immediate feedback, challenge≈skill balance, no disruptions. Measurability: [BEHAV]/[JUDGE]; partial [AUTO] for interruption/feedback presence. Index signal: Penalize flow-breakers: unexpected modals/interstitials, latency spikes (>1s, ties to Doherty), context switches, missing immediate feedback on action. Proxy: interruptions_per_task, feedback_latency, modal_interrupt_count.
17. Aesthetic–Usability Effect
Statement: Users perceive aesthetically pleasing designs as more usable — and are more tolerant of minor usability problems. Formula/threshold: none (Kurosu & Kashimura 1995; replicated NN/g). Correlation, not causation of actual usability. Measurability: [JUDGE]; [AUTO] proxies for visual quality (alignment, spacing rhythm, contrast, grid adherence, type hierarchy). Index signal: Compute objective "polish" proxies — gridalignment consistency, spacing on a consistent scale, contrastWCAG compliance, typographic hierarchy clarity, visual balance. These both raise the score and modulate tolerance. Proxy: alignment_consistency, spacing_scale_adherence, contrast_pass_rate, type_hierarchy_levels.
Top picks for an automatable index
(highest formulathresholdcountability density — build the index core on these first)
- Fitts's Law —
ID = log₂(A/W+1)per primary action; target size & distance fully measurable. [AUTO] - Doherty Threshold — hard 400ms (and 100ms1s10s tiers) latency gate via INPrender timing. *[AUTOBEHAV]*
- Hick–Hyman —
RT = a+b·log₂(n+1); count competing choices per decision point. [AUTO] - Miller's Law — flag ungrouped sets > ~7 items; reward chunking. [AUTO]
- Von Restorff — count primary-emphasis collisions (target = 1) + CTA salience contrast. [AUTO]
- Weber–Fechner —
ΔI/I=k; enforce ratio-based type/spacing scale, flag sub-JND size steps. [AUTO] - Aesthetic–Usability — alignmentspacingcontrast/type-hierarchy polish proxies. [AUTO]
- Postel's Law — input-normalization/tolerance coverage across form fields. [AUTO]
Behavioral-only but high-value when telemetry exists: Goal-Gradient, Peak–End, Parkinson's, Flow (interruption/latency counts bridge them to AUTO).
Sources
- Fitts's Law — Laws of UX · Understanding Fitts' Law (Human Kinetics) · Buxton — Extending Fitts' law to 2D
- Hick's Law — Laws of UX
- Miller's Law — Laws of UX
- Tesler's Law — Laws of UX · Law of Conservation of Complexity — Wikipedia
- Jakob's Law — Laws of UX
- Doherty Threshold — Laws of UX · O'Reilly — Laws of UX, ch.10
- Weber–Fechner law — Wikipedia · Just-noticeable difference — Wikipedia
- Goal-Gradient Effect — Laws of UX
- Zeigarnik Effect — Laws of UX
- Serial Position Effect — Laws of UX
- Peak–End Rule — Laws of UX
- Von Restorff Effect — Laws of UX
- Postel's Law — Laws of UX
- Occam's Razor — Laws of UX
- Parkinson's Law — Laws of UX
- Flow — Laws of UX
- Aesthetic–Usability Effect — Laws of UX · NN/g — Aesthetic-Usability Effect
- NNg — Response Times: The 3 Important Limits (0.1s1s/10s) · Nulab — The 28 Laws of UX