Build a Smooth Scroll 3D Earth using Three.js, Framer Motion and Next.js

A web animation tutorial on how to make a 3D earth rotate on scroll, with a clip path animation using Three.js, Framer Motion and Next.js. Inspired by https://minhpham.design/ Join the Creative Menu Challenge:   / discord   Demo / Source code: https://blog.olivierlarose.com/tutori... 00:00 Intro 00:32 Earth Component 00:51 Earth Texture 1:20 Rotate on Scroll 1:59 Lazy Loading 2:08 Text Clip on Scroll 2:55 Text Clip on Hover 3:35 Outro More animations: https://blog.olivierlarose.com/ Follow me on Twitter:   / olivierlarose_   Discord Channel:   / discord   Thanks for watching! #react #nextjs #awwwards #gsap #framer #motion #svg #morph