Emily Zhou –– Wallpaper

sun & pyramid

var sideL = 80; // side length of each square tile

function setup() {
    createCanvas(400, 480);
}

function draw() {
    // blue background
    background(142, 154, 175);
    // green triangles
    for (var y = 0; y <= height; y += sideL) {
        for (var x = sideL; x <= width; x += sideL) {
             fill(174, 181, 171);
             noStroke();
             triangle(x, y, x - sideL, y + sideL, x, y + sideL);
        }
    }
    // tan triangles
    for (var y = sideL / 2; y <= height; y += sideL) {
        for (var x = sideL / 2; x <= width; x += sideL) {
             fill(229, 211, 197);
             noStroke();
             triangle(x, y, x - sideL / 2, y + sideL / 2, x, y + sideL / 2);
        }
    }
    // orange triangles
    for (var y = sideL / 2; y <= height; y += sideL) {
        for (var x = sideL / 2; x <= width; x += sideL) {
             fill(229, 162, 126);
             noStroke();
             triangle(x, y, x, y + sideL / 2, x + sideL / 2, y + sideL / 2);
        }
    }
    // 3/4 circle
    for (var y = sideL / 2; y <= height; y += sideL) {
        for (var x = sideL / 2; x <= width; x += sideL) {
             fill(237, 238, 192);
             noStroke();
             arc(x, y, sideL / 2, sideL / 2, 3/4 * PI, 1/4 * PI);
        }
    }
    noLoop();
}

My wallpaper is meant to be an abstract representation of the sun rising behind a pyramid. I vaguely remember seeing a wallpaper at a museum that represented the Pyramid of Giza using two like-toned triangles. Starting with that idea, I played around with layers of overlapping shapes and colours.

In the process, I found it much easier to control the shapes’ position after setting a tile length variable. I am happy with the way it turned out using just triangles and one circle per tile. Even though I like the abstraction and simplicity, I’d like to explore more organic forms in future projects.

Leave a Reply