Project – 05 – wallpaper

drippyDownload
var size = 60
function setup() {
    createCanvas(420, 470);
    background(220);
    
}

function draw() {
	background (255, 143, 233);
	for (var y = size/2 ; y < height + size/2 ; y += size *2){
		for (var x = size/2; x< width + size / 2 ; x += size *2){
			//stripes
			noStroke();
			fill(93, 146, 245, 30);
            rect(x + 45, 0, width/14, height);
			noStroke();
			//face
			fill(245, 237, 93);
			circle(x, y, size);
			//drips
			ellipse(x, y + size/2, 10, 40);
			circle(x, y + size/2 + 18, 12);
			ellipse(x - size/2 + 8, y + size/2 - 8, 10, 30);
			circle(x - size/2 + 8, y + size/2 + 2, 12);
			ellipse(x + size/2 - 7, y + size/2 - 4, 8, 30);
			circle(x + size/2 - 7, y + size/2 + 6, 10);
			//eyes
			stroke(0);
			line(x-15, y - 15, x-5, y - 5);
			line (x - 15, y - 5, x -5, y - 15);
			line(x+15, y - 15, x+5, y - 5);
			line (x + 15, y - 5, x + 5, y - 15);
			//lightning bolt
			noStroke();
			fill(255, 156, 253);
			quad (x + 50, y + 45, x + 75, y + 45, x + 65, y + 65,
			 x + 45, y + 65);
			quad(x + 65, y + 65,  x + 45, y + 65, x + 60, y + 80,
				x + 75, y + 80);
			triangle(x + 60, y + 80, x + 75, y + 80, x + 55, y + 110)
			//mouth
			if (x == y){
				noFill();
				stroke(0);
				arc(x, y + 20, size/2, size/2, PI, 2*PI); // frown
				fill(93, 146, 245);
				noStroke();
				circle(x - 15, y+3, 5);
				triangle(x - 17.5, y +3, x - 12.5, y+ 3, x - 15, y - 5)
				//text
			    textSize(15);
			    stroke(245, 237, 93);
			    fill(93, 146, 245);
		        text("drippy", x - 20, y + size + 10);

			}else{
				noFill();
				stroke(0);
				arc(x, y, size / 2, size /2, .1*PI, .9 * PI); // smile
			}
		}
	}
	noLoop();
}

I based this design off a doodle that i have been drawing for a while and decided to play with gradients, shapes, and texts to create a textile fabric pattern that I would love to wear.

Leave a Reply