Lighting and Materials in WebGL

The goal of this project was to experiment with different lighting styles and materials by hand-coding shaders that implement different lighting calculation techniques with adjustable material properties.

The scene consists of a number of different objects. In the foreground are a hand-coded cube and sphere along with a teapot and bunny which all slowly rotate. In the background are a series of animated connected assemblies featuring: a set of square pyramids rotating about each other and a rotating together along the red track, a recursively drawn tree, and a “wagging” tail. Finally, there is also a ground plane and set of world coordinate axes.

You can use the WASD keys to control the camera’s position and click and drag the mouse to orient it. There are several drop down menus, sliders, and color-pickers that adjust various properties of the scene.

A complete writeup for the project can be found here, and you can view the project itself here.