Playground
  • Introduction
  • Components

Density

The amount of information an interface can provide over a series of moments.

Visual density

Visual density refers to how many things users see in a given space. It’s a question of visual perception and consequently a result of color, sizing, spacing, and typography working together. Visual density is currently mostly addressed by spacing increment and its levels.

Information density

Information density measures how much information is communicated per unit of visual space. Information density is usually managed through higher-level constructs like components and how they’re composed—for example, deciding whether to use a table or cards.

Working memory can hold roughly 3-5 chunks of information at once. Effective designs group related information into meaningful units that can be processed as single chunks. Expertise expands effective capacity: experienced users recognise domain patterns and automatically chunk information, enabling them to process higher density interfaces that would overwhelm novices.

Design density

Design density represents the complexity and layering of design decisions, components, and interactions within the UI. High design density includes multiple interacting components, states, patterns, modals, nested interactions, or deeply layered navigation structures. Low design density emphasizes simplicity—fewer states, fewer types of interactions, more straightforward flow. Design density is embedded into interactions, flows, and patterns—especially at the composition level. For example, inline editing generally reduces information density but increases design density.

Temporal density

Temporal density is the amount of user value delivered per unit of time, treating time as a first-class design material. It addresses how quickly a person can perceive progress, make decisions, and achieve outcomes—without feeling rushed or confused. In practice, temporal density balances system latency (how fast the product responds) and cognitive latency (how fast a human can notice, understand, decide, and recover context).

Resources & references

  • Matt Ström-Awn on density
  • NN/g / Information density
  • The Visual Display of Quantitative Information by Edward Tufte
  • Cowan, N. (2001). The magical number 4 in short-term memory. Behavioral and Brain Sciences, 24, 87-185.
  • Mayer, R. E., & Moreno, R. (2003). Nine ways to reduce cognitive load in multimedia learning. Educational Psychologist, 38(1), 43-52.