Create a Stunning 3D Animated Portfolio Website with Next.js, Three.js, GSAP, and Prismic

Prismic YouTube

video

Dec 28, 2023

5 hours 4 minutes

Role: Designer, Developer & Instructor

With: Next

I designed a distinctive developer portfolio, not the usual template, and taught the build from blank canvas to deployment. The hero uses a letter-by-letter reveal synced to GSAP, a 3D scene sits behind it via react-three-fiber, and subtle sound effects give navigation some personality.

The rest of the site extends that tone: a scrolling tech-stack marquee, hover and scroll animations tuned to feel responsive rather than showy, and a Job Experience slice driven by Prismic so anyone can edit it. I focus on the design choices as much as the code: the timing, easing, and restraint that separate a portfolio that feels polished from one that feels busy.

Watch the full course