Design Principle
Density is not a whole-page property; it is a ladder that changes with task depth.
Principle
Density is not a whole-page property; it is a ladder that changes with task depth.
Design action
Show only judgment fields in overview; add history, relationships, raw data, and actions in details with a higher density.
Examples
Positive example: Overview pages connect to detail pages, drawers, expanded rows, or drill-downs. Counterexample: Overview layers contain every field.
Apply when
Overview pages connect to detail pages, drawers, expanded rows, or drill-downs. Users need to judge state, scope, risk, or next action quickly.
Source notes
Source note: Synthesized from Apple HIG, Material Design, NN/g usability principles, and layout/hierarchy practices in mature design systems. Apple HIG Layout: https://developer.apple.com/design/human-interface-guidelines/layout Material Design Layout: https://m3.material.io/foundations/layout/applying-layout NN/g Visual Design Principles: https://www.nngroup.com/articles/principles-visual-design/
Agent Directive
Show only judgment fields in overview; add history, relationships, raw data, and actions in details with a higher density.