How this site was built.
You’re looking at it. Designed and shipped with Claude — here’s the build, in the order it happened, with each piece shown running.
It starts at zero
Before the page even settles, a counter runs 0 → 99 — then a coral wipe carries you in, and between routes after that. It’s session-aware, so it sets the tone once instead of nagging on every navigation.
Then the hero — a globe
The first thing you land on had to feel alive. The hero is a real WebGL particle system — thousands of points sampled onto an earth mask so only the land lights up. It checks for GPU support and reduced-motion first, and quietly falls back to a CSS glow when WebGL isn’t there. Zero console errors either way.
What I do, as a loop
Next, the thesis — animated. A single coral loop carries design → engineering → agentic delivery, because that’s how the work actually happens. One person, with Claude, across the whole loop.
Design
Interface, system, and motion — designed in the browser.
Engineering
Production code, not prototypes. Typed, accessible, responsive.
Agentic delivery
Built with Claude in the loop — brief to shipped, fast.
The work, shown with depth
Then the work itself. A flat grid felt like everyone else’s, so Selected work is a 3D coverflow — a tilted cylinder of cards that auto-rotates and answers to a drag, giving the projects presence before you’ve even clicked one.
Then I made it not cook your laptop.
An early build ran every loop — WebGL, the custom cursor, the starfield — all the time, and the fan spun up. Now each one pauses the moment it scrolls off-screen or the tab goes idle. The flourishes stay; the heat doesn’t.
- Framework
- Next.js 16 · App Router · Turbopack
- Language
- TypeScript
- Styling
- Tailwind v4 (CSS-first, design tokens)
- Motion
- Framer Motion · Lenis smooth scroll
- 3D / GPU
- React Three Fiber · three.js · 2D canvas
- Type
- Bricolage Grotesque · Hanken Grotesk · Newsreader · JetBrains Mono
- Deploy
- Vercel · Cloudflare DNS · eddieeddie.com
Built with Claude — design and code in one loop.
And to be clear — this isn’t an AI-generated template. I come from UX/UI design: studied it, practise it. Every type choice, grid, and interaction here is a deliberate call, not a default. Claude is the tool that lets me move fast — the design judgment is mine.
I don’t hand a design to engineering and wait. I work with Claude in a tight planner → generator → evaluator loop: a sprint is planned, built, then scored against a rubric — functionality, design, accessibility, performance — and it doesn’t ship until it clears the bar. Every piece above was made that way.
That’s the whole pitch: velocity and rigor, together. This site is the proof — designed, built, hardened and shipped to a live domain, the same way I’d build for a client.