JOIN OUR DISCORD! / discord In this tutorial, I show you how you can create a 3D parallax-style landing page with Three.js and some interactive typography! Also, let me know in the comments what you think about the new editing style of this video! It's been way too much work, but I hope you enjoy it!
Get my Gradient HDR Pack to support me! miroleon.gumroad.com/l/gradie...
Previous Three.js Tutorial Gradient HDRs • Level Up Your Renderin...
Previous Three.js Tutorial Introduction • Create this 3D WEB REN...
Previous Three.js Surface Imperfection Tutorial • Improve Your THREE.JS ...
Find the code for this scene - codepen.io/miroleon/pen/MWzxdqr
Get 2 Freebies - miroleon.gumroad.com/l/gradie...
Find the GitHub Repo with the Freebies and a Three.js Example - github.com/miroleon/gradient_...
Find my other artwork on Instagram - / miroxleon
Follow me on Twitter - / miroxleon
For all other links and contact, visit my website - miroleon.de/links
Thanks to the Minneapolis Institute of Art for making the 3D model available in the public domain - skfb.ly/6R7ID
Chapters:
0:00 Introduction
0:40 HTML Setup
1:05 CSS Setup
2:34 JS Setup
2:45 Parallax Effect Setup
3:15 Function updateScale
6:17 Three.js Scene
6:54 Update Camera on Scroll
7:26 Outro
21 июл 2024