Question

How can we create glossy effects on materials with three.js like the one on this link?
I am not interested in path tracing (yet 🙂 )

WebGL Path Tracing

Answer 1

Glossy refers to the ability of a material to reflect light in the specular direction.

In three.js, you can use THREE.MeshPhongMaterial to do that. For example:

new THREE.MeshPhongMaterial( { 
    color: 0x996633,
    envMap: envMap, // optional environment map
    specular: 0x050505,
    shininess: 100
} ) 

You can also use MeshStandardMaterial with an environment map.

three.js r.97