Project 02 ยท This site

๐ŸŒ

A personal site that
documents its own construction.

Built in a single Claude session from a briefing document. No developer, no framework, no code written by hand.

About the project

What it is and
how it was built.

davidsevans.com is itself an AI project. It was built by writing a structured briefing document โ€” brand palette, section order, content, hosting instructions, technical constraints โ€” and uploading it to Claude along with pre-written Behind the Build stories. The session produced a complete, deployable website.

The logo from Instant Pot Doc was embedded mid-session by uploading the image and asking Claude to brand the project card. It was converted to base64 and embedded directly in the HTML so the image travels with the file โ€” no external assets, no image folder, no dependencies.

The site was then restructured from a flat single page to a project hub model โ€” each project card links to its own dedicated page. That UX decision was presented as two options with a recommendation and rationale, built immediately after approval, and documented as a Behind the Build snippet in the same session.

Behind the Build

The details that don't
fit in a LinkedIn post.

Three narrative stories about the decisions and moments that shaped this site.

01

The Briefing Document

Writing requirements before writing a single line of code

+

Before I asked Claude to build this site, I wrote a briefing document. Not a vague description โ€” a structured brief with every detail I could anticipate: brand palette with exact hex codes, font names, section order, full content for each section, hosting instructions, and an explicit note that I am not a coder and everything must be deployable by drag and drop.

I also prepared a second document โ€” eleven narrative stories, already written, ready to drop into the Behind the Build section. Claude was given everything it needed before the first message was sent. The entire site โ€” navigation, hero, About, Projects, Practitioner AI series, snippet cards, contact section, footer โ€” was produced in a single session.

The lesson held from the Instant Pot Doc build: the quality of what AI produces is directly proportional to the quality of what you give it. Write the brief before you open the chat.

The executives who got bad software were the ones who could not articulate what they wanted. That rule does not change when your builder is a language model.

02

Briefing Doc to Live Site

What one session with Claude actually produced

+

The entire site you are reading was built in a single Claude session. I uploaded two documents โ€” a full briefing and a snippets file โ€” and within that conversation Claude produced a complete, deployable website. Then I uploaded the Instant Pot Doc logo mid-session and asked if it could brand the project card. Claude converted it to base64 and embedded it directly in the HTML so the image travels with the file โ€” no external assets, no image folder, no dependencies.

When I asked whether the website itself should be listed as an AI project, Claude said yes immediately โ€” and added a third project card, new Behind the Build snippets, and updated the deployment instructions, all within the same session.

From first message to a file ready for Netlify Drop: one conversation, one afternoon.

Treat AI sessions like working sessions, not search queries. Bring everything you need, stay in the conversation, iterate in real time. The output compounds within a session in a way it never does across separate chats.

03

Drill Down, Not Scroll Down

The UX decision that restructured everything

+

The original site was a single page with flat sections โ€” Projects, Practitioner AI, Behind the Build โ€” all stacked together. As the project list grew, stories from different projects were going to pile up with no way to tell which project they belonged to.

I described the problem to Claude and asked for two UI options with a recommendation. Within minutes Claude came back with a visual diagram of both approaches and a clear recommendation: project hub pages. Each project card links to a dedicated page with everything about that project in one narrative arc. The reasoning was specific โ€” senior executives make one decision early, is this worth my time, and if they click a card they have already self-selected. Give them the complete story without making them work for it.

The restructure went from decision to three linked HTML files in a single session. Index page, Instant Pot Doc hub, davidsevans.com hub โ€” all built, linked, and ready to deploy as a folder.

AI is not just a builder. It is a thinking partner. Describe the problem, ask for options, ask for a recommendation with reasoning. The answer you get back is often faster and more structured than what you would have worked out alone.