Project-05-Wallpaper

sketch

function setup() {
    createCanvas(600, 600);
    background(0);
}

function draw() {
  push();// background
    stroke(100);
    for (var x = 0; x <= 600; x+=50){
      line(x,0,x,600)
    }
  pop();

  push(); // 1,2 domino
    for (var x = 50; x <= 520; x+=200){
      for(var y = 50; y <= 520; y+=200)
      domino(x,y);
    }
  pop();
  // 3,5 domino
    for (var x = 150; x <= 520; x+=200){
      for(var y = 150; y <= 520; y+=200)
      domino2(x,y);
    }
function domino(x,y){
    push();
      noStroke()
      translate(x,y);
      fill(255)
        quad(0,10,20,40,80,20,60,-10) // white face
      fill(200)
        quad(0,10,0,20,20,50,20,40) // light grey face
      fill(100)
        quad(20,40,20,50,80,30,80,20) // dark grey face
      stroke(0)
      strokeWeight(3)
        line(50,30,30,0) // middle line
        fill(0)
          circle(25,20,5) // left dot
          circle(45,3,5) // right dots
          circle(65,15,5)
    pop();
  } //1,2 domino
function domino2(x,y){
    push();
      noStroke()
      translate(x,y);
      fill(255)
        quad(0,10,20,40,80,20,60,-10) // white face
      fill(200)
        quad(0,10,0,20,20,50,20,40) // light grey face
      fill(100)
        quad(20,40,20,50,80,30,80,20) // dark grey face
      stroke(0)
      strokeWeight(3)
        line(50,30,30,0) // middle line
        fill(0)
          circle(25,20,5)//left dots
          circle(13,13,5)
          circle(37,27,5)
          circle(55,10,5)//right dots
          circle(44,3,5)
          circle(67,17,5)
          circle(55,22,5)
          circle(57,-2,5)
    pop();
    } // 3,5 domino
    noLoop();
}

I was looking into how wallpapers were a consistent pattern of repeating actions and reactions. Dominos are an immediate thought when asked about chain reactions so I created dominos in an isometric view with 2 different dominos. Each row and column alternate to create a 3D marking effect. The end product is a noir themed domino wallpaper.