How to Make a 3D Glass Effect using Three.js and Next.js
A website tutorial on how to create a Glass looking Material with distortion by using the MeshTransmissionMaterial with Three.js, React, React Three Fiber and Next.js.
Source Code / Live demo:
https://blog.olivierlarose.com/tutori...
00:00 Intro
00:19 Asset Preparation
3:01 Rendering the Canvas
5:16 Rendering the mesh
6:47 Adding lights
8:25 Adding responsiveness
8:49 Rotating the mesh
9:33 Adding the text
11:14 Adding the Transmission Material
13:30 Outro
More animations: https://blog.olivierlarose.com/
Follow me on Twitter: / olivierlarose_
Discord Channel: / discord
Thanks for watching!
#react #nextjs #awwwards #gsap #framer #motion
