Back to blog
DesignEngineering

Why Great Design is a Technical Skill

4 min read

I've worked with some incredible designers over the years. The ones who consistently produced work that actually shipped — work that didn't fall apart in QA, work that didn't spawn endless back-and-forths with the dev team — all shared one trait: they thought like engineers.

And the best engineers I know? They think like designers.

The false divide

We've built an industry mythology around the idea that design and engineering are fundamentally separate disciplines. Design school teaches you to think in terms of aesthetics, user journeys, and brand. Engineering school (or bootcamps, or Stack Overflow — be honest) teaches you to think in terms of systems, constraints, and correctness.

The result: designers hand off mockups that ignore the physics of the web. Engineers implement them in ways that ignore the intent of the design. Both sides get frustrated. The product suffers.

What "thinking technically" actually means for designers

It doesn't mean learning to code (though that helps). It means:

Understanding what's easy and what's expensive. A drop shadow is cheap. A complex SVG animation on scroll might tank mobile performance. A designer who knows this makes better tradeoffs.

Designing for states, not just happy paths. Every UI element has multiple states: empty, loading, error, success, partial, overflow. A design that only shows the happy path leaves the engineering team to invent the rest — often poorly.

Caring about the implementation. The best designers I've worked with open the browser inspector. They notice when a font isn't loading right, or a hover state is janky. They care about the craft end-to-end.

A real constraint, not a hypothetical one

I built a full preschool website end-to-end — design system through deployment — for a Farsi-speaking, right-to-left audience, with a content admin panel the school's director, who has no technical background, manages herself. Right-to-left isn't a CSS toggle you flip at the end; it changes how you think about icon direction, form layout, and even where a "loading" state visually starts. And "no technical knowledge required" isn't a slogan — it's a constraint that shapes every admin-panel decision, from field labels to what happens when she uploads an oddly-sized photo. Design and engineering weren't separate phases on that project. They were the same conversation, held with myself, the whole way through.

What "thinking like a designer" means for engineers

It means slowing down long enough to ask: does this make sense to a human?

typescript
// An engineer's first instinct:
const errorCode = response.status === 422
  ? "VALIDATION_ERROR"
  : "UNKNOWN_ERROR";

// What a designer-engineer does:
const errorMessage = response.status === 422
  ? "Please check the highlighted fields and try again."
  : "Something went wrong. Refresh the page or contact support.";

The second version costs about 30 seconds more to write. The user experience difference is enormous.

It also means caring about visual hierarchy in your own output. Error messages. Console logs. Documentation. Pull request descriptions. These are all UX problems.

The leverage

Here's the practical upshot: if you can think across the boundary, you become 10x more effective.

You can spec your own work. You can catch problems before they become expensive. You can have conversations with the other discipline without needing a translator.

In small teams, this is worth a lot. At a startup, the designer-engineer (or engineer-designer) is often the secret weapon.

Where to start

If you're a designer: learn enough CSS to build your own prototypes. Not production code — prototypes. CodePen is your friend. You'll immediately start designing differently.

If you're an engineer: spend a week doing user research. Talk to five users. Watch them use a product you built. The humility alone will make you better.

The overlap isn't a threat to either discipline. It's where the best work lives.

Frequently asked questions

Do designers really need to touch code? Not necessarily write production code — but understanding what's cheap and what's expensive to build changes the designs you propose. A five-minute conversation with an engineer before the mockup is finished saves both sides a week of rework after.

What's the fastest way to start thinking across the boundary? Pick one shipped feature you didn't build and trace it from design file to production code. Notice every place the implementation diverged from the mockup, and ask why. That gap is usually where the real lesson is.

Was this useful?

Counts appear once there are 5 votes.

Related posts