Project 5: Wallpaper

sketch

function setup() {
    createCanvas(600, 540);
}

function draw() {
    background(195, 230, 241);

    //steam
    for (var yUp = 85; yUp <= 500; yUp += 127) {
        for (var xUp = 75; xUp <= 600; xUp += 148) {
            steam(xUp, yUp);
        }
}

    //pan
    for (var yYah = 43; yYah <= 450; yYah += 128) {
        for (var xYah = 24; xYah <= 580; xYah += 148) {
            pan(xYah, yYah);
        }
    } 

    //egg
    for (var y = 80; y <= 500; y += 128) {
        for (var x = 47; x <= 550; x += 148) {
            egg(x, y);
        }
    }

    //handle
    for (var yUp = 85; yUp <= 500; yUp += 127) {
        for (var xUp = 94; xUp <= 600; xUp += 148) {
            handle(xUp, yUp);
        }
}
    
function egg(x, y) {
    //whites
    noStroke();
    fill("white")
    circle(x + 3, y, 35)
    circle(x + 8, y + 5, 35)
    circle(x + 2, y + 7, 30)

    //shadow on whites
    //gray
    noStroke();
    fill(215, 215, 215)
    circle(x + 11.5, y + 8.5, 17)
    //white
    fill("white")
    circle(x + 8.5, y + 5.5, 21)

    //yolk shadow
    fill(222, 181, 67)
    circle(x - 2, y - 3, 13)

    //yolk
    noStroke();
    fill(237, 193, 72)
    circle(x -3, y - 3, 11)

    //yolk highlight
    noStroke();
    fill("white")
    circle(x - 4, y - 5, 3)
}

function pan (x, y) {
    //outer
    fill(161, 161, 161)
    circle(x + 30, y + 40, 76.5)

    //inner
    fill(0)
    circle(x + 30, y + 40, 72)

    //most inner
    fill(80, 80, 80)
    circle(x + 30, y + 40, 54)
}

function handle(x, y) {
    push();
    //translate(x,y)
    rectMode(CENTER);
    //rotate(radians(40))
    //handle
    fill(0)
    rect(x + 26, y, 55, 13, 10)
    //connector
    fill(196, 196, 196)
    rect(x, y, 6, 18, 2)
    pop();
    //hole
    fill(195, 230, 241)
    ellipse(x + 42, y, 10, 5)
}
}

function steam(x, y) {
    noStroke();
    //positive space
    fill(245, 250);
    ellipse(x + 5, y - 40, 35, 15)
    ellipse(x - 5, y - 50, 35, 14)
    ellipse(x - 3, y - 59, 30, 10)

    //negative space
    fill(195, 230, 241)
    ellipse(x - 3, y - 39, 28, 10)
    ellipse(x + 6, y - 50.5, 28, 9)
    ellipse(x - 13, y - 60, 28, 8)
}

This project was really fun. The hardest part was understanding what details should be added to make the wallpaper seem more dimensional and dynamic. The process was very additive in that I had to iterate a few times to see what was missing in the wallpaper compositionally.

Leave a Reply