Design Tools as a Means to an End

I sat nodding consistently as I read this article about how Figma often leads designers to avoid learning to code and wasting their hours instead on complex and stressful prototypes.

This note really stood out to me from Michael’s post:

Instead of embracing even a rudimentary understanding of HTML, CSS, or JavaScript, designers have retreated into a fortress of abstraction. They’ll tweak their Figma files endlessly, push back on any technical constraints, and then smugly hand over their “perfect” design — only to be baffled when development comes back with a hundred questions about feasibility.

Honestly… this is so very true.

Newsflash — If you don’t understand even basic developer language, don’t be surprised when your work gets lost in translation.

I've said countless times that you can't ever expect a developer to understand your design intention if you don't understand the constraints of their platform. Typically, there are so many things at play within a production codebase that a lack of understanding can lead you down useless paths of exploration or prototyping that result in a huge waste of time and don't actually translate to what gets shipped at all.

I've said before that I believe design is a temporary artefact, and I've also shared my beliefs around approaching code from a designer's perspective if you are doing so for the first time. Learning about these limitations used to be a superpower, but I no longer think it is. I now think it's a hard requirement for all designers to understand the fundamentals of code.

And no, not Vibe Coding™.

Michael's comment about the fortress of abstraction being an issue is one I've been wrestling with for a long time. I still spend time in Figma, but mostly it's as a scratch pad for ideas to weed out the bad and narrow in on the good (see: Diverging and Converging design phases). The thing is, I want to spend as little time as possible in this phase. I simply want to use this as an opportunity to explore without too many constraints, though I will still use things like Auto Layout because it kind of creates flexbox style layouts that I can mentally translate.

But as quickly as possible I want to be in the codebase with a WIP PR that has these changes running live. And from that point onwards, I just iterate in code. No returning to Figma. So Figma is my digital notebook for sketching down the idea I want to build.

Another relatable note, I've talked about how I see that Designers not knowing how to code is like Architects not knowing the physics behind building structures. But I do like Michael's analogies here too:

Imagine a chef who refuses to touch a stove but insists they should still be in charge of the restaurant’s menu. Or a car designer who never bothers to learn about aerodynamics.

At DuckDuckGo, we review ideas early and often, across many stakeholders (including our CEO). And I've found that those reviews will always go 50%+ faster if I put a working demo in front of people, instead of a flat mock or Figma prototype. So I get to that stage as quickly as I can, regardless of how incomplete or hacked together it is (though I usually work quickly but within the constraints of wanting my code to be shippable tomorrow if I get the green light).

This approach has accelerated my projects considerably, and as a team of 1 (rather than 2+), I'm able to avoid the theatre and mess of lost communication, and instead deliver something that can be more easily reviewed and approved.

In fact, I recently worked on some improvements to a particular piece of UI on our AI products, and was focused on getting the easing just right on the animation. I could have spent ages trying to figure it out in Figma, messing around with smart animate etc, but instead it made sense to work with it in place and adjust those curves in the animate CSS function until it felt right (turns out 0.7s was the answer on timing at least).

Oh, and we made these changes during the Ship Review, in minutes, with immediate feedback to get the green light to ship. Instead of being heads down for a day communicating back and forth with prototypes and broken communication.

It’s not for everyone. Still. But it’s becoming more and more important.

Still… don’t rely on Vibe Coding your way to success… it doesn’t always work out.