Design Principle
Complex pages need short group labels, stable placement, and scannable boundaries to reduce comprehension cost.
Principle Complex pages need short group labels, stable placement, and scannable boundaries to reduce comprehension cost.
Design action Give every control or data group a one-to-four-word label; place it near the content and express boundaries with whitespace or a thin border.
Examples Positive example: Filters, settings sections, data panels, and form fieldsets need scope explanation. Counterexample: A group of controls is boxed without a title.
Apply when Filters, settings sections, data panels, and form fieldsets need scope explanation. 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.
Agent Directive
Give every control or data group a one-to-four-word label; place it near the content and express boundaries with whitespace or a thin border.