How to build a portfolio website with AI

A useful portfolio answers three questions: what do you make, what was your contribution, and how can someone hire you? Decide those answers before changing fonts or asking AI for a new layout.

Atelier Folio provides an editorial starting point with Index, Studio, Work, and Writing pages, a warm paper palette, and a dark mode. It suits a freelancer or small studio with projects to explain and images to show. The cover above depicts the starting template, not a completed client portfolio.

Open its Preview and compare the page structure with your material. Keep Work for selected projects and Studio for your approach. Keep Writing only if you have something useful to publish; otherwise remove its navigation entry and unused page together. Three well-explained projects can make a clearer portfolio than a large gallery of unexplained images.

Before starting a Remix or requesting a Build, review the current pricing and usage terms. Preparing your content first helps avoid paying for repeated corrections to an incomplete brief.

Create one short brief with your name or studio name, specialty, preferred clients, contact address, and project material. Choose the language your prospective clients actually use. An English editing interface does not require your published portfolio copy to be English.

For each selected project, supply:

• Context: what the client or project needed.
• Your role: what you personally designed, wrote, built, or directed.
• Work shown: screenshots, photographs, sketches, or a live link you may share.
• Decisions: one or two choices that explain your approach.
• Outcome: a result you can substantiate, or a clear description of the deliverable.

Label personal concepts as concepts. Name collaborators when the work was shared. If a client did not give permission to publish, use an approved anonymized case or omit it. Do not ask AI to invent conversion improvements, client names, awards, or testimonials.

Give every image a useful filename and a note explaining what it shows. Also supply the destination of every project, social, email, and CV link. An attractive button with a placeholder destination leaves the visitor with unfinished work.

Start from the template page, use its Remix action, and provide your prepared material in the project. Keep the first request about the portfolio as a whole: identity, selected work, navigation, and contact. Replace the bracketed fields below before sending it.

Adapt Atelier Folio into a portfolio for [name], a [specialty]
working with [client type]. Use [language] for the website copy.

Keep the warm editorial style and the existing light/dark themes.
Use the attached images and the project facts below.
Do not invent clients, results, awards, or testimonials.

Index: state what I do and show these selected projects: [list].
Work: explain each project's context, my role, decisions, and deliverable.
Studio: use this biography and service description: [text].
Writing: [keep with supplied articles / remove the page and its links].
Contact: use [email]. CV: [real file or URL / remove the link].

Preserve working navigation. Make long project titles and images readable
on mobile. If any required content is missing, tell me what is missing
instead of filling it with a made-up fact.

When the edited Preview is available, compare it with the brief. If the layout is good but a case study is unclear, request a specific copy change. Focused follow-up edits are easier to review than repeatedly asking to make the entire site “more premium.”

Open the portfolio without referring to your brief. The first screen should name your specialty, while each project should explain your contribution without making visitors infer it from screenshots. Replace vague labels such as “creative solutions” with the actual work you offer.

Check that each project card opens the intended destination and that its title, image, and description refer to the same project. Inspect the Writing section for sample posts and dates. Remove a section if you cannot support it with real content; a smaller complete portfolio is easier to maintain.

Atelier Folio starts with email links, not a contact-form service. Set the recipient to an address you monitor and show the address as readable text so visitors can copy it. A mailto link normally opens the visitor's email application; it does not send a message by itself. Test the destination and send yourself a separate test email. Replace the template's CV placeholder with the intended file or remove it.

Review desktop and narrow mobile widths, then use an actual phone when available. A project can look impressive in a large screenshot yet become impossible to understand on a small screen.

• Read the longest heading and project title without horizontal scrolling.
• Check image crops: the subject should remain visible and small interface text should not be the only explanation.
• Add concise image descriptions where they help explain the work; decorative imagery does not need repetitive captions.
• Follow the menu, project links, and contact action with a keyboard.
• Check light and dark themes, including captions, muted text, focus indicators, and logos.
• Open the CV and any external project link from the mobile view.

Use appropriately sized images rather than full-resolution source exports for every thumbnail. Keep original project files separately. If an image needs a long explanation, put that explanation in text beside it so visitors can understand the case study without enlarging the image.

Set a page title that identifies you and your work, such as “[Name] — [Specialty] portfolio.” Write a short description using real services and project themes. Check the sharing image and the language of the page. These details help describe the page; they do not guarantee search placement.

Use Publish when you are ready to make the portfolio public. Open the published address in a signed-out browser and repeat the primary journey: homepage, selected project, contact. Also open a nested page directly and refresh it. Confirm that private client material, template names, sample addresses, and unused placeholder links are gone.

Keep a small maintenance list: new work to add, unavailable projects to update, and the email address to monitor. For a studio, assign someone to answer inquiries and keep the portfolio current.

Open Atelier Folio to inspect the starting point and prepare your project brief. If the site is mainly about one service rather than your body of work, use the service-business website guide instead.