Code · 2026
This website: from sticker face to real 3D
A résumé told as stickers on a face, first drawn, then rendered as a real 3D bust with the stickers cast onto the skin.
160 kB
first-load JS
- 20
- gates on the ledger
- 160 kB
- first-load JS
- 338 kB
- 3D bust, compressed
Problem
Portfolio sites describe. This one had to demonstrate: interaction craft you can feel, live data you can poke, and a face that looks back at you.
Approach
Scroll-driven camera between chapters, chapter dots, a live YouTube feed with no API key, a working sample dashboard, and a 3D stage that loads a GLB, finds the head and eyes by name, raycasts every sticker onto the surface and flies the camera between them.
The craft
The honest part: an AI render of the face read as a ghost and was pulled; a video-editor timeline navigation looked clever and was pulled the same day. Each decision left a gate file behind.
Result
Twenty gates with evidence, first-load JS held at 160 kB by streaming the 3D chunk only when a model exists, and a free 3D bust generated from a single render.
Before / after
View code
Stack
- Next.js 15
- React 19
- three.js
- Framer Motion
- Vercel