How I design and ship products with Claude Code
How I design and ship products with Claude Code

How I design and ship products with Claude Code

Designers don’t have to stop at the handoff anymore. Here’s the workflow I use to take a product from Figma to production with Claude Code.

Sinan Chengoli

Lead Product Designer & AI-First Developer

How I design and ship products with Claude Code

Designers don’t have to stop at the handoff anymore. Here’s the workflow I use to take a product from Figma to production with Claude Code.

Sinan Chengoli

Lead Product Designer & AI-First Developer

The best way to protect a design is to build it yourself, with the same care you put into the pixels.

Why I stopped stopping at the handoff

For most of my career, my work ended at a Figma link and a set of specs. Then I waited. Some details survived the build and some didn’t, and every round of design QA cost the team days. AI coding tools changed that. Today I design a flow, build it with Claude Code, review it in the browser and send it for review like any other engineer on the team.

My workflow, step by step

  • Design first. I still start in Figma: the journey, edge cases, empty and error states, and the components the flow needs.

  • Describe the outcome, not the code. I give Claude Code the screen, the states and the rules, and let it read the existing codebase before it writes anything.

  • Review in the browser. I click through every state myself, on desktop and on a phone, and fix what feels wrong.

  • Ship through Git. Every change goes through a branch, a pull request and a review, the same way the rest of the team works.

Where it makes the biggest difference

Admin panels and back-office tools are the clearest win. They are rarely anyone’s top priority, so they usually get the least design attention. Being able to build them myself means risk, compliance and support teams get tools that are as clear as the product customers see.

It also changes prototyping. A prototype is no longer a clickable picture. It is a working page with real states, and that makes conversations with stakeholders much shorter.

What stays the same

AI does not replace product judgment. Someone still has to decide what to build, which edge cases matter and how the user should feel at every step. Claude Code makes me faster at building. It doesn’t decide what’s worth building.

Let’s keep in touch.

Discover more about high-performance web design. Follow us on Twitter and Instagram.

What mesmerizes me is Sinan’s ability to go above and beyond on even the smallest projects. He’s a skilled team player who delivers results, especially demonstrated during his time at CPT Markets.

What mesmerizes me is Sinan’s ability to go above and beyond on even the smallest projects. He’s a skilled team player who delivers results, especially demonstrated during his time at CPT Markets.

Arshkiran Sandhu

HR Business Partner

Arshkiran Sandhu

HR Business Partner

Newsletter

Join my newsletter and stay updated on the latest trends in digital design.

© 2026 sinnann™ All rights reserved.