Side projects

Two more sites I designed and built on my own, from the brief to the launch.

Amélie Drouaud, psychologist

Role
Design, code, SEO, launch
When
August and September 2026
Stack
HTML, CSS, a little JavaScript, PHP for the form

A psychologist’s website that feels like her practice, not like a startup.

Amélie Drouaud is a clinical psychologist in Nantes. Her site ran on WordPress. I rebuilt it as a static site: her own words kept as they were, the colours of her practice (off-white, sand, soft terracotta, sage green), and nothing left to update or patch.

What I did

  • I wrote the brief before any code: what to keep word for word, the design rules (real photos, no stock gradients, no filler text) and the SEO requirements.
  • Eight pages in plain HTML and CSS, with Cormorant Garamond and Inter served by the site itself, so no request goes to Google.
  • Local SEO: a title and description for each page, structured data for the practice with its address, coordinates and opening hours, FAQ data, and 301 redirects from the old WordPress addresses.
  • A new page, “When should you see a psychologist?”, written for what people actually search.
  • Images in WebP with a JPEG fallback: the scanned code of ethics went from 570–789 KB a page to 27–144 KB.
  • A contact form sent over SMTP, where visitors choose how they’d like to be called back. Appointments go through Doctolib.
The “When should you see a psychologist?” page of amelie-drouaud-psychologue.fr, in serif type on an off-white background
The “When should you see a psychologist?” page, on amelie-drouaud-psychologue.fr.

This portfolio

Role
Design and code
When
First version in November 2025, rebuilt in October 2026
Stack
Next.js, React, plain CSS
Site
You’re on it

A portfolio that uses my day job on itself.

White paper, black ink, a twelve-column grid, and colour only where it means something. The page doesn’t just say that I study how people read a page. It shows it.

What I did

  • My name knocked out of a datamosh: eleven columns of colour drawn live by the browser, in plain CSS, that you can shuffle.
  • A preview card that follows the cursor when you point at a client or a mission.
  • A funnel-shaped progress bar that fills section by section as you scroll.
  • “See this page through my eyes”: an attention map of where I expect the eye to land, with your own clicks on top, kept in your browser only.
  • Interactive figures rather than screenshots: a zoning analysis, a tagging plan, a web and app funnel, and the Clivio case study.
  • English and French with hreflang, structured data for the profile, the case study and its eighteen films, and a video sitemap. Google Analytics only loads if you say yes.
The top of this portfolio with the attention map switched on: warm spots over the name and the introduction
The top of the home page with “See this page through my eyes” switched on. The button is at the bottom right.
  • 99Performance
  • 100Accessibility
  • 100Best practices
  • 100SEO
  • 2/2Agentic navigation
Lighthouse on the home page, tested as a phone on 20 October 2026, median of three runs. Agentic navigation passes both of the checks that apply.