How to Build a Website by Chatting with Claude

Build a site without opening a builder first

Most website tools start the same way: you sign in, stare at a blank canvas or a template gallery, and try to figure out where to begin. Unshift's Claude connector flips that around. You describe the site you want in a normal conversation, and Claude builds it in your Unshift account for you, real sections, a matching theme, and copy, not a wireframe.

In this walkthrough we will build a one-page site for a fictional neighborhood coffee shop called Bean & Bloom, refine it in plain language, polish it in the visual editor, and publish it live. The whole thing takes only a few minutes.

Here is the short version of how it works:

1. Connect Claude to Unshift once.
2. Describe the site you want.
3. Let Claude build it, then refine by chatting.
4. Polish in the visual editor if you want hands-on control.
5. Publish to a live URL.

Let's go through each step.

Before you start: connect Claude to Unshift

This walkthrough assumes Claude can talk to your Unshift account. If you have not set that up yet, it is a one-time, two-minute step: open the connector page in Unshift, copy the connector URL, and add it in Claude under Settings, Customize, Connectors, Add custom connector. The first time you use it, Claude will prompt you to sign in to Unshift and approve access. Sign in, approve, and you are done.

Once it is connected, you never have to think about it again. Claude can create and edit sites in your account directly from any conversation.

What we are building

Bean & Bloom is a small coffee shop that needs a simple, good-looking site: somewhere to show the menu, the hours, and where to find them. Nothing fancy, just a page that looks like a real business instead of an afterthought. Concretely, we want:

• A hero with a tagline and a "View menu" button
• A short about section with some personality
• A menu with a few drinks and prices
• Opening hours
• A contact section with the address and an Instagram link

That is a perfect first project, small enough to finish in one sitting, real enough to actually use.

Step 1: Start a conversation

Open Claude and start a new chat. Because the Unshift connector is active, you do not need to open Unshift first. Just tell Claude what you want, the same way you would brief a designer.

Step 2: Describe the site you want

Give Claude a short brief: who the site is for, the sections you need, and the look you are going for. The more concrete you are, the closer the first draft lands.

Build a one-page website for a neighborhood coffee shop called Bean & Bloom.
Warm, cozy, modern feel with earthy colors. Include a hero with a tagline and
a "View menu" button, a short about section, a menu with a few drinks and
prices, our opening hours, and a contact section with our address and an
Instagram link.

Notice that you are describing the business, not the layout. You do not need to name sections, pick blocks, or think about structure. That is Claude's job.

Tip: Depending on the conversation, Claude may not automatically reach for Unshift. If it starts writing raw code or asks how you want to build the site, just say "use Unshift to build it" (or "build this in Unshift"). That points Claude at the connector and it will create the site in your Unshift account.

Step 3: Watch Claude build it

This is where the connector earns its keep. Claude does the work for you:

• Creates the app in your Unshift account
• Generates a matching theme (colors, fonts, spacing) from your description
• Lays out the page and fills it with real sections from Unshift's block library
• Writes copy that fits a coffee shop, not lorem ipsum

When it finishes, Claude gives you a link to your new site so you can see it right away.

Open the link and there it is: a full Bean & Bloom landing page with a warm cream theme, a terracotta accent, a hero photo of the cafe, and a tagline that fits, all from a single prompt.

Step 4: Refine it by chatting

Keep iterating in the same conversation. Ask for changes in plain language and Claude updates the draft for you. A few examples that build on what it just made:

Add a "Reserve a table" button next to Find us in the hero.
Put a seasonal specials note at the top of the menu.
Deepen the cream background so the menu cards stand out more.

Keep going until it feels right. There is no penalty for asking for ten small tweaks, and nothing is published until you say so.

Step 5: Polish in the visual editor

Chatting is great for big moves and quick changes. When you want hands-on control over a specific detail, open the site in the Unshift visual editor. There you can click any text to edit it, swap images, drag sections to reorder them, and fine-tune colors and fonts, all without writing code.

Chat and the editor are two views of the same site, so you can move between them freely. Build the bones in chat, then nudge pixels in the editor.

Step 6: Publish it live

Happy with it? Hit Publish. Unshift deploys your site to a free unshift.dev address in seconds, with SSL and a global CDN included. When you are ready for your own domain, you can connect one on a paid plan.

That is the whole loop: describe, refine, polish, publish. From an empty chat to a live coffee shop site, no blank canvas required.

Where to go next

• Add more pages, like a story page or a photo gallery, just by asking.
• Already have a site? Ask Claude to import it and it will rebuild the pages as editable blocks you can change.
• Everything you make in chat shows up in your Unshift dashboard, ready to edit or publish anytime.

The best way to understand it is to try it. Connect Claude, describe something real, and watch a site appear.