WebGL water shader and terrain generation

The main goal of this project was to write a water shader and integrate it with some terrain. The way the terrain was generated was up to us, so I chose to do it in two ways:

  • the first way would be a proceduraly generated terrain
  • the second way would be a height-map based terrain generation

The user is free to choose the option they want using the interface. There is also several more options for the user to try and play around with, such as the light position, the shading type, the noise values, etc.

Keybinds

The demo has some keybinds that the user might want to know:

  • Z, Q, S and D keys allow the user to move the camera according to his view direction
  • Shift and Space allow the user to make the camera go up and down

Examples

Below are a few examples of what it is possible to achieve:

Screenshot 1
Screenshot 2

You can check out the demo of this project here.

Links

Demo
#webgl#school‑work#javascript#shader