If you already have photos or design references, place them in one folder before you begin. This makes them easier to add when Claude is ready to build. You can also start without assets and use placeholders for the first prototype.

Use reference sites for principles such as typography, whitespace, image density, and navigation. Do not ask Claude to copy another site's photos, text, logos, or distinctive layout.

Open Claude and start a regular chat. Click Voice to begin a live conversation. The Voice control is different from the microphone used to dictate a text message. It also does not appear inside Cowork, so begin in a regular chat and keep that conversation open for the rest of the workflow. Anthropic's Voice mode instructions (https://support.claude.com/en/articles/11101966-use-voice-mode) cover the currently supported Claude surfaces.

Start with the outcome, then ask Claude to interview you. This is the part that replaces the giant build prompt: Claude asks for the missing decisions one at a time, and your answers become the creative brief.

Use this reusable opening:

I want to build a [SITE TYPE] for [PERSON, BUSINESS, OR PROJECT].

The main goal is [PRIMARY GOAL]. Interview me so we can plan a strong prototype. Ask one question at a time, ask what assets and design references I already have, and do not build anything yet.

In the recorded example, the site was a portfolio for a wildlife photographer who works with conservation groups. The goal was to showcase the work and invite project inquiries rather than sell products.

Answer the questions that materially change the site. Claude may ask about:

• the audience and primary call to action
• the sections the page needs
• the story or feeling the design should create
• existing branding, photos, and reference sites
• the visual direction, including color, type, spacing, and image treatment

Tell Claude what assets you have even if you have not uploaded them yet. For example, the demo mentioned six wildlife photos and several portfolio references. That gave Claude a concrete image count and a design direction to plan around.

When the first version only needs to communicate an idea, keep the build simple. Ask for a static site unless the experience truly needs accounts, live data, payments, or other application logic.

Pro tip: Ask for a static site when you are building a portfolio, landing page, blog, or mockup. It keeps the first prototype simpler for you and Claude.

Once the audience, page structure, and visual direction feel right, ask Claude to write the full plan into the chat. This gives the text-mode build a clear source of truth.

Repeat the full website plan and brand direction in this chat.

Include the audience, goal, page sections, call to action, sample copy, visual direction, image treatment, and the static-site approach. Resolve any important gaps before we build.

As soon as the complete plan appears as text, click Stop; you do not need to wait for Claude to read it aloud. Review the plan in the chat, make sure it names the intended visitor, the action that visitor should take, and the main sections of the page, and correct anything important. Stay in the same conversation so Claude retains the interview and plan for the build request.

Switch to text mode in the same conversation. Upload the photos or other approved assets you want Claude to use. If you prefer to keep the work organized, open the + menu, choose Add to project, and select Start new project. Name the project, keep the existing Voice chat with it, and add your reference files as project context. A project is optional; you can upload the files directly to the conversation instead.

Then send the simplest build request in the guide:

Build the prototype.

Claude uses the interview, written plan, and uploaded assets to create the first website artifact automatically. You do not need to restate the entire brief in a second prompt.

Open the result at full size and check the parts that matter most:

• Does the opening section make the site's purpose clear?
• Are the supplied images actually visible?
• Does the page follow the agreed structure and visual direction?
• Is the primary call to action easy to find?

Pro tip: If Claude skips your uploaded images, say, “Actually use the photos in this artifact.” That one correction fixed the recorded prototype without restarting the build.

For any other visible miss, name one change and preserve the rest of the approved direction:

Keep the approved structure and copy. Make only this change: [ONE VISIBLE ISSUE].

The finished artifact is a fast prototype, not a production website. Use it to validate the message, hierarchy, visual direction, and content before you invest in a full build.