Designer: your style and your design brief

Role

Designer

Outcome

Your design brief

Time box

15 minutes

The Designer asks about your taste and writes a Stitch prompt that fits only you. You design your look in Stitch with it. Then the Designer turns your design into the brief the Developer builds from.

Stitch is Google's AI design tool: it turns a prompt into a web design you can look at and change. The design brief lives in design/brief.md. The Designer writes only that file; your site does not change in this Block.

Start a fresh chat

The Analyst's chat is full of your LinkedIn text, its questions and your answers. The Designer needs none of it: your content is safe in your files. So leave that chat and start a new one.

1. In Antigravity IDE, start a new chat in the agent panel (the + button at the top of the panel).
2. Check the model name under the chat box: it says Gemini 3.8 Flash. If not, click it and pick Gemini 3.8 Flash.

Start the Designer

In the fresh chat, type:

Agent chat

Start the Designer step.

The Designer already knows what your site says and what it is for: it reads your content file and your spec. So it asks about your taste instead: at most five questions, one at a time.

Answer its questions

Answer each question in a few words, or say skip. The questions are about these four things:

1. Your style: Classic, Modern, Bold, Playful or Technical. The Designer describes each one in a sentence. You may mix two; where they disagree, the first one wins.
2. Three words for how your site should feel, for example warm, precise, curious. Words that every site uses, such as modern or clean, bring one more question: a sharper word.
3. A colour you love, or a website you love. For a website, give the Designer its address. It may open the site in Chrome, name three things that make it work and ask which one you love most. Antigravity asks you before it opens Chrome: allow it.
4. Something that is yours: a hobby, a place or an object. It becomes one small detail on your site, such as an icon, a pattern or a frame.

Then the Designer checks that your colour is readable as text, with node tools/contrast.mjs, and writes your Stitch prompt. It uses your answers and your content: your real name, your real projects and the fonts of your style. It sends the prompt in a block of its own, with the steps for Stitch.

Copy the whole prompt: select it in the chat and press Cmd+C on a Mac, Ctrl+C on Windows and Linux. If the prompt has a copy button, use that.

Design it in Stitch

Give Stitch about five minutes.

Open Stitch

1. Sign in with your personal Google account.
2. Choose a design for the Web, not for an app.
3. Choose the fast model; Stitch may call it Flash or Speed. It answers quickly and saves your daily credits, the free allowance Stitch gives every account.
4. If Stitch shows you a design system or a template to pick, choose none.
5. Paste the Designer's prompt into Stitch's prompt box (Cmd+V on a Mac, Ctrl+V on Windows and Linux).
6. Send it as it is. Do not press Enhance prompt.

After about a minute, Stitch shows your design. Now make it yours, one change at a time:

• One change per message, in plain words, for example "More space between the sections". Look at the result before you ask for the next one.
• Colours, fonts and corner radius: change them in Edit Theme, not with a prompt. Your site can use only the fonts that come with your repo: keep the ones your prompt names, or pick another of those. Any other font, such as Inter, goes back to your style's font in the brief.
• Looks like your neighbour's design? Ask Stitch for three variants, set the range to Creative, and write "Make it more" with your style, for example "Make it more Playful". Pick the one you like.
• The redesign mode: use it at most once. It uses up many of your daily credits.
• Never paste a website address into Stitch. It copies that site's design. The Designer already turned what you love about it into your prompt.

Stop when you like it: the polish comes later. Leave Stitch open in its tab.

Give it your design

Go back to the Designer's chat: it is waiting for your design. Your design reaches it by copy and paste: nothing to install, nothing to connect. Choose one way:

Read the brief back

The Designer writes design/brief.md: your style, the colours for light and dark mode, the fonts, the shapes and the layout. It also names your personal detail, the order of your sections and one signature move. That is the one effect people remember, such as a header that shrinks as you scroll. Then it runs node tools/check-brief.mjs until every colour is easy to read on its background:

What the brief check prints

design/brief.md is ready for the Developer: every section is there and every colour pair is readable.

Then it explains the brief in plain words, including every place where it changed your design and why. For example, it may darken a colour so that text stays readable, or create the dark mode your design did not show.

The Designer ends by sending you on: "The Designer is done. Start a fresh chat and ask for the Developer: it builds your site from site/content.json and this brief."

If something goes wrong

Ask your agent first. Start a fresh chat and type the question below. The agent reads your repo and tells you what is done and what comes next. Got an error message? Paste it into the chat, and it explains it.

Agent chat

Where am I?

The Designer asks two questions at once, or more than five

Fix: answer the first one and say "One question at a time, please." If it keeps going, say "Write my Stitch prompt with what you have."

The agent cannot open the website you love

Fix: tell it in one sentence what you like about that site, for example "The big serif headings and the warm colours." That is all it needs.

You pressed "Enhance prompt", and your design looks like everyone else's

Fix: start a new design in Stitch and paste the Designer's prompt again. This time, leave Enhance prompt alone. The prompt is still in the Designer's chat: scroll up and copy it again.

The pasted HTML is very long and the chat seems stuck

Fix: wait a little: long HTML takes a moment to read. Nothing after a minute? Click the stop button in the agent panel and send a screenshot of your design instead.

The brief check keeps saying a colour is hard to read

Fix: the Designer fixes it by making one colour lighter or darker. If it goes in circles, stop it and say which colour to keep, for example "Keep the accent colour and make the background lighter."

Fell behind?

When the Designer Block's time is up and you are not done, jump to its checkpoint. A checkpoint (the finished state of this Block) brings your site to where the room is. It keeps your own content file, design brief and spec.

First stop the agent in your old chat, if it is still working: click the stop button in the agent panel. Otherwise it can keep changing files after the checkpoint has run.

Then, in Antigravity IDE, open a terminal (the window for typing commands) with the menu Terminal → New Terminal. It opens in your portfolio folder. Paste this command (Cmd+V on a Mac, Ctrl+V on Windows, Ctrl+Shift+V on Linux) and press Enter:

Terminal · same on Mac, Windows and Linux

node tools/checkpoint.mjs designer

It lists, file by file, what it kept and what it changed. The last lines tell you what to do next: start a fresh chat and ask for the Developer. If it says Nothing to change, you were already there. Two Blocks behind? This one checkpoint is enough: it includes the earlier Blocks.

Or let the agent run it for you. Start a fresh chat and type:

Agent chat

Catch me up: the room just finished the Designer block.

No design brief of your own when the time is up? The checkpoint copies in the template's own brief, so the Developer can still build.

Use the Block that has just ended, not the one that starts now.