Learn Next.js 15, GSAP, Three.js and Prismic to build a 3D skateboard website!

Prismic YouTube

video

Jan 3, 2025

9 hours 31 minutes

Role: Designer, Developer & Instructor

I designed and built Suburbia Skateboards, a branded marketing site with a 3D skateboard customizer, then taught the entire project in this course.

The customizer lets visitors swap deck textures, grip tape, trucks, and wheels on a Three.js skateboard in real time, with camera controls and board state encoded into the URL so configurations can be shared and linked. The marketing side layers GSAP-driven skate tricks onto a scroll-controlled 3D board, with wavy SVG camera paths, a physics-based footer, and sticky parallax sections. All content runs through Prismic’s page builder, so a non-developer can rearrange pages slice by slice.

I also spend real time on the architecture choices under the hood: managing 3D scene state with React Context, working around a React 19 version mismatch, handling Safari’s Three.js rendering quirks, and wiring texture uploads through Prismic so new skateboard designs can ship without a deploy.

Watch the full course