For our final project, we had to integrate everything we learned in the class to create a partial model of our solar system with the sun, Earth, and moon using JavaScript and WebGL.

The only lighting in this world comes from a diffuse point light situated at the position of the sun. The sun and background have emissive lighting to show the full color of their texture. The Earth and sun are only lit by the diffuse point lighting.

All of the celestial bodies rotate about their y axis, but at different rates. The Earth revolves around the fixed point of the sun, while the moon’s revolution around is a bit more complex since it revolves around the non-fixed position of the Earth.

Although the model can be improved, I am pretty happy with the result since I had zero experience writing shaders and have not taken math since Calculus I ten years ago. This class involved some understanding of Linear Algebra, which I was able to follow along well enough to to find success in this class.

In our penultimate week, we learned about shadow mapping–specifically, casting shadows from a single directional light. First, we had to render scene depth from the point of view of the directional light into a texture. Next, we had to re-render the scene from the eye, determining whether each pixel was in shadow (by using the depth texture created in the initial rendering).

Continuing with WebGL, we implemented directional lighting Phong shading–a combination of ambient, diffuse, and specular lighting. Each of these three components are computed as a function of the light and surface material properties.

Diffuse lighting is view independent since it is uniformly distributed. However, the orientation of the light impacts the intensity of its reflection. This is represented by the lambertian term (derived from Lambert’s cosine law). Specular lighting, being non-uniformly distributed, is view dependent.

To test the Phong shading, we can manipulate the viewing angle of the world as well as the orientation of the light. While the ability to manipulate the view matrix was previously completed, we added the ability to rotate the light orientation (a vector) about the X and Y axes using rotation matrices:

As a bonus implementation, we were given the challenge to implement point lighting with Phong shading: