memory

Cognitive Load

The total amount of mental effort required to use and understand an interface at any moment.

Plain English

Cognitive load is the effort tax your design charges users. Every new concept to learn, every label to read, every decision to make, every inconsistency to reconcile adds to the bill. When the bill gets too high, users give up or make mistakes. The goal of good UI design is to reduce the cognitive load of every interaction — not through simplification alone, but by making the effort proportionate to the value delivered.

Research background

Cognitive load theory (Sweller, 1988) identifies three types: intrinsic (inherent complexity of the task), extraneous (complexity introduced by poor design), and germane (processing that builds understanding). Good UI design reduces extraneous load. Techniques: chunking information (7±2 items per group), progressive disclosure (show details only when needed), consistent patterns (reduce learning per interaction), and spatial memory (stable layouts reduce reorientation cost).

UI examples

✓ Applying the principle

A settings page that groups related options into 5 labelled sections instead of listing all 40 settings alphabetically — same information, far less cognitive load.

✗ Violating it

A registration form that shows all 12 fields at once, including optional ones — overwhelming and unnecessarily complex.

AI Prompt

Paste into Claude, Cursor, Bolt, or v0.

Reduce cognitive load: group related form fields (max 4-5 per group), use progressive disclosure for advanced settings, maintain consistent component placement across pages, and limit visible choices per section.