Since I started designing software, there’s one frustration that has followed me around. All the craft and care you pour into a design, quietly lost on its way into code.
You spend days getting an interaction just right. The timing of a transition. The exact spacing that makes a form feel calm rather than cramped. And then it all gets flattened into a ticket, rebuilt from scratch by an engineer, and quietly loses a fifth of its soul along the way. For years I treated that as the cost of doing business. It isn’t. It’s just waste, and recently we set out to design it away.
The Playground was almost too good
About six months ago we built something we called the Playground. It was a replica of our platform that lived in its own code repository, made for rapid prototyping and ideation. And it worked beautifully. Almost too beautifully.
Because it lived separately from our main codebase, every concept we agreed on still had to be imported into the real product afterwards. We built some clever workarounds for this, including a CLI to carry things across. But the refinements rarely survived the move. And the little details I cared about most were, of course, the first ones to get approximated, recreated, and lost.
So the Playground fixed the speed problem and quietly handed us a new one. We’d just shuffled the gap between designer and engineer a few feet to the left.
The Kindergarten: prototyping inside the real thing
The fix was to stop prototyping next to production and start prototyping inside it. So we built the Kindergarten: a secure, staff-only app that lives directly within our main codebase. It’s a place where a feature can start life as a loose idea and grow up, without ever having to leave home.
The piece I took on myself was the foundation. A completely clean, new Vue design system that both the Kindergarten and the production apps pull from. The same components, the same tokens, the same patterns. One single source of truth.
Here’s why that matters. When we build a button, a modal, or a clickable row in the Kindergarten, it isn’t a sketch of the real component. It is the real component. There’s no fidelity to lose in translation, because there is no translation.
From there, prototypes can start behaving like actual software. The Kindergarten can run off its own database, or pull from the local one, and it has the same access to our APIs. So a design doesn’t have to stay a pretty, empty shell. It can quietly take on real data, real states, and all the awkward edge cases nobody thinks of until they bite. It can grow from a loose concept into something close to a working feature, at its own pace. And because it’s tucked safely away from end users, it’s a genuinely good place to be wrong. Repeatedly. Which is the whole point of experimenting.
‘Promote’: closing the last gap
The part I’m proudest of is right at the end. When a design is approved in the Kindergarten, we don’t write it up as a spec and hope someone else reads our minds. We promote it.
We’ve built a ‘Promote’ skill that reviews the prototype’s code and moves it into the production app, wherever it belongs. From there an engineer picks it up, reviews it properly, hooks it up to the right endpoints as necessary, and ships it. The work doesn’t get described and then rebuilt. It gets carried forward and finished.
Designs travel through clear stages on the way: drafting, in review, approved, promoted. So everyone can see where an idea is in its life and chip in at the right moment. It feels a lot less like lobbing work over a wall, and a lot more like raising something together.
Why it matters
The obvious win is that there’s no waste. The detail we sweat over in the first week is the detail that actually ships.
But honestly, the bigger change is in how design and engineering get on with each other. When designers work in the real design system, in the real codebase, with real data, the old dividing lines start to blur. We’re not making artefacts for someone else to decode. We’re building, and the thing we build is the thing.
And that, I’ve come to believe, is how good product design wants to work now. Closer to the material, with the fiddly translation handed off, so that human attention can stay on the bits that actually need it: craft and judgement.
The Kindergarten is just one small, concrete version of that idea. It’s a place where prototypes grow up. And every now and then, so do the people building them.