# Directed by me: a playbook for building an AI-made personal site

> Draft. This file is a working version and will be updated as the site is finished.
> Paste it into Claude or ChatGPT and ask it to walk you through building your own.

## 1. Toolchain, cost and time

| Job | Tool | Cost |
|---|---|---|
| Writing, design and code | Claude | Existing plan |
| Intro and summary videos | HeyGen | One paid month for final renders |
| Voice | ElevenLabs (voice clone) | One paid month |
| Code storage | GitHub | Free |
| Hosting | Vercel (Hobby plan) | Free for personal sites |
| Domain | Porkbun | About $11 a year per .com |

Time: to be filled in.

## 2. Workflow

1. **Decide the pitch.** What should a visitor take away in under a minute? Write that down before any design.
2. **Write the scripts.** A 60–90 second intro, and a 30-second summary for each long piece. Draft with AI, then rewrite in your own words.
3. **Make the voice.** Record 2–5 minutes of clean audio in a quiet room and clone it.
4. **Make the video.** Build an avatar from one good photo. Render in short segments. Download the file directly; do not screen-record it.
5. **Design and build.** Ask the AI for a static site: plain HTML and CSS, one shared stylesheet. Review a screenshot of every change before it goes live.
6. **Ship.** Code in a GitHub repository. Vercel watches the main branch and publishes automatically. Point your domain at Vercel from your registrar.

## 3. Prompts

To be added: the actual prompts used for the scripts, the design direction and the build.

## 4. Design rules behind this site

- Warm near-black background `#0F0E0C`, text `#F2EEE8`, muted text `#A39C92`.
- One accent, warm tan `#D9A86C`, taken from the video backdrop.
- Inter Tight for headlines, Inter for body text, JetBrains Mono for small labels.
- One idea per screen. Large, tight headlines. Rounded video frames. No decoration that doesn't carry meaning.
- Every AI-made piece is labelled, small and confident.

## 5. Script template for your intro video

> This isn't me. It's an AI version of me, built from one photo and my voice.
>
> I've spent [years] in [field]. [One line on where].
>
> Over those years, I've learned that [your core belief]. [One concrete example.]
>
> That's changing how my teams work: [what you do differently now].
>
> So I built this site the way I'd want any team to work. [Tools.] AI did the making. Every word and every decision was mine.

## 6. Where AI got it wrong, and where I stepped in

- **Commit identity.** The AI signed its commits with an email not linked to my GitHub account, and Vercel's free plan refused to publish them. Fix: commit with the email your GitHub account uses.
- **Redirect loop.** The domain settings and the site's redirect rules pointed at each other. Fix: decide one main address and let one system own each redirect.
- **Screen-recorded video.** The first test video had a player bar baked into it. Fix: always download the rendered file.
- **Tone.** The AI's first titles were more combative than I am. Fix: edit every word that goes out under your name.