Uber density-demo evidence
- Primary source: Deep Dive into Uber’s Design Systems, Figma interview with Ian Guisard and Jayneil Dalal
- Published: 2025-05-16
- Retrieved and visually inspected: 2026-08-13
- Index and timestamps: Design Systems Media
No Uber Figma file, token package, transcript, or source repository is publicly downloadable from the demo. To respect that boundary, this folder records timestamped factual observations rather than mirroring the video or reproducing its screens.
Captured material
No upstream/ directory is present because the demonstrated Figma file and code implementation are not downloadable. This README is the timestamped source record.
Density segment observations
The indexed density segment begins at 08:04. The Figma file shows a variable collection titled listitem density with three modes and three variables:
| Variable | Default | Compact | Spacious |
|---|---|---|---|
parent-vertical-padding | 8 | 4 | 16 |
child-vertical-padding | 4 | 4 | 4 |
parent-minHeight | 64 | 48 | 64 |
These are Figma numeric variables. When bound to padding and minimum-height properties, the values resolve as pixel geometry.
The selected Figma frame exposes two separate variable controls:
Listitem density:Auto (Default),Default,Compact,SpaciousTheme: shown separately withLightselected
The canvas shows the same pair of representative screens in Compact, Default, and Spacious, in both light and dark appearances. This demonstrates collection-mode inheritance on a containing frame and independence from the color-theme selection.
What can and cannot be concluded
The evidence supports this observed path:
frame mode override for “listitem density”
→ component-specific numeric variables
→ List Item auto-layout padding/min-height
→ all bound List Item instances in the frame updateIt does not prove that Uber has one system-wide density collection. The visible collection is component-specific. Nor does it expose typography variables, accessibility target behavior, code activation, aliases to broader foundations, or density collections for other components.
The adjacent tag example demonstrates component-specific color variables and mode columns, and the video thumbnail states a reduction from 800 to 84 components. That is evidence about variable-driven component simplification generally, not a density-specific outcome.
Timestamp record
Times are approximate because they were read through the public player:
| Time | Visible evidence |
|---|---|
| 08:04 onward | Start of density discussion. |
| ~09:20 | Frame has separate Listitem density and Theme controls. |
| ~09:40 | Density dropdown shows inherited Auto (Default) plus Default, Compact, Spacious. |
| ~10:00 | listitem density collection exposes the three variables and exact mode values above. |
| ~10:40 | Canvas comparison shows Compact, Default, Spacious across light and dark screens. |
Coverage limits
Only the three visible List Item variables can be recorded exactly. The demo does not expose system-wide aliases, other component collections, typography behavior, accessibility targets, or code activation.