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 23 - White Castles

white-castles-1.png

Today’s sketch was far more trouble than it’s worth. After playing around with cubes yesterday, I thought I could bring that code into today and tweak it to try and replicate architectural style drawings. It didn’t really come together how I planned it, and I struggled with opacity in WEBGL mode. But, here we are! Day 23!

Sketch:

https://editor.p5js.org/chelseamwatson/present/y3Y5C_s-D

  • ENTER: adds another white shape

  • DELETE / BACKSPACE: resets the canvas


Drawings:


Code:

function setup() {
  createCanvas(700, 700, WEBGL);
  background(252, 246, 237);
  stroke(50);
  fill(255, 255, 255);
}

function draw() {



  let s1 = random(10, 100);
  let s2 = random(100, 250);
  let s3 = random(50, 200);

  rotateY(150);

  line(-1000, 10, 500, 100);

  translate(50, -30, 0);
  box(s1, s2, s3);

  translate(0, 0, 90);
  box(s3, s1, s2);

  translate(-60, 0);
  box(s1, s2, s3);

  translate(0, 100);
  box(s1, s3, s2);

  translate(50, 0);
  box(s2, s3, s2);

  translate(-90, 0);
  box(s2, s1, s3);

  noLoop();

}

function keyPressed() {
  if (keyCode === ENTER) {
    loop();
  } else if (keyCode === BACKSPACE) {

    background(252, 246, 237);
    loop();
  }
}

Chelsea Watson