|
|
|
|
|
|
Case Study Club
|
|
The weekly read for designers who shape products.
|
|
|
|
|
Stripe collapsed the design-to-engineering chain
|
|
Prototyping a data dashboard is nearly impossible in Figma. Add filters, states, zero data, error data, real data, and Figma stops being a place to think. Owen Williams, who runs design at Stripe, hit that wall constantly. v0 was the obvious workaround, but it gave him what host Claire Vo on Lenny's How I AI called "generic Tailwind indigo slop." Clean prototypes that didn't know Stripe's design system, so every one carried over conventions nobody at the company actually shipped. So Williams built Protodash.
|
|
"My dream was I want something that's like v0 but fast," Williams told Vo. "Why can I not just do this in my browser? Like why do I need Cursor?" Protodash is the answer. It's a layer that sits on top of Cursor, a bundle of project rules that teaches the model how Stripe's design system, called Sale, works.
|
|
A Figma link routes through Sale's internal MCP server before any code gets written. Components, tokens, and house conventions pull in automatically. The designer's mental load drops to one command. "How can I make it so a designer maybe only needs to know about npm run dev, and that's it, and it just works."
|
|
Williams' top goal, in his words, was personal. "I never want to see a slideshow again." The phrase he uses for the alternative belongs to another Stripe design leader, Dan Nelson: demos not memos. Design reviews at Stripe are no longer documents. They are live prototypes the team uses, edits, and walks through together.
|
|
Two things happened that Williams didn't plan. The first is that PMs adopted Protodash as fast as designers did. "I started seeing PMs use it and got a little nervous," he said. "PMs designing. It's like what's going to happen?" The fear is also the interesting part. The second is that Williams himself stopped being able to tell, mid-meeting, whether he was looking at production work or a fresh Protodash sketch. "It's so convincing that I'm like, is this the real product or am I looking at something fake?" He wants a low-fidelity mode for exactly this reason. At Shopify, where Williams worked before Stripe, Comic Sans was the in-house signal for work in progress. "Deeply painful, but you knew visually immediately, this is not done." Vo named what he's after: "Oh, it's Balsamiq-core."
|
|
Two patterns matter outside Stripe. Generic AI design tools, the v0s and Cursors and Lovables, can produce convincing screens but cannot honor a company's own conventions. Studios with mature design systems are positioned to build internal tools that beat the generic ones at the things they actually ship. And the spec, mock, demo, handoff sequence collapses into a single artifact that PM, designer, and engineer all touch in turn.
|
|
What Protodash cannot decide is what's worth prototyping in the first place. Figma published a microsite this week, Design is the Work, arguing exactly that. The execution layer was always going to fall to AI. The framing layer is where design either survives or doesn't.
|
|
|
|
|
|
— 4Creative builds Channel 4's new identity from visual moments extracted across 130 British TV shows. It's Nice That
|
|
|
|
— Anthropic ships five Claude Code features at Code with Claude, including scheduled routines and multi-agent orchestration. Lenny's Newsletter
|
|
|
|
— Counter-Print publishes a 200-page survey of three-dimensional typography. Fonts In Use
|
|
|
|
— Nathan Beck publishes "The death of design," arguing curation is replacing generation as the discipline's primary work. Nathan Beck
|
|
|
|
— Figma launches "Design is the Work," a microsite arguing AI is only useful once the design problem has already been framed. Figma
|
| |
| |
|
|
|
|
|
A portfolio that opens on what changed
|
Simon Foster is a product designer with a personal site at simonfosters.website. The home page is full of small personality touches: eyes that follow the cursor, a stack of hats that grows as the page scrolls. The case studies are sober. Each one opens on the outcome before the process.
The structure pays off. Foster's projects lead with what changed before how he got there. Process detail is present, but it sits below the result. The personality is contained to the surface of the home page, which lets the work read as work.
|
|
| |
|
| |
|
|
|
|
|
Hotel Retro reanimates 330 luggage labels
|
|
Hotel Retro is a new publication from Letterform Archive reproducing 330 vintage hotel luggage labels as peelable stickers for contemporary suitcases.
|
|
The original objects were transient by design, peeling off as travelers moved between hotels and continents. Reproducing them as stickers honors what they were before they became collectibles. The book presents the labels in archival form, but the perforated pages let them detach.
|
|
|
|
|
|
A Figma-style editor for terminal interfaces
|
|
A TUI (Text User Interface) is an interactive program that runs entirely in the terminal: htop, lazygit, k9s. The interface is built from characters, colors, and ANSI escape codes, hand-coded by the developer.
|
|
TUIStudio is a visual editor for those interfaces. Drag-and-drop component composition, live property editing, the conventions of Figma applied to the layer where infrastructure tooling actually lives. For designers who haven't paid attention to the terminal, it's a useful entry point.
|
|
|
|
Written and edited by Jan Haaland. Published weekly from Norway.
|
|
Forwarding this to one person is the best way to support Case Study Club. If someone comes to mind, please send it their way.
|
|
|
|
|