Create STUNNING 3D Scroll Animations with Next.js | Step-by-Step Guide

To try everything Brilliant has to offer—free—for a full 30 days, visit https://brilliant.org/DanGreenheck/ . You’ll also get 20% off an annual premium subscription 📚 Want more Three.js resources? Check out my collection of courses, from beginner to advanced! https://threejsroadmap.com ⭐️ THREE.JS https://threejs.org ⭐️ REACT-THREE-FIBER https://r3f.docs.pmnd.rs ⭐️ GSAP https://gsap.com 💻 MACBOOK 3D MODEL https://www.cgtrader.com/items/2038937/ 👨🏻‍💻 SOURCE CODE https://github.com/dgreenheck/nextjs-3d-scroll-animations 🎮 LIVE DEMO https://dgreenheck.github.io/nextjs-3d-scroll-animations/ This video was sponsored by Brilliant. 0:00 Intro 0:59 Sponsored Message 2:26 Starter Project 4:53 Finding a 3D Model 6:27 Prepping Model in Blender 8:54 Installing Dependencies 10:33 Scene Component 17:16 Importing The Laptop Model 25:28 Animating Laptop Model 43:38 Animating Text Opacity 48:54 Adding Shadows