Demo✨ https://robpayot.github.io/htct-3d-pa...
Template 🎓 https://github.com/Robpayot/vite-thre...
Full code access (including the mouse effect and all other tutorials!) / support 🙏🏻 https://www.patreon.com/user?u=50160165
...
In this video we will learn how to create an image from particles using the Three.js library. You will learn how particles and shaders works to achieve theses cool effects in your browser.
To do this tutorial you will need to download the template above and follow
the instructions, good luck!
If you finished the exercise feel free to send your creations in the
comments, I'd be happy to see what you guys are capable of!
...
Hi my name is Robin Payot, I'm a french creative developer making WebGL
websites since 2015, I'm also jury FWA since 2016 and I'm still working
as a freelancer. I've been working with many awarded agencies all over
the world and I'm here to share with you everything I've learned back
then.
You can support me and get a direct access to the code by subscribing to
my patreon ( https://www.patreon.com/user?u=50160165 ), supporting will also give me more time to make new videos!
Thanks!
Other useful links: 📖
Threejs: https://threejs.org/
Learn Threejs: https://threejs.org/docs/index.html#m...
More Threejs example: https://threejs.org/examples/?q=part#...
Music licence Epidemic Sound.
Chapters:
00:00 Intro
01:42 Begin the exercise
03:54 Custom Geometry
09:34 Points (particles)
13:40 Grid of particles
20:04 Custom ShaderMaterial
36:40 Texture + UVs
55:47 Appear effect
1:09:09 Wave effect
1:16:24 Final result
#threejs #tutorial #3d #particles #javascript