Colophon
Some notes on how this site is put together, for anyone who's curious.
Stack
- Next.js 15 with the App Router
- TypeScript, strict mode
- Tailwind CSS with CSS variables for the colors
- No animation library. The few fades are CSS, with a small IntersectionObserver to trigger them on scroll
- Bricolage Grotesque for the text, DM Mono for dates and captions
- Deployed on Vercel
Notes
It's mostly just writing
Earlier versions of this site had a big headline, a rotating word, a slogan. None of it sounded like me. This version is closer to how I'd introduce myself if we met: who I am, where I've worked, what I'm building, how to reach me. The design stays out of the way of that.
One typeface, one column
Everything you read is set in Bricolage Grotesque. It has some character at large sizes and reads calmly at text sizes, which is the whole job. The page is a single column about as wide as a comfortable line of text, with the photo tucked beside the intro.
Motion you barely notice
Things fade in a little as you scroll, once. Nothing bounces, nothing follows your cursor, and there's no animation library doing it. An earlier version shipped Framer Motion and a smooth-scroll library for what amounted to a few fades, which felt like the wrong trade. If your system prefers reduced motion, everything just appears.
Content is data
Projects, work history, and every paragraph on the site live as typed files in src/lib/data. When I want to change what the site says, I edit a text file, not a component. The résumé page renders from the same data, so it can't drift from the home page.
The source is on GitHub.