How to build a website with AI
Turn a clear brief into a useful website with Mythos. Choose the right pages, add your content, check real interactions, and publish the version you reviewed.
Start with a useful result
You can build a website with AI by describing its purpose, supplying the content that matters, and refining the result in a working preview. The decisions that make a site useful still belong to you: who it serves, what it says, and what someone should be able to do there.
Mythos lets you build from a brief or adapt a template, then continue through conversation. This guide follows a small business website from its first outline to publication. The same sequence works for a portfolio, a newsletter page, or a simple product site: decide the job, build a focused version, and check it with real content.
1. Choose the main action
Start with a visitor and a reason to visit. Imagine a small flower studio whose customers want to see its style and request a bouquet for a particular occasion. That is the example we will use here.
Choose one primary action: sending a bouquet enquiry. Then work backward to the information someone needs first, such as flower styles, the area served, collection options, and how far ahead to enquire.
A compact page plan keeps the first version manageable:
| Page | Visitor's question | Content to prepare |
|---|---|---|
| Home | Does this studio make the kind of flowers I want? | A short introduction and photographs of your work |
| Flowers | What could I ask for? | Bouquet examples, supplied price ranges, and seasonal notes |
| Contact | How do I request a bouquet? | Confirmed hours, collection or delivery details, and a contact method |
Combine these into one page if each needs only a short section. Add a separate page when it has enough useful information to deserve one.
2. Prepare the material visitors will rely on
Gather your name, contact details, service descriptions, photographs, and any wording that must appear exactly. Use prices, qualifications, testimonials, and business claims only when you can supply them. An unfinished section is easier to resolve than a convincing claim that is untrue.
Choose images for the role they play. An opening photograph should establish the place or work; a project image should show something the accompanying text explains. Check that you have permission to publish each asset.
You can attach a brief or visual reference and explain what to take from it. For example, ask for the reference's generous spacing while supplying your own wording and photographs. The prompting guide explains how to give useful direction without specifying every design detail.
3. Choose a template or start from your brief
Look through the template gallery if your site follows a familiar pattern. Open the pages and try the navigation. Choose a starting point because its structure fits your material, not just because its opening image looks good.
A portfolio needs room for individual projects. A service business needs a clear route from an explanation to an enquiry. A newsletter page needs enough sample writing to help someone decide whether to subscribe. Our portfolio guide and service website guide explore those choices.
Follow the template workflow to create your copy. If no template fits the site's structure, begin with your brief. You can make the visual choices during the first build.
4. Build the first complete version
Describe the audience, pages, main action, and visual direction in a few clear sentences. For the flower studio, a useful opening request would be: “Build a website for a small flower studio. Show our bouquet styles and help customers enquire about flowers for an occasion, using the photographs and business details I supply.”
Use Plan mode when important choices are still open. Review the proposed scope and approve it when it describes the result you want. If the outcome is already clear, use Build.
The first version could help someone choose a style and send an enquiry. Online payment, delivery scheduling, and stock management introduce further decisions; add them when the business needs them. For more on choosing the scope, read Plan before you build.
5. Make the main action work
Decide where an enquiry should go. An email link and a form that stores bouquet requests are different choices. Pick the one the studio can actually use, and make clear whether the visitor is enquiring or placing a confirmed order.
For saved enquiries or customer accounts, follow the Supabase backend setup and build that flow. Connecting a service alone will not make an existing form save data.
Send a clearly labelled test enquiry with an occasion, budget, and collection date. Check the intended destination and the submitted details. Try an incomplete submission and make sure the page explains what needs correcting. Confirm receipt before relying on the form's success message.
6. Review the site, then publish it
Open the latest Preview and take the route a visitor would take. Can you understand the studio's work, find collection information, and send an enquiry? Check links, images, spelling, and the footer as well as the opening section.
Repeat the journey on a phone. Menus, image crops, and forms often reveal problems that a desktop screenshot hides. Use the mobile-friendly website guide for a closer pass, then give each page a descriptive title.
Open Publish and follow the publication steps. Visit the public address and repeat the main action there. Later edits go live when you select Update. The website launch guide covers your public address and first visitors.
