100x100 Computational Design Challenge

Throughout 2020 I created 100 computational designs in 100 days as a way to learn creative coding and explore generative art

Day 29 - Pulled Cloth Faces

pulled-cloth-10.png

Today’s sketch is nearly identical to yesterday’s Circular Rainbows. The only difference is the colour (obviously) and I added some noise to the equation. I often have my mentor Adam’s voice in the back of my head saying “what if you tried adding noise to it though”. I think he’s probably onto something.

Sketch:

https://editor.p5js.org/chelseamwatson/present/C0AdruxjM

  • DELETE: stops the drawing

  • RETURN/ENTER: starts the drawing

  • ESC: resets the drawing

  • 1-7: changes the coordinates and quantity of shapes being drawn


Drawings:


Code:

i = 0;
lines = 1;
xoff = 0;
yoff = 0;

function setup() {
  createCanvas(700, 700);
  background(240)
}

function draw() {

  translate(width / 2, height / 2);

  xoff = xoff + 0.01;
  yoff = yoff + 0.01;
  let n = noise(xoff, yoff) * width / 2;

  stroke(50, 50);

  var radius = 300 + n;
  var angle = TAU / 100;

  var x = cos(angle * i) * radius / 2 + (n / 5);
  var y = sin(angle * i) * radius / 2 + (n / 5);
  i = i + 0.1;

  if (lines == 1) {
    line(0, 0, x, y);
  } else if (lines == 2) {
    line(0, 200, x, y);
  } else if (lines == 3) {
    line(200, 50, x, y);
    line(50, 200, x, y);
  } else if (lines == 4) {
    line(100, 100, x, y);
    line(-100, -100, x, y);
  } else if (lines == 5) {
    line(-300, 0, x, y);
    line(300, 0, x, y);
  } else if (lines == 6) {
    line(0, 0, x, y);
    line(50, -150, x, y);
    line(100, -280, x, y);
  } else if (lines == 7) {
    line(-300, 0, x, y);
    line(300, 0, x, y);
    line(0, -300, x, y);
    line(0, 300, x, y);
  }

}

function keyReleased() {
  if (keyCode == DELETE || keyCode == BACKSPACE) noLoop();
  if (keyCode == ENTER || keyCode == RETURN) loop();
  if (keyCode == ESCAPE) background(240);
  if (key == '1') lines = 1;
  if (key == '2') lines = 2;
  if (key == '3') lines = 3;
  if (key == '4') lines = 4;
  if (key == '5') lines = 5;
  if (key == '6') lines = 6;
  if (key == '7') lines = 7;
}

Chelsea Watson