Real-Time 3D Graphics with WebGL 2 - Second Edition

Phong Shading

Unlike the Goraud interpolation, where we calculated the final color for each vertex, the Phong interpolation calculates the final color for every fragment. This means that the calculation of the ambient, diffuse, and specular terms in the Phong model are performed in the fragment shader instead of the vertex shader. As you can imagine, this is computationally more intensive than performing a simple interpolation like in the two previous scenarios where we were using Goraud interpolation. However, we obtain a scene that seems more realistic.

After this translation, you may be wondering what is left for the vertex shader to do. Well, in this case, we will create varyings that will allow us to do all of the calculations in the ...