Aaron Lee – Project 05 – Wallpaper

sketch

/*
Aaron Lee
//Section C
//sangwon2@andrew.cmu.edu
Project-05-Wallpaper
*/

function setup() {
    createCanvas(600, 600);
    background("grey");
    var d = 30;

    for (var y = 0; y < 660; y = y + 60) {
        for (var x = 0; x < 600; x = x + 60) {
          push();
          fill('#809DFF');
          beginShape();
          vertex(x, y);
          vertex(x + 10, y - 10);
          vertex(x + 20, y);
          vertex(x + 30, y - 10);
          vertex(x + 40, y);
          vertex(x + 20, y + 20);
          endShape(CLOSE); //the shape1
          pop();
          push();
          fill('#5A5B83');
          beginShape();
          vertex(x, y);
          vertex(x + 20, y + 20);
          vertex(x + 20, y + 80);
          vertex(x + 10, y + 60);
          vertex(x + 10, y + 30);
          vertex(x, y + 20);
          endShape(CLOSE); //the shape2
          pop();
          }
        }

    for (var y1 = -30; y1 < 660; y1 = y1 + 60) {
        for (var x1 = 0; x1 < 600; x1 = x1 + 60) {
          push();
          fill('#CCD8FF');
          beginShape();
          vertex(x1 + d, y1);
          vertex(x1 + 10  + d, y1 - 10);
          vertex(x1 + 20  + d, y1);
          vertex(x1 + 30  + d, y1 - 10);
          vertex(x1 + 40 + d, y1);
          vertex(x1 + 20 + d, y1 + 20);
          endShape(CLOSE); //the shape3
          pop();
          push();
          fill("#7274CC");
          beginShape();
          vertex(x1 + d, y1);
          vertex(x1 + 20 + d, y1 + 20);
          vertex(x1 + 20 + d, y1 + 80);
          vertex(x1 + 10 + d, y1 + 60);
          vertex(x1 + 10 + d, y1 + 30);
          vertex(x1 + d, y1 + 20);
          endShape(CLOSE); //the shape4
          pop();
          }
        }
    noLoop();
}

function draw() {
    // draw is not called due to noLoop() in setup()
}

This was a rather simple process. First, setting up a loop function for both x and y. Then I created shapes in rows that create illusion.