DEV Community

Cover image for Learning Generative Art; day 6 "Surface Wave" 🏄
Masato Ohba
Masato Ohba

Posted on

Learning Generative Art; day 6 "Surface Wave" 🏄

Continuation of My first step in learning Generative Art. I'm going to finish this series tomorrow, so this is the second to last.

"Surface Wave"

2018-05-05 21 58 21

2018-05-05 21 57 17

surface_blue

surface_orange

I've tried to express surface wave with 2D noise. It looks like a wave, and also surface on the earth.

I can calm down by watching a wave no matter whether the wave is electric or natural. What about you?

var yoff = 0.0;
var backgroudColor;

function setup() {
  createCanvas(1400, 400);
  backgroudColor = 255;
  // backgroudColor = 22;
}

function draw() {
  background(backgroudColor, 2);

  fill(backgroudColor, 2);
  stroke(color(random(22),random(100, 255),random(255), 200));
  // stroke(color(random(222, 255),random(100, 155),random(10), 200));
  strokeWeight(random(4))
  beginShape();

  var xoff = 0;

  for (var x = 0; x <= width; x += 10) {
    var y = map(noise(xoff, yoff), 0, 1, 100, height);
    vertex(x, y);
    xoff += 0.05;
  }

  yoff += 0.01;
  vertex(width, height);
  vertex(0, height);
  endShape(CLOSE);
}
Enter fullscreen mode Exit fullscreen mode

Top comments (0)