The Vibe Design Process
I'm Addicted To

The project is Zawq, a new product I’m building: an AI content team that learns your taste. The name is the Persian and Urdu word for cultivated taste. So it had better look like somebody with taste made it.

It started the usual way. I let an agent one-shot a landing page, and it was fine. It was also a page you have seen a hundred times. Then, on Saturday at 16:50, I opened a design canvas in Claude Code and asked for “six really unique, strong, tasteful design directions”.

By Monday morning the canvas held 163 boards on eight pages: a brand direction, a logo, a color system, eight full drafts of the homepage for desktop and phone, the main app screens, sign-in and error pages, even the emails.

And none of it is code. I typed about 77 messages. The agent drew. My active time was about nine hours, spread over the weekend. The one rule I repeated to it: nothing gets coded.

The tool is Claude Design, inside Claude Code: a canvas where every design is a board. Under the hood each board is a small web page the agent writes, so it can draw anything a browser can show – even 3D you can turn with your mouse. The loop itself needs no special tool. It’s a conversation.

Three things made this work, and I had to learn each of them during the weekend.

React, don’t specify. I’m not a designer. I can’t brief a logo. But I know in one second whether I like what I see. After twelve directions that only varied type and color, I wrote: “I feel like we lack a strong image.” After four more that felt alike: “really break out of the mold.” The agent answered honestly that it had reused one layout four times and only swapped the illustration. Sixteen directions missed before the seventeenth stuck.

Make the agent look at its own work. The first eight versions went onto the canvas without the agent ever seeing them rendered. Boards were cut off. So I told it: “You also need to take screenshots and really see if what you did has hit the mark.” From then on it checked every board before showing it.

Keep the history. Nothing on the canvas was ever deleted. That made changing my mind cheap. I had dropped a garden idea for a kitchen idea, saw the garden again in a later round, and took it back. In the morning I moved the moon away from the tree. In the evening I put it back behind it.

The logo is the best proof. If you had asked me on Saturday afternoon what the Zawq logo should be, I would not have said “a bonsai in front of an orange moon”. Nobody could have briefed that. It took 64 candidates to find it.

The first twelve logos were flat marks next to the name. I wrote: “I don’t like these logos at all.” For a moment I even let it try six other names. I rejected those too and kept Zawq.

What worked came from somewhere else. The homepage already had small 3D plants on it. So I asked for app icons built from those parts, with no name at all. One of the six was a dark tree in front of a harvest moon. Three trees later there was one with foliage in levels, like clouds. The agent had listed “reads as bonsai” as its weak spot. For me that was the whole idea: a bonsai is a tree somebody shapes, patiently, with taste.

On Sunday at 11:19 I looked at the next version and typed: “hell yes, that’s the one.” The rest of the day was trimming. When it added more foliage, I took it out again, because it destroyed the clean structure. The flat logo you see at the end was drawn last, from the finished 3D tree – not the other way around.

A logo round used to mean a brief, a week of waiting and an invoice. This was one evening and one morning, and I never had to explain what I wanted. I only had to recognize it.

Here is why this makes the build faster and not slower. Every decision below changed during the weekend. On the canvas each one was a single new board. In a built product each one would have touched many files.

The biggest one was the app. The first screens were a classic dashboard. I looked at them and saw the mistake at once: Zawq is an agentic product. You talk to it. So the next morning chat became the main screen. No route, no layout and no database table had to be rebuilt, because none existed.

Late on Sunday I stopped all page work until the colors were locked. Homepage draft 7 used about 20 dark greens that were almost the same. They became eight, inside a set of 36 named colors, each pair tested for contrast. Draft 8 is draft 7 redrawn with those names only. If your app already has a style system, you know what cleaning that up in code costs.

These boards are what the coding agents get. A style guide short enough for a briefing. The colors as code. The components with notes for the build. Every screen of the user flow as a picture. An agent that has to invent the look while building will guess, and you will correct it screen by screen. An agent that has the look only has to build it.

To be honest about where this stands: the weekend produced designs, not a product. The first piece is built since. On Monday the new homepage went live on zawq.ai. The app behind it doesn’t exist yet.

So “agents that build faster” is, for Zawq, still a promise. I saw it once already, when our mobile app was built from screen designs in a weekend. Now I’ll see it on a whole product, and I’ll tell you how it went.

It also wasn’t all smooth. Three logo rounds went into the bin. Three homepage drafts were so full of decoration that most of it came out again; I had to remind the agent, and myself, that a brand about taste can’t have that much going on. And one board kept a hidden 3D animation running until my machine was under full load. The agent found it and fixed it in about two minutes.

This works best on something new, before the first line of code. That can be a new product, or the next landing page or feature of the one you have. This is the order I’d follow.

Hand this to your coding agent. It sets the rules of the game and starts by asking you questions:

One warning: it is addictive. A round is so fast that you can go on forever. Set yourself an end – for me it was the moment the colors were locked and the page was redrawn with them.

Want to see the canvas and ask me about it? Come to Vibe Coding Cologne on 7 October. And if you’d rather design and build your own product with a crew around you, that’s what the Pirate Forge is for.