Create more realistic materials

When discussing the materials available in Three.js, we mentioned that a good default material to use is THREE.MeshStandardMaterial. We can use this to create shiny, metal-like materials but also to apply roughness to make the mesh look more like wood or plastic. By using the metalness and roughness properties, we can configure the material to represent what we want.

Aside from these two properties, we can also configure these properties by using a texture. So, if we have a rough object and we want to specify that a certain part of that object is shiny, we can set the metalnessMap property ...

Introduction to the Course

Part 1: Getting Up and Running

Creating the First 3D Scene with Three.js

The Basic Components That Make Up a Three.js Application

Working with Light Sources in Three.js

Part 2: Working with the Three.js Core Components

Working with Three.js Materials

Learning to Work with Geometries

Exploring Advanced Geometries

Points and Sprites

Part 3: Particle Clouds, Loading, and Animating Models

Creating and Loading Advanced Meshes and Geometries

Animation and Moving the Camera

Loading and Working with Textures

Part 4: Post-Processing, Physics, and Sounds

Render Post-Processing

Adding Physics and Sounds to Our Scene

Working with Blender and Three.js

Three.js: Together with React, TypeScript, and WebXR

Conclusion

Appendix

Metalness and Roughness Maps

Create more realistic materials