Julia Nishizaki – Project 05 – Wallpaper

sketch

//Julia Nishizaki
//Section B
//jnishiza@andrew.cmu.edu
//Project-05-Wallpaper

function setup() {
    createCanvas(600, 600);
    background(18, 120, 161);
    noLoop();
}

function draw() {
    //grid background
    for (var y = 0; y < height + 25; y += 50) {
        for (var x = 0; x < width + 25; x += 50) {
            //diagonal lines
            var linelength = 25;
            strokeWeight(5);
            stroke(63, 159, 188);
            line(x - linelength, y - linelength, x + linelength, y + linelength);
            line(x - linelength, y + linelength, x + linelength, y - linelength);
            //short crosses that break up the diagonal lines
            var linelengthHorizon = 5;
            stroke(18, 120, 161);
            strokeCap(ROUND);
            line(x - linelengthHorizon, y, x + linelengthHorizon, y);
            line(x, y - linelengthHorizon, x, y + linelengthHorizon);
        }
    }
    //normal bird layer
    for (var y = 0; y < height + 100; y += 100) {
        for (var x = 0; x < width + 100; x += 100) {
            bird(x, y);
        }
    }
    //offset bird layer
    for (var y = 50; y < height + 100; y += 100) {
        for (var x = 50; x < width + 100; x += 100) {
            bird(x, y);
        }
    }
}
function bird(x, y) {
    push();
    translate(x, y);
    noStroke();
   
    //bird variables:
    var birdHeadS = 20;
    var birdHeadX = -25;
    var birdHeadY = -33;
    var birdBodyW = 40;
    var birdBodyH = 30;
    var birdBodyX = -35;
    var birdBodyY = -25;
    var birdDisplacement = 12;
   
    //left bird: beak, head, body
    fill(255, 197, 67);
    triangle(birdHeadX - birdDisplacement, birdHeadY + 6, birdHeadX - birdDisplacement, birdHeadY - 6, (birdHeadX - birdDisplacement) - 15, birdHeadY);
    fill('white');
    ellipse(birdHeadX - birdDisplacement, birdHeadY, birdHeadS, birdHeadS);
    arc(birdBodyX - birdDisplacement, birdBodyY, birdBodyW, birdBodyH, PI * 7/4, PI * 3/4);
   
    //right bird: beak, head, body
    fill(255, 197, 67);
    triangle(birdHeadX + birdDisplacement, birdHeadY + 6, birdHeadX + birdDisplacement, birdHeadY - 6, (birdHeadX + birdDisplacement) + 15, birdHeadY - 5);
    fill('white');
    ellipse(birdHeadX + birdDisplacement, birdHeadY, birdHeadS, birdHeadS);
    arc(birdBodyX + birdDisplacement + 20, birdBodyY - 5, birdBodyW, birdBodyW, 0, PI);
    
    //eyes
    fill(6, 73, 112);
    ellipse(birdHeadX - birdDisplacement - 3, birdHeadY - 2, 3, 3);
    ellipse(birdHeadX + birdDisplacement + 3, birdHeadY - 2, 3, 3);
    pop();
}

For this project, I wanted to create something that was fairly simple and geometric, but also playful and fun. I started with some sketches, and developed the idea that I wanted to use a grid of some sort, along with pigeons. When I started to create the wall paper, I ended up deviating from my drawing, and I instead tried to explore different elements. For example, I decided to create generic birds, rather than pigeons, and I ended up rotating the grid, moving the birds, and playing with what they looked like.

Initial sketches before coding

Leave a Reply