heyalphonse.com: a personal site built with AI
The site you are reading. From sorting 900+ old files and picking a design direction to writing code, building the motion and shipping, it was all done with AI in Cursor.
Why
I wanted a place I could keep updating for years: the judgments I form at work, events I take part in, photography and the small things I build. It also had to be readable by search engines and AI, so people who look me up can find out who I am and what I think.
How
- Sort the material first. AI read more than 900 of my old files from university (CVs, award applications, speeches and photos) plus my recent work notes, and listed what could and could not be used for privacy or confidentiality reasons.
- Confirm the design one decision at a time. Positioning, visuals, structure, language and tech stack were settled question by question. The visuals went through three versions. The first was “consulting report meets photo gallery”, and I didn’t like it once it was live. The second was a white gallery with a single sans-serif typeface: clean, but too still. The third, the one you see now, takes its cues from the animated sites on Motion Sites: a dark opening stage where a large wordmark and a figure overlap, and a white content sheet that slides over it as you scroll.
- The figure and the motion. The figure on the home page was generated by AI from my photo. It went from a Pixar-like look to a felt puppet before settling on a more abstract designer-toy bust, with the background removed by a script. The motion is built with GSAP and Lenis: letters rise in turn, the greeting types itself out, and scrolling is smooth. All of it switches off when the system asks for reduced motion.
- Write the code and ship. The site is built with Astro as static pages. All content lives in Markdown files; every push to GitHub is deployed automatically by Vercel.
- Admin, discoverability and checks. Sveltia CMS lets me write posts and upload photos from the browser. The site ships a sitemap, structured data and an
llms.txtfor language models. Finally, an automated check clicks every link and button on every page, at desktop and phone sizes, before each release.
What I learned
- The slow part is stating the requirements. With AI, the code is the quick bit; every “good enough for now” comes back later.
- Visuals have to be seen, round by round. I could rarely say up front what I wanted, and usually only knew what was wrong once I saw a real page. Getting something viewable early and revising it in rounds beat trying to get it right in one go.
- A page that looks right is not a page where every button works. The more motion and interaction a site has, the more it needs automated checks rather than eyeballing.