Assuming that you have read Drawing a desert…

Here is a WebGL experiment showing what’s taking place in Sketch.h and Sketch.cpp from the Cliffs project’s source folder.

Sketch.h

We can see 2 new methods: cliffNoiseBase() and posterize().

Sketch.cpp

Inside setup()

surface.setBaseFunction(bind(&Sketch::cliffNoiseBase, this, std::placeholders::_1, std::placeholders::_2));

This defines the base function for our surface. It means that instead of the default function, cliffNoiseBase() will be used in order to generate the values of the internal table.

Let’s examine cliffNoiseBase():

float Sketch::cliffNoiseBase(float x, float y)
{
  return posterize(surface.tilingNoise1d(y, 0.05f), 0.1f) * surface.tilingNoise2d(x, y, surface.noiseScale);
}

The default function corresponds to surface.tilingNoise2d(x, y, surface.noiseScale). So here, we add an effect of posterization in order to switch from a desert to cliffs:

float Sketch::posterize(float x, float factor)
{
  return floorf(x / factor) * factor;
}

That’s all. The rest of the sketch is totally similar to Drawing a desert.