Month: September 2019

sketch

//Caroline Song
//chsong@andrew.cmu.edu
//Section E
//Project 05 - Wallpaper

var color1; 
var color2;

function setup() {
    createCanvas(600, 600);
    //Defining colors
    color1 = color(159, 233, 255);
    color2 = color(1, 95, 124);
    setGradient(color1, color2);
}


function draw() {
    noFill();
    stroke(255);
    strokeWeight(1);
    for (var y = 0; y <= 12; y++) {
        if (y % 2 == 0) {
            for(var x = 0; x <= width; x += 50) {
                triangle(0 + x, 50+(y*50), 25 + x, 0+(y*50), 50 + x, 50+(y*50));
            }
        }
        else {
            for(var x = 0; x <= width; x += 50) {
                triangle(-25 + x, 100+((y-1)*50), 0 + x, 50+((y-1)*50), 25 + x, 100+((y-1)*50));
            }
        }
    }
}

function setGradient(c1, c2) {
    //Creating blue gradient
    for(var i = 0; i <= height; i++) {
      var x1 = map(i, 0, height, 0, 1);
      var c3 = lerpColor(color1, color2, x1);
      stroke(c3);
      line(0, i, width, i);
    }

}

For this wallpaper, I wanted to play around with colors so that my finished product would resemble something from the ocean or the beach. And so, I created a soft blue gradient. Overlaying that, I made a repeating pattern of triangles in a white color in order to keep the soft color palette I was aiming for.

With this project, I wanted to create a pattern that had a cooking element to it as if the design could be placed on an apron. I choose to use a sunflower yellow color pallette for a pleasant tone. A coffee bean, straw, and cup are present.

sketch

//Yoshi Torralva
//yrt@andrew.cmu.edu
//Section E
//Project-05-Wallpaper 

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

}
function draw() {
    background(0);
    // nested loop for x + y rows
    for (var x = 0; x < width / 3; x+=1) {
        for (var y = 0; y < height / 8; y+=1) {
            // var bay and bax made to adjust function b coordinates
            var bay = y * 100; // adjustment to space squares evenly 
            var bax = x * 200; // adjustment to space squares evenly
            ba(bax, bay);
            // subtracting 50px to create alternating design
            b(bax, bay - 50);
        }
    }
}
// dark yellow background
function ba(x, y) {
    push();
    translate(x, y);
    fill(221, 178, 16);
    noStroke();
    rect(0, 0, 100, 100);
    fill(253, 215, 70);
    ellipse(50, 50, 80, 80);
    fill(221, 178, 16);
    ellipse(50, 50, 70, 70);
    //coffee
    fill(136, 97, 13);
    ellipse(50, 50, 70, 70);
    //straw above mouseIsPressed to appear
    stroke(253, 215, 70);
    strokeWeight(5);
    line(50, 50, 10, 10);
    pop();
}
// coffee bean tile
function b(x,y) {
    push();
    translate(x, y);
    fill(0);
    textSize(32);
    noStroke();
    fill(253, 215, 70);
    rect(100, 0, 100, 100);
    fill(221, 178, 16);
    ellipse(150, 50, 80, 90);
    fill(253, 215, 70);
    rect(140, 0, 20, 100);
    pop();
}

This is my original sketch. I wanted to make a bubbly wallpaper with baby light tones like blue and poink ( didn’t have copics that color). To do this I first created a draw bubbles function that made layers of circles, and then in the draw function I called for loops to make a grid. I decided to add pink lines across the circles to make it more visually interesting and also it now looks like tiles.

sketch

//Alice Cai
//alcai
//week5 Project
//Section E

//pink background
function setup() {
    createCanvas(600,600);
    background('pink')
}

function draw () {
//vertical forloop for y
    for (var y = 25; y <= height; y += 50) {

//horizantal forloop for x
        for (var x = 25; x <= width; x += 50) {

//call drawbubble shape
           drawBubble (x,y);
           
//pink lines over blue bubbles to create tile effect
           strokeWeight(10);
           stroke('pink');
           line(x, y, x, y + x);
           line(x, y, x, y - x);
           line(x, y, x + 30, y);
           line(x - 30, y, x, y);
        }
        
    }   
    noLoop(); 
//so that draw is only called once
}

//bubble shape, x y variable coordinates to be called in for loop
function drawBubble ( x, y) {
            fill(209,242,255);
            strokeWeight(0);
            ellipse(x, y, 50, 50);
        
            fill(100,200,230);
            ellipse(x, y, 35, 35);
        
            fill(118,230,250);
            ellipse(x, y, 20, 20);
        
           
}