User-controlled density vs Settings management vs Data grid vs Saved view

Choose user-controlled density when the user needs to switch between comfortable, standard, compact, or spacious spacing while keeping the same content, order, filters, and task model.

User-controlled density live example Settings management live example Data grid live example Saved view live example

Decision dimensions

Dimension	User-controlled density	Settings management	Data grid	Saved view
UI or UX	UI + UX - User-selectable compactness for rows, lists, cards, tables, grids, or work surfaces	UI + UX - Dedicated user or app configuration management surface	UI + UX - Interactive row-and-column data workspace	UI + UX - Persisted named presentation state for a data workspace
UI guidance	Render density as a visible segmented control, menu, or setting with named choices such as Comfortable, Standard, Compact, and Spacious, plus scope, preview, and reset feedback.	Render settings management as a durable configuration surface with a clear Settings or Preferences entry point, grouped categories, current values, setting descriptions, ownership or scope labels, dependencies, save or immediate-apply behavior, status feedback, search or section navigation for larger sets, and reset or restore defaults where appropriate.	Render the grid as a named work surface with visible headers, row identifiers, focus location, selection state, dirty and invalid cell markers, column controls, and status text for row count, sort, filter, and save state.	Render saved views as named, selectable workspace presentations with visible owner or visibility, active state, saved layout mode, columns or fields, grouping, sort, filters, and last-updated metadata.
UX guidance	Use user-controlled density when different users or moments call for scanning more items versus reading with more breathing room on the same surface.	Use settings management when users need to review and change persistent app, account, workspace, notification, privacy, display, integration, or system behavior outside the immediate task flow.	Use a data grid when cell-level interaction makes users faster and more accurate than opening each record separately.	Use saved view when users need to return to a complete operational presentation of a changing dataset rather than rebuilding columns, layout, grouping, filters, and sort every session.
Good UI	A case queue toolbar lets users switch Comfortable, Standard, and Compact row density, shows This table only, preserves selected rows, and keeps row actions readable.	A notification settings page groups channels, quiet hours, digest frequency, and workspace scope; each row shows current value, effect, dependency, and whether changes save immediately.	An invoice-review grid shows frozen invoice IDs, column headers for Vendor, Amount, Due, Owner, and Status, one highlighted focused cell, two selected rows, a dirty edited amount, and a status line naming the current cell.	A support queue has saved views named My urgent tickets, Team backlog, and SLA breach risk, each showing columns, sort, filters, owner, and private or team visibility before users apply it.
Bad UI	A compact toggle removes secondary labels and status chips instead of only reducing spacing.	A page called Settings mixes billing invoices, destructive account deletion, onboarding tips, profile setup, search results, and global navigation with no grouping or save model.	A static report uses role grid even though users only read values and ordinary table semantics would be clearer.	A tab labelled Saved view applies hidden filters, changes columns, and switches layout with no preview or active-state summary.
Good UX	A support agent switches a queue to Compact to scan SLA risk, keeps the focused row and filters intact, then returns to Comfortable before reading long notes.	A user turns off weekly digest emails, sees the setting save immediately, keeps urgent security emails enabled, and understands the workspace-level override.	A user presses Arrow Right to move from Amount to Due, presses Enter to edit the due date, presses Escape to cancel, and focus returns to the same cell in navigation mode.	A manager opens SLA breach risk, sees the board layout, grouped Status lanes, five saved columns, and current result count, then changes density and saves a private copy instead of overwriting the team view.
Bad UX	A user shrinks density and accidentally clicks the wrong row action because target sizes collapsed.	A user changes a privacy setting thinking it affects only one project, but the value applies to the whole account.	A user edits an amount, sorts by status, and the row disappears with no saved or unsaved indication.	A user changes one column while reviewing a team queue and accidentally updates the shared default for everyone.
Best fit	Users need to switch between scanning many records and reading or editing with more space.	Users need to inspect and change persistent app, account, workspace, privacy, notification, display, integration, device, or system behavior.	Users repeatedly inspect or update many records in shared columns.	Users repeatedly return to a specific presentation of a changing data set.
Avoid when	Changing density would hide required information, reduce targets below usable sizes, or break focus.	The task is a one-time transaction, submission, setup wizard, or onboarding flow.	The data is read-only and ordinary table navigation is enough.	Only one current-session filter or sort choice needs to be changed.
Required state	Default density state	Settings overview with categories and current values	Default navigation state with labelled grid, column headers, row headers or row identifiers, focused cell, and row count context.	No saved view selected with current display settings visible and saveable.
Accessibility burden	Expose selected density, scope, and reset state as text.	Use headings, section labels, fieldsets, and persistent labels so settings groups and controls have clear programmatic names.	Use grid semantics only for an interactive composite widget with managed focus.	Expose active saved-view name, visibility, default status, and modified state in text, not only selected tab styling.
Common misuse	Treating density as a way to remove metadata, labels, helper text, or status instead of changing spacing.	Using settings as a dumping ground for unrelated navigation, billing, help, profile setup, onboarding, or destructive account actions.	Using role grid on a static table only to make it sound richer.	Saving current rows instead of presentation settings and dynamic criteria.

User-controlled density

UI or UX: UI + UX - User-selectable compactness for rows, lists, cards, tables, grids, or work surfaces
UI guidance: Render density as a visible segmented control, menu, or setting with named choices such as Comfortable, Standard, Compact, and Spacious, plus scope, preview, and reset feedback.
UX guidance: Use user-controlled density when different users or moments call for scanning more items versus reading with more breathing room on the same surface.
Good UI: A case queue toolbar lets users switch Comfortable, Standard, and Compact row density, shows This table only, preserves selected rows, and keeps row actions readable.
Bad UI: A compact toggle removes secondary labels and status chips instead of only reducing spacing.
Good UX: A support agent switches a queue to Compact to scan SLA risk, keeps the focused row and filters intact, then returns to Comfortable before reading long notes.
Bad UX: A user shrinks density and accidentally clicks the wrong row action because target sizes collapsed.
Best fit: Users need to switch between scanning many records and reading or editing with more space.
Avoid when: Changing density would hide required information, reduce targets below usable sizes, or break focus.
Required state: Default density state
Accessibility burden: Expose selected density, scope, and reset state as text.
Common misuse: Treating density as a way to remove metadata, labels, helper text, or status instead of changing spacing.

Settings management

UI or UX: UI + UX - Dedicated user or app configuration management surface
UI guidance: Render settings management as a durable configuration surface with a clear Settings or Preferences entry point, grouped categories, current values, setting descriptions, ownership or scope labels, dependencies, save or immediate-apply behavior, status feedback, search or section navigation for larger sets, and reset or restore defaults where appropriate.
UX guidance: Use settings management when users need to review and change persistent app, account, workspace, notification, privacy, display, integration, or system behavior outside the immediate task flow.
Good UI: A notification settings page groups channels, quiet hours, digest frequency, and workspace scope; each row shows current value, effect, dependency, and whether changes save immediately.
Bad UI: A page called Settings mixes billing invoices, destructive account deletion, onboarding tips, profile setup, search results, and global navigation with no grouping or save model.
Good UX: A user turns off weekly digest emails, sees the setting save immediately, keeps urgent security emails enabled, and understands the workspace-level override.
Bad UX: A user changes a privacy setting thinking it affects only one project, but the value applies to the whole account.
Best fit: Users need to inspect and change persistent app, account, workspace, privacy, notification, display, integration, device, or system behavior.
Avoid when: The task is a one-time transaction, submission, setup wizard, or onboarding flow.
Required state: Settings overview with categories and current values
Accessibility burden: Use headings, section labels, fieldsets, and persistent labels so settings groups and controls have clear programmatic names.
Common misuse: Using settings as a dumping ground for unrelated navigation, billing, help, profile setup, onboarding, or destructive account actions.

Data grid

UI or UX: UI + UX - Interactive row-and-column data workspace
UI guidance: Render the grid as a named work surface with visible headers, row identifiers, focus location, selection state, dirty and invalid cell markers, column controls, and status text for row count, sort, filter, and save state.
UX guidance: Use a data grid when cell-level interaction makes users faster and more accurate than opening each record separately.
Good UI: An invoice-review grid shows frozen invoice IDs, column headers for Vendor, Amount, Due, Owner, and Status, one highlighted focused cell, two selected rows, a dirty edited amount, and a status line naming the current cell.
Bad UI: A static report uses role grid even though users only read values and ordinary table semantics would be clearer.
Good UX: A user presses Arrow Right to move from Amount to Due, presses Enter to edit the due date, presses Escape to cancel, and focus returns to the same cell in navigation mode.
Bad UX: A user edits an amount, sorts by status, and the row disappears with no saved or unsaved indication.
Best fit: Users repeatedly inspect or update many records in shared columns.
Avoid when: The data is read-only and ordinary table navigation is enough.
Required state: Default navigation state with labelled grid, column headers, row headers or row identifiers, focused cell, and row count context.
Accessibility burden: Use grid semantics only for an interactive composite widget with managed focus.
Common misuse: Using role grid on a static table only to make it sound richer.

Saved view

UI or UX: UI + UX - Persisted named presentation state for a data workspace
UI guidance: Render saved views as named, selectable workspace presentations with visible owner or visibility, active state, saved layout mode, columns or fields, grouping, sort, filters, and last-updated metadata.
UX guidance: Use saved view when users need to return to a complete operational presentation of a changing dataset rather than rebuilding columns, layout, grouping, filters, and sort every session.
Good UI: A support queue has saved views named My urgent tickets, Team backlog, and SLA breach risk, each showing columns, sort, filters, owner, and private or team visibility before users apply it.
Bad UI: A tab labelled Saved view applies hidden filters, changes columns, and switches layout with no preview or active-state summary.
Good UX: A manager opens SLA breach risk, sees the board layout, grouped Status lanes, five saved columns, and current result count, then changes density and saves a private copy instead of overwriting the team view.
Bad UX: A user changes one column while reviewing a team queue and accidentally updates the shared default for everyone.
Best fit: Users repeatedly return to a specific presentation of a changing data set.
Avoid when: Only one current-session filter or sort choice needs to be changed.
Required state: No saved view selected with current display settings visible and saveable.
Accessibility burden: Expose active saved-view name, visibility, default status, and modified state in text, not only selected tab styling.
Common misuse: Saving current rows instead of presentation settings and dynamic criteria.

Decision rules

Choose user-controlled density when the user needs to switch between comfortable, standard, compact, or spacious spacing while keeping the same content, order, filters, and task model.
Choose settings management when density is only one row inside a broader durable configuration page with categories, scopes, dependencies, save states, and reset behavior.
Choose data grid when the main issue is row-and-column interaction such as managed focus, cell editing, selection, sorting, filtering, virtualization, or keyboard navigation.
Choose saved view when users need to persist columns, filters, sorting, grouping, visible fields, or data scope as a named reusable view rather than only changing spacing.
Density controls must state scope, such as this table, this workspace, this device, or this account, before the user applies or saves the compactness choice.
Density changes should preserve focus, scroll position, selected rows, open detail, edited values, and current filters while row height and control spacing update.
Do not use compact density to hide required labels, status, validation, row actions, touch targets, or accessibility affordances.
Use responsive layout changes when the problem is screen width or breakpoint behavior; use density when the same viewport can support different information compactness preferences.
Use zoom or text-size controls when the user needs larger text or accessibility scaling; density must not override browser zoom, OS text size, or minimum target requirements.
Let users preview, reset to system default, and persist density only within the named scope; never silently change a shared team's view from a personal compactness choice.

Inspect live examples

User-controlled density Settings management Data grid Saved view

Failure modes

A compact mode shrinks text, checkboxes, menus, and row actions until labels truncate and touch targets become unreliable.
Density changes reorder columns, clear filters, lose row selection, or discard unsaved cell edits.
The product stores a personal compact setting as the shared workspace default without warning.
A saved view is used to represent density, so changing spacing also changes columns and filters.
A data grid exposes a density menu but row height, header height, batch actions, and detail rows no longer align.
Mobile density copies the desktop compact table and forces horizontal scrolling instead of preserving readable row identity.