Ocean Simulation Pt 3 — Gerstner Waves

Jon Keon
Karman Interactive
Published in
3 min readJul 6, 2017

Last time, we tried to tackle creating an Ocean using noise functions and animating them to approximate the physical look. Approximate is the key word here as while it looked interesting it wasn’t very accurate and it was taxing on performance as well. That initial approach was simple to implement but we needed to go further to achieve the goals.

If you look at the surface of the ocean there are thousands of little details each of which combine to create a very distinct look. Simulating the ocean as a whole is a daunting task so instead, we started by exploring the simulation of a single wave. Theoretically, if you can get that right, you then can increase the number of waves and you’d have an Ocean as it’s just a collection of waves.

When describing a wave mathematically, the most common example is that of a Sine Wave.

A Sine Wave
http://upload.wikimedia.org/wikipedia/commons/0/02/Simple_sine_wave.svg

Once we have the equation for our wave it should be pretty trivial to use it to manipulate the height of vertices across a plane to create a visual representation of your wave.
Except that real waves don’t really look like sine waves at all.

A photo of real water with waves
http://fc03.deviantart.net/fs26/i/2008/077/b/0/ocean_by_ETQ.jpg

Instead, real waves are much sharper and come to a peak at the top. As it turns out, this “peak” effect can be modelled using Gerstner Waves.

Gerstner Waves. Ideal shape in red.
http://habibs.wordpress.com/files/2008/04/gertner_waves.jpg

Gerstner Waves allow for a much better representation of the shape of an actual wave. What’s interesting about these waves is that they can be controlled quite finely by manipulating their amplitude, direction and speed. This would allow you to have a giant wave come from the right if needed for gameplay purposes.

With one wave, the simulation is a bit boring and looks more like a wave pool than the Ocean pictured above. However, one of the properties of waves is that you can “add” them together. A peak and a trough will cancel each other out and two peaks would make for a larger peak. These are simplifications of course, but it allows us to layer different Gerstner Waves on top of each other to get more interesting patterns.

Increasing the number of waves to 4 with varying parameters really starts to generate a plane that better represents the ocean. More seems better, so what would happen if we increased to 16 waves?

Perhaps a little bit better but not really noticeable. If anything we’ve smoothed (averaged) out those wave peaks that we worked so hard to achieve. This happens because, for every one wave that is contributing a sharp peak at a given location there are 15 others trying to smooth it out. In order to make this really nice, we’d need to fine tweak the properties of each individual wave. It’s possible, but definitely tedious. Especially if we want to be able to change the conditions of the Ocean at runtime. For example going from calm seas to stormy weather and back again.

While this was definitely a step in the right direction, there are still some kinks to work out. We’ll need to figure out a solution to better control a large number of waves keeping performance in mind since we’re trying to target mobile devices. For that we’ll have to wait until the next post.

Originally published on a previous version of our site on November 21st, 2014.

--

--