Preview image. Unlock full-res
Dark slide with a labeled concept diagram of a new product workflow inside a rounded border, captioned by a large light headline below.
Summary
A dark diagram slide mapping a new build workflow: a violet "Structure & design systems" block feeds a "Prototypes / UI design" pill and a "Design-aware code" bar, all wrapped in a rounded outline labeled with monospace bracket captions, with a large headline sitting below the frame.
Visual description
The top three-quarters is a near-black rounded rectangle outlined by a thin gray stroke with a small "The future of building products" label notched into its top-left edge. Inside, a lavender-violet rounded block reading "Structure & design systems" sits at left. To its right, two stacked bars: a light pill split "Prototypes | UI design" with a blue gradient seam and small black icons, captioned above by a dashed bracket reading "FREEFORM WITH STRUCTURE"; below it a wider green-gradient bar reading "Design-aware code" with a code icon. A second dashed bracket runs along the bottom with a small chat avatar and the monospace caption "ITERATIVE BRAINSTORMING & ALIGNMENT". Below the framed card, a large dark-on-light grotesque headline reads "We are moving towards a world where there is a different process..." centered across two lines.
Key takeaway
Using dashed monospace bracket labels to annotate a diagram from the outside, so the bracket spans the exact elements it describes. The gradient seam inside the Prototypes/UI pill quietly signals a blended, continuous stage rather than two separate steps.
Reuse notes
A clean pattern for explaining a process or system architecture on a dark technical deck. The framed-card-plus-headline-below structure separates the visual claim from the spoken takeaway. Pairs directly with slide 38, which reuses the same diagram with arrow annotations. Needs the monospace utility type to read as deliberate rather than decorative.
From this deck: The future of building products diagram
View deck
