Skip main navigation
We use cookies to give you a better experience, if that’s ok you can close this message and carry on browsing. For more info read our cookies policy.
We use cookies to give you a better experience. Carry on browsing if you're happy with this, or read our cookies policy for more information.
4.16
Graphic comparing Perlin noise and Processing noise
Comparison on Perlin noise and Processing noise

Noise

Noise is everywhere, its all around us and its even in our software.

Processing has another type of random generator, called noise(). Unlike random() and randomGaussian(), noise() will always return the same number for the same argument. You can think of noise() a bit like being a wiggly or distorted version of the sin() function. Rather than being cyclic, noise() returns a smooth, but ever varying wiggle between 0 and 1.

Plot of 1D noise

Here’s the code that generated the plot:

for (int i = 0; i < width; ++i) {
    float noiseValue = (1 - noise(i * 0.025)) * height;
    point(i, noiseValue);
}

There’s a bit of trickery here because we need to ‘flip’ the function upside down as increasing values in the y (vertical) direction move down, not up: hence the 1 - noise(...) bit.

Why multiply i by 0.025? That’s basically a scale factor – the rate that you move along the wiggly line. You’ll need to experiment with this a bit, smaller values give a ‘smoother’, slower change between points, higher values result in faster changes, making things more edgy and jittery. The number is generally between 0.1 and 0.0001. If you use big steps (like 1) the changes between steps are too chaotic (so you’d be better off using random() or randomGaussian()).

The image below shows the difference between distributions of the random(), randomGaussian() and noise() functions. The drawings were created by drawing a thousand horizontal lines according to positions returned from each function. You can see random() has a uniform probability of drawing a line anywhere in the vertical range. randomGaussian() on the other hand has most of its values concentrated in the middle (where the mean is 0). The further out from the centre, the less dense the lines, since we’re moving more standard deviations away from the mean in the middle. noise() seems to have a slightly wider distribution, with a mean around 0.45 – this is a characteristic of Processing’s ‘special’ implementation of noise().

Graphic showing lines draw with random, gaussianRandom and noise functions

Unfortunately, Processing’s implementation of noise() is very poor. In fact its not a proper implementation of Perlin noise at all (Ken Perlin is the researcher who invented the original noise function). You can see the difference in the image at the very top of this page. Notice the symmetric shapes and the visible underlying grid structure for Processing noise (right). Perlin noise (left) looks smoother and more ‘random’. How important this is to your sketches will depend on how and why you want a ‘noise’ function in the first place.

Using noise – example sketches

Try running the w4_05 and w4_06 sketches. The first uses the noise function to control the spinning top that we developed last week, with the noise() function controlling direction and the moving radius of the spinning ‘arm’. Run the sketch and compare the motion of the top with the version that uses the sin() function you developed in week 3 (w3_04).

The w4_06 sketch lets you explore the Processing’s noise() function and interactively change some key values. It also contains our own implementation of noise(), based directly on Ken Perlin’s code (Ken Perlin is the researcher who invented the noise function). You can flip between ‘Processing noise’ and ‘Perlin noise’ by pressing the ‘1’ and ‘2’ keys on your keyboard.

If you’re a purist like me, you can always use the inoise() functions we’ve provided with this sketch to get ‘proper’ noise, but you may just want to be getting on with making interesting artworks with Processing rather than worrying about how well it implements its noise.


Share this article:

This article is from the free online course:

Creative Coding

Monash University

Get a taste of this course

Find out what this course is like by previewing some of the course steps before you join:

Contact FutureLearn for Support