The problem
Most portfolios describe the work. This one had to BE the work: proof that a scroll-driven WebGL site can stay smooth, readable and accessible instead of trading all three for spectacle.
RoleEverything
Timeline2026
ClientSelf-initiated
The approach
One shared Three.js instance and at most three WebGL contexts on the page, GSAP owning every scroll-linked value, and choreography written as stateless maths over pin progress so reversing the scroll is correct for free. Reduced motion is a real branch, not an afterthought.
What it became
A morphing sphere, a headline written along a curve, a gravity playground you catch cards in — and a page that still degrades to a readable document when the scripts never arrive.
What shipped
Scroll-driven WebGL experience- Scroll-choreographed single page
- Morphing sphere and hall atmosphere shaders
- Hand-rolled Z-axis physics playground
- Reduced-motion and no-WebGL fallbacks
Written in
Share- TypeScriptLanguage%
- Three.jsWebGL scenes%
- GSAPChoreography%
- Next.jsApp framework%
- CSSStyling%
Proportions are how much of the build each piece carried.
