12c How to use PBR materials three.js
Learn where to get free PBR materials.
Learn about ambient occlusion, height, roughness, normal, metal, and albedo maps.
Learn how to load PBR materials into three.js.
Learn how to control PBR map properties in three.js.
Timestamps:
00:00 Intro/demo
00:12 Where to get free PBR materials to use
00:25 How to create a texture loader to load textures three.js
00:43 What is ambient occlusion map?
01:11 What is metalness map?
01:37 What is roughness map?
01:59 What is normal map?
02:22 What is height map?
02:47 What is albedo map or color map?
03:14 Create cube to texture three.js
03:43 How to apply color map / albedo map as texture three.js
04:02 How to apply normal map and control using normalScale property three.js
05:05 How to apply displacement map and control using displacementScale and displacementBias properties three.js
06:14 How to apply roughness map and control using roughness property three.js
06:30 How to apply ambient occlusion map, create second set of UVs, and control using aoMapIntensity property three.js
07:11 How to apply metalness map and control using metalness property three.js
Resources:
Free PBR Materials:
https://www.textures.com/library
Three.js Mesh Standard Material Documentation:
https://threejs.org/docs/?q=standard#...
Texture Maps:
https://conceptartempire.com/texture-...
Brief Intro to Texture Mapping:
https://discoverthreejs.com/book/firs...
