Why we design in the browser, not in a mockup
Static design tools lie about the three things that matter most on the web: weight, motion, and how type behaves at every size. Here's why we skip them.
A mockup is a photograph of a website that doesn’t exist yet. It looks finished. It is also, in a few specific ways, a lie.
It lies about weight. The hero image that looks crisp in the design file is four megabytes, and nobody finds out until the page is live and slow. It lies about motion, because a still frame can’t show you that the menu animation feels sluggish on a mid-range phone. And it lies about type, which reflows differently at every screen size in ways a fixed artboard never has to deal with.
None of this is the tool’s fault. A design tool is for drawing pictures, and it draws them well. The problem starts when the picture becomes the contract, and a different team has to turn it into a real thing that behaves under real conditions.
What we do instead
We build in the browser from the first week. Real fonts, real breakpoints, real motion, on a real device. When you review a page, you’re scrolling the actual page, not looking at a render of one. If something feels heavy, you feel it then, while it’s cheap to fix.
This changes the conversation. Instead of “approve this image and hope it survives the build,” it’s “here’s the thing, on your phone, right now.” The gap between sign-off and launch mostly disappears, because there isn’t a translation step in the middle for things to go wrong.
The catch
Designing in code is slower at the very start. You can’t sketch ten directions in an afternoon the way you can in a design tool. So we still sketch loosely, on paper or in low-fidelity frames, to find the shape of a thing. We just don’t pretend that sketch is the deliverable.
The payoff comes later, and it’s worth it. The performance budget holds because it was real the whole time. The animations feel right because we tuned them on the device, not in our heads. And the day the site goes live, there’s no nervous wait to see whether the build matches the design, because the build was the design.
That’s the trade we make on every project. A little more friction up front, a lot less surprise at the end.
Agency AI Solutions
Notes from the studio, written when we have something worth saying.
Keep reading
All insights
Security is a design decision, not a final check
By the time most teams call a security firm, every fix is a renovation. Deciding auth, roles, and audit trails early is cheaper and produces a better product.
The demo is the easy part
AI features are simple to demo and hard to trust. The work that decides whether one survives contact with real users is the work nobody puts in the pitch.