Perlin Noise in Static Sketch Examples

I am learning and using Processing to build files for my pen plotter. I love using the random function and want to start subbing in the noise function and see what happens. However, as it is not a one to one substitution, I need to see some good examples of code so I can understand how to implement it. Anyone know of any?

I have read the Perlin noise section in Schiffman’s book, watched The Code Train video on Perlin noise, and read the reference section already but need to see some more examples. The examples I am finding are tending towards animated sketches. I am on the hunt for more static ones. I’ll keep looking and post any that I find here, but if anyone knows any off the top of their head or has written some simple ones, I would love to see them!

Search the forum?

see Array of Lines that move different to each other Perlin Noise - #5 by ronantuite

I did and couldn’t find anything that helped a lot. I need something so simple—I think this is part of the problem. The forum discussion you linked is p5, and as a beginner I think I need to stick with just Processing for now.

1 Like

I did just find this in the contributed examples. It isn’t static but is a very simple sketch that demonstrates difference between random and noise:

// Coding Art Book
// Yu Zhang + Mathias Funk, 2020

// visual comparison of random and noise functions

void setup() {
  size(400, 200); 
  background(255); 
  noStroke();
}

void draw() {
  // first the 'random' generated position
  fill(255, 0, 255, 100);
  rect(frameCount, random(0, height), 5, 5);

  // second the 'noise' generated position
  fill(255, 0, 0, 100);
  ellipse(frameCount, map(noise(frameCount/100.), 0, 1, 0, height), 5, 5);
}
1 Like

Try this :slightly_smiling_face:

// tweak of:
// Coding Art Book
// Yu Zhang + Mathias Funk, 2020

// visual comparison of random and noise functions

// to exemplify static approach for a forum question:
//https://discourse.processing.org/t/perlin-noise-in-static-sketch-examples/38711/4

void setup() {
  size(400, 200); 
  background(255); 
  noStroke();
  fill(172, 180, 218);
  
  for(int i = 0 ; i < width; i++){
    rect(i, random(0, height), 5, 5);
	}
  
  fill(188, 110, 172);;

  for(int i = 0 ; i < width; i++){
    ellipse(i, map(noise(i/100.), 0, 1, 0, height), 5, 5);
	}
}

Look mommy, no draw()! :slight_smile:

If you are not going to use draw() loop, you can use other loop …
The frameCount is replaced by the i from the for loop.

A better visualization of the difference IMHO…

void setup() {
  size(400, 200); 
  background(255); 
  noStroke();
  fill(172, 180, 218);
  
  for(int i = 0 ; i < width; i+=2){
		float r = random(0, height);
    ellipse(i, r, 4, 4);
		if (i > 0){
			stroke(0, 100);
			strokeWeight(0.5);
			line(i, r, i-1, pr);
			noStroke();
		} 
		float pr = r;
	}
  
  fill(188, 110, 172);;

  for(int i = 0 ; i < width; i+=2){
    ellipse(i, map(noise(i/100.), 0, 1, 0, height), 5, 5);
	}
}