Project 5 – Wallpaper

sketch

function setup() {
    createCanvas(480, 440);
    background(169,201,203);

    //First level of diamond
    var y0 = 0;
    var quaSize = sqrt(1.5)*width/8
    for (var quaCol=0; quaCol<5; quaCol++) {
        var x0 = width/8;
        for (var quaRow=0; quaRow<5; quaRow++) {
            stroke (117,180,208);
            strokeWeight (3);
            noFill();    
            quad (x0, y0, x0-width/8, y0+quaSize, x0, y0+quaSize*2, x0+width/8, y0+quaSize);    
            x0 += width/4;
        }
        y0 += quaSize*2;  
    }

    //Secondary diamond
    var y1 = quaSize/3;
    var quaSize1 = quaSize/3*2;
    for (var quaCol=0; quaCol<5; quaCol++) {
        var x1 = 0;
        for (var quaRow=0; quaRow<5; quaRow++) {
            stroke (208,208,117);
            strokeWeight (5);
            noFill();    
            quad (x1, y1, x1-width/12, y1+quaSize1, x1, y1+quaSize1*2, x1+width/12, y1+quaSize1);    
            x1 += width/4;
        }
        y1 += quaSize*2;  
    }
    
    //Fourth level diamond
    var quaSize4 = quaSize/3*2;
    var y4 = 0 - quaSize4;
    for (var quaCol=0; quaCol<6; quaCol++) {
        var x4 = width/8;
        for (var quaRow=0; quaRow<5; quaRow++) {
            stroke (124,186,112);
            strokeWeight (3);
            quad (x4, y4, x4-width/12, y4+quaSize4, x4, y4+quaSize4*2, x4+width/12, y4+quaSize4);
            x4 += width/6 + width/12;
        }
        y4 += quaSize4*3;
    }

    //Thirdary diamond
    var quaSize2 = quaSize/3;
    var y2 = quaSize2*2;
    for (var quaCol=0; quaCol<5; quaCol++) {
        var x2 = width/12 + width/24;
        for (var quaRow=0; quaRow<5; quaRow++) {
            stroke (230,230,75);
            strokeWeight (3);
            quad (x2, y2, x2-width/24, y2+quaSize2, x2, y2+quaSize2*2, x2+width/24, y2+quaSize2);
            x2 += width/4;
        }
        y2 += quaSize*2;
    }
    var y3 = 0 - quaSize/3;
    for (var quaCol=0; quaCol<5; quaCol++) {
        var x3 = 0;
        for (var quaRow=0; quaRow<5; quaRow++) {
            strokeWeight (4);
            quad (x3, y3, x3-width/24, y3+quaSize2, x3, y3+quaSize2*2, x3+width/24, y3+quaSize2);
            x3 += width/4;
        }
        y3 += quaSize*2;
    }

    

    //Decorated dots
    //vertical ones
    var sizeC = width/64;
    var yC = quaSize - sizeC*2;
    for (var cCol=0; cCol<8; cCol++) {
        var xC = 0;
        for (var cRow=0; cRow<6; cRow++) {
        noStroke();
        fill (124,186,112);
        ellipse (xC, yC, sizeC);
        xC += width/4;
        }
        if (cCol % 2 == 0) {
            yC += sizeC*4;
        } else {
            yC += quaSize*2 - sizeC*4;
        }
    }

    //horizontal ones
    var yC1 = quaSize;
    for (var cCol=0; cCol<8; cCol++) {
        var xC1 = sizeC*2;
        for (var cRow=0; cRow<8; cRow++) {
            ellipse (xC1, yC1, sizeC);
            if (cRow % 2 == 0) {
                xC1 += width/4 - sizeC*4;
            } else {
                xC1 += sizeC*4;
            }
        }
        yC1 += quaSize*2;   
    }
    

    noLoop();
}

function draw() {
}

This wallpaper that I design has a vintage feel. I used yellow green and blue as the swatch. The geometries that I used are circles and diamonds, which are simple but timeless.

Leave a Reply