I Designed 8 Dashboards Without Opening Figma
The timeline forced me out of Figma. Eight user dashboards, six weeks, built directly in code. What the workflow looked like and what it changed.
The initial brief was two weeks. Eight user types. Every surface redesigned.
I could not have designed eight dashboards end-to-end in Figma and then built them. The math did not work. Even if the design phase took a week, that left a week for the build — and a week is not enough time to implement eight user types worth of frontend from scratch. Something had to give. What I gave up was the Figma deliverable.
KsW 9}V$3 F1cVVo %vZ q]?B
The specific cost of a translation layer
Figma is a translation layer. The translation has a cost.
You design there, then someone builds it. Even when that someone is you, the round-trip adds friction. Decisions made in a static frame get revisited when data is real, when viewport is wrong, when a user type you did not account for hits a screen you thought you had covered. The earlier I could catch those breaks, the fewer of them I would ship.
For a project at this scope and pace, the cost of maintaining two sources of truth — the Figma file and the codebase — was higher than the benefit.
I made the decision on day three. PRD to prototype to code, with no Figma deliverable in between. It was the right call for this specific project at this specific pace.
[THINKING]I made the decision on day three. PRD to prototype to code, with no Figma deliverable in between. It was the right call for this specific project at this specific pace.
[THINKING]PRD → prototype → code. No file in between.
Claude handled strategy and brainstorming. Figma Make handled quick directional prototypes. Cursor, with Claude, handled the build. My custom product skills — covering UX, business strategy, product design — stayed the decision layer throughout. The AI generated material. I edited it.
I fed the generated PRD to Claude, used Figma Make to prototype direction — not deliverables — then built directly in Cursor. Each tool did one job. None of them replaced the decision-making.
<Qd! 5Q}sUf*
From building before designing
Building directly in code changed the design decisions.
When I could see actual data rendering in an actual component, I caught layout failures that a Figma frame would never have shown me. Empty states I had not designed. Long names breaking grids I had assumed would stay clean. Role combinations I had not considered. The code was honest in a way a static design file cannot be.
I also made better component decisions. When a pattern was going to repeat across four user types, I knew immediately — because I was building it, not drawing it. That changed how I architected the components from the start.
I used Figma Make differently than I expected. Not for deliverables — for thinking. Twenty minutes to prototype a navigation direction, feel whether it was right, then throw it away and build the real thing.
[POINTING]I used Figma Make differently than I expected. Not for deliverables — for thinking. Twenty minutes to prototype a navigation direction, feel whether it was right, then throw it away and build the real thing.
[POINTING]What I'd do differently with more time.
The navigation architecture deserved more prototyping rounds before I committed to building it. The role-filtering logic — which five items each user type sees, what lives in 'more', how Sophia layers on top of both — I worked through that in code, which meant some decisions got reversed mid-build. A few more Figma Make sessions on that specific problem would have saved time downstream.
But the core approach — prototype fast, build directly, no static deliverable — I would not change. For this scope at this pace, it was the right call.
Designer and builder — I prototype to learn what's possible, then refine until it ships. Systems-thinking, hands-on builds, and interfaces people remember.
