Han Yu Project 05 Wallpaper

``````// Han Yu
// Section D
// hyu1@andrew.cmu.edu
// Project 05

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

function draw() {
background(184,233,230);
// passion fruits
for (var i=50; i<width-10; i+=100) {
for (var j=50; j<width-10; j+=100) {
noStroke();
fill(27,179,111);
ellipse(i, j, 70, 70);
fill(122,196,36);
ellipse(i, j, 60, 60);
fill(234,40,95);
ellipse(i, j, 55, 55);

// seeds
stroke(88,88,90);
strokeWeight(4);
point(i-13,j-3);
point(i+5,j-8);
point(i,j-13);
point(i-10,j+9);
point(i+1,j+10);
point(i+13,j+4)
point(i+1,j+1)
}
}

//eaten parts
for (var y=0; y<7; y+=1) {

if (y%2==0 & y!==0) { // only on even rows
for (var x=0; x<7; x+=1) {
if (x%2==0) { //only on even columns
noStroke();
fill(184,233,230);
rect(x*100+100, y*100-100, 50, 50, 5);
}
}
}
}

noLoop();
}
``````

Watermelon is my favorite fruit. It was fun to make a wallpaper full of watermelons. To add more variations, I covered up some parts of the watermelons on a few locations. Overall, I found this project very helpful for practicing nested loops.

Tanvi Harkare – Project 05 – Wallpaper

``````var posX = 75; //starting position of tile x direction
var posY = 20;// starting position of tile y direction
var iteration = 0; //lets program know whether its odd or even row
var count = 0; //know when to terminate the program with noLoop

function setup() {
createCanvas(600, 450);
background(0, 0, 75);
}

function draw() {
if(iteration === 0){ //even number rows get 4 tiles
for(var s = 0; s < 4; s++){
tile(posX, posY);
posX += 150;
}
iteration++;
}

else if(iteration === 1){ //odd number rows get 3 tiles to provide hexagonal effect
for(var d = 0; d < 3; d++){
tile(posX + 75, posY);
posX += 150;
}
iteration--;
}
posX = 75;
posY += 100;

if(count > 13){
noLoop();
}
}

function tile(x, y){ //new function actually producing the tile with x, y parameters
stroke(220, 219, 214);
strokeWeight(1);
line(x, y, x - 50, y + 50);
line(x - 50, y + 50, x, y + 100);
line(x, y + 100, x + 50, y + 50);
line(x + 50, y + 50, x, y);

line(x, y, x - 40, y + 50);
line(x - 40, y + 50, x, y + 100);
line(x, y + 100, x + 40, y + 50);
line(x + 40, y + 50, x, y);

line(x, y, x - 30, y + 50);
line(x - 30, y + 50, x, y + 100);
line(x, y + 100, x + 30, y + 50);
line(x + 30, y + 50, x, y);

line(x, y, x - 20, y + 50);
line(x - 20, y + 50, x, y + 100);
line(x, y + 100, x + 20, y + 50);
line(x + 20, y + 50, x, y);

line(x, y, x - 10, y + 50);
line(x - 10, y + 50, x, y + 100);
line(x, y + 100, x + 10, y + 50);
line(x + 10, y + 50, x, y);

count++;
}
``````

I was inspired by a simple, modern wall paper to create a singular tile that would be repeated in the hexagonal pattern we learned about in Assignment 5B. I created a new function tile(x, y) with two parameters (starting x location and starting y location) to create a set of tiles on a background.

Miranda Luong-Project-05-Wallpaper

``````/* Miranda Luong
mluong@andrew.cmu.edu
Section E
Project-05
*/

function setup() {
createCanvas(600, 400);
background(80,100,200);
var tw = width/10;
var th = 60;
var oy = 50;
var ox = 33;
//create 6 rows
for (var y = 0; y < 6; y++) {
//for every even row
if (y % 2 == 0){
stroke(40,180,40);
strokeWeight(2);
//creates 5 sets of twin cherries
for (var x = 0; x < 5; x++) {
var py = oy + y * th;
var px = ox + x * (tw*2);
//back cherry
fill(165,40,40)
ellipse(px-8, py, 25);
//front cherry
fill(180,40,40);
ellipse(px+5, py,30)
//connecting stem
noFill();
arc(px+15, py-10, 50, 50, PI, PI+QUARTER_PI);
arc(px+22, py-30, 50, 60, 2.25, 3);
triangle(px-5,py-29,px-1,py-29,px-3,py-27)
}
//for every odd row
} else {
//creates oranges
for (var x = 0; x < 5; x++) {
var py = oy + y * th;
var px = (ox*2.5) + x * tw*2;
stroke(40,170,40);
fill(180,100,40);
ellipse(px, py, 40);
//inside orange pattern
ellipse(px,py,2)
ellipse(px,py-10,1,12);
ellipse(px,py+10,1,12);
ellipse(px-10,py,12,1);
ellipse(px+10,py,12,1);
}
}
}
noLoop();
}

function draw() {
// draw is not called due to noLoop() in setup()
}``````

I referenced Assignment 2 to create the grid for my wallpaper. I think that assignment was a great exercise for understanding spacing. This was the first time I used the arc module. I never usually create shapes in my projects, but I had a lot of fun making this wallpaper. I decided to draw cherries and oranges because they are my favorite fruit. I tried to play around with colors, which is why I utilized such a bright green to contrast the red and orange.

Curran Zhang- Project 05- Wallpaper

``````/*Curran Zhang
curranz
Project 5
Section A
*/

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

function draw() {
background(128);
var rectl = 100;
var rectw = 100;
var oy = rectw/2;
var ox = rectl/2;
var ml = 50;
var mw = 5;

//Applying the gradient on shapes that are fixed
for (var x = 0; x < width; x+=rectl) {
for (var y  = 0; y <height; y+= rectw){
var R = map(x,0,width,100,300);
var B = map(y,0,height,100,200);
var R1 = map(x,0,width,300,100);
var B1 = map(y,0,height,200,100);

fill(R,200,B);
stroke(275);
strokeWeight(.4);
rect(x,y,rectl,rectw);

fill(R1,200,B1);
noStroke();
ellipse(x+rectl/2+6,y+rectw/2+4,50,50);
}
}
//Creating variations in color based using the grid
for (var x = 0; x < 6; x++) {
for (var y = 0; y < 6; y++) {
var py = oy + y * rectl;
var px = ox + x * rectw;

fill('red');
if (y % 2 == 0)
{if (x % 2 == 0){fill('green')}
};
if (y % 2 != 0)
{if (x % 2 != 0){fill('purple')}
};
noStroke();
ellipse(px,py-1.5,50,50);

fill(220);
noStroke();
arc(px,py,50.8,50.8,0,PI);

fill(0);
ellipse(px,py+.5,17,17);
rect(px-ml/2, py-mw/2+1,ml,mw);

fill(275)
stroke(0);
strokeWeight(1);
ellipse(px,py,12,12);
ellipse(px,py,7,7);
}
}
}
``````

With the topic of wallpaper, my childhood self use to want my room to be filled with things from the Pokemon games. Thus for the project I decided to create a wallpaper that related to Pokemon. With the usage of PokeBalls, they vary in colors and design. Through for loops and if statements, i was able to vary the different colors within the array.

Retro Wallpaper

I was inspired by 1970’s themes and a retro color scheme. This project was fun to make as it built off past labs and I was easily able to manipulate the primitives to create a modernist feeling wallpaper design. However, the colors were somewhat odd to use so I had to experiment a little before arriving at a scheme I was happy with.

``````//Sean McGadden
//Section C @ 1:30
//Project-05

var r = (200);
var g = (200);
var sizeOfCircle = 15

function setup(){
createCanvas(600,400);
noLoop();
}

function draw() {
background(0);

var numOfCirclesVertically = height / sizeOfCircle
var numOfCirclesHorizontally = width / sizeOfCircle
//Creating for Loop Circles in Y Direction
for(var y=0; y < numOfCirclesVertically; y += 1){
//Creating for Lopp Circlesin X Direction
for(var x = 0; x < numOfCirclesHorizontally; x ++){
//Modulus to create layered shapes
fill(r,g,0);
if (x % 5 == 0 &
y % 5 ==0) {

rect(sizeOfCircle*x, sizeOfCircle * y, x + sizeOfCircle * 5, y + sizeOfCircle * 5);

}
ellipse(sizeOfCircle/2 + sizeOfCircle*x, sizeOfCircle/2 + sizeOfCircle*y, sizeOfCircle, sizeOfCircle);

print("x is"+x);
}
}
//Creating the Sqaures
for(var y=0; y < numOfCirclesVertically; y += 1){
//        r = 255/numOfCirclesVertically*y;
for(var x = 0; x < numOfCirclesHorizontally; x ++){
if (x % 5 == 0 &
y % 5 ==0) {
fill(168, 255, 253);
//Creating Circles on top of Squares
rect(sizeOfCircle*x + 10, sizeOfCircle * y + 10, sizeOfCircle * 5 - 20, sizeOfCircle * 5 - 20);
fill(255, 204, 100);
ellipse(sizeOfCircle/2 + sizeOfCircle*(x+2), sizeOfCircle/2 + sizeOfCircle*(y+2), sizeOfCircle*3, sizeOfCircle*3);
}
}
}
}``````

Jonathan Liang – Project 5 – Wallpaper

``````//Jonathan Liang
//jliang2
//Section A

x1 = 90;
y1 = 60;
x2 = 30;
y2 = 120;

function setup() {
createCanvas(480, 400);
noStroke();

}

function draw() {
background(102, 179, 255);
for (var x1 = 90; x1 < width; x1 += 200) {
for (var y1 = 60; y1 < height; y1 += 120) {
cloud1(x1, y1);
}
}

for (var x2 = 30; x2 < width; x2 += 175) {
for (var y2 = 120; y2 < height; y2 += 120) {
cloud2(x2, y2);
}
}
man();
noLoop();
}

function cloud1(x1,y1) {
noStroke();
fill('white');
rect(x1, y1, 85, 10, 20);
ellipse(x1 + 30, y1 - 5, 25, 20);
ellipse(x1 + 55, y1 - 10, 45, 35);
ellipse(x1 + 45, y1 - 25, 40, 40);

}

function cloud2(x2,y2) {
noStroke();
fill('white');
rect(x2, y2, 50, 8, 20);
ellipse(x2 + 20, y2 - 5, 18, 15);
ellipse(x2 + 35, y2 - 10, 25, 25);

}

function man() {
push();
noFill();
strokeWeight(5);
stroke('red');
ellipse(250, 250, 100, 90); //head
strokeWeight(3);
ellipse(250, 250, 30, 20); //nose
arc(225, 250, 20, 20, 0, HALF_PI + QUARTER_PI); //cheek
arc(275, 250, 20, 20, 0, PI + QUARTER_PI); //cheek
ellipse(240, 230, 10, 15); //left eye
ellipse(260, 230, 10, 15); //right eye
arc(250, 260, 50, 30, 0, PI); //mouth
pop();

}

``````

When I was young I loved drawing on walls, so no matter what the wallpaper was I would draw something on it. My favorite wallpaper when I was younger was Andy’s wallpaper in Toy Story. So this wallpaper pattern with clouds is something that has resonated with me since childhood. Nevertheless, I would have still doodled on the walls anyway.

Project 5 – Wallpaper Sara Frankel

``````// Sara Frankel
// sfrankel
// Project 5
// section A

function setup() {
createCanvas(600, 600);
background('lightgreen');

stroke('green');
strokeWeight(2);
for (var xback = 10; xback < width; xback += 20) { //green stripes placed in setup so that they are not redrawn everytime it is called
line(xback, 0, xback, height);
}
noLoop();
}

function draw() {
stroke(0);
strokeWeight(1);
var diameter = 120;
for (var xcircle = 0; xcircle < width + diameter/2; xcircle += 155) { // positions and redraws the lemons and limes along the x axis
for (var ycircle = 0; ycircle < height + diameter/2; ycircle += 155){ // positions and redraws the lemons and limes along the y axis
fill('orange');
ellipse(xcircle, ycircle, diameter, diameter);
fill(243,185,80);
ellipse(xcircle, ycircle, diameter/2 + 40, diameter/2 + 40);

if(ycircle % 2 === 0) { //makes every odd line, every lemon, the color yellow
fill(255,255,153);
ellipse(xcircle, ycircle, diameter, diameter);
fill('yellow');
ellipse(xcircle, ycircle, diameter/2 + 40, diameter/2 + 40);
}

for (var i = 0; i < 6; i++) { //forms the slices of the citrus fruit
var angle = i * radians(60);
line(xcircle, ycircle, (diameter/3) * cos(angle) + xcircle ,
ycircle + (diameter/3) * sin(angle));
}

}
}
}
``````

For this project, I decided to make it citrus/summer theme. I made the backdrop watermelon inspired (with the green stripes) and made each row of citrus fruit alternate between oranges and lemons. As the weather gets colder, its sometimes nice to think of the beloved themes of summer.  Below is my sketch, please excuse my artistic ability but I came into the idea thinking about summer and warm beaches (and what is lovely to drink/eat by the ocean).

Romi Jin – Project-05-Wallpaper

`````` /*
Romi Jin
Section B
rsjin@andrew.cmu.edu
Project-05
*/

//var x = 0;
//var y = 0;

var faceWidth = 40;
var earWidth = 15;
var earHeight = 40;
var bodyWidth = 40;
var bodyHeight = 60;
var tailWidth = 20;
var body2w = 50;
var body2h = 40;
var eyew = 3;
var eyeh = 5.5;
var nosew = 6;
var noseh = 5;

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

}

function draw() {
background(252,236,235);
bunny();

for (var x = 35; x < width-35; x += 75) {
for (var y = 135; y < height; y += 150) {
bunny(x,y);
}
}

noLoop();
}

function bunny(x,y) {

//left ear
stroke(128,128,128);
strokeWeight(.2);
fill(255);
ellipse(x,y-100,earWidth,earHeight);

//right ear
stroke(128,128,128);
strokeWeight(.2);
fill(255);
ellipse(x-10,y-95,earWidth,earHeight);

//body
stroke(128,128,128);
strokeWeight(.2);
fill(255);
ellipse(x,y-30,body2w,body2h/2);

stroke(128,128,128);
strokeWeight(.2);
fill(255);
ellipse(x,y-40,bodyWidth,bodyHeight);

//tail
stroke(128,128,128);
strokeWeight(.2);
fill(255);
ellipse(x-10,y-15,tailWidth,tailWidth);

//face
stroke(128,128,128);
strokeWeight(.2);
fill(255);
ellipse(x,y-75,faceWidth,faceWidth);

//eye
noStroke();
fill(0);
ellipse(x-10,y-80,eyew,eyeh);

//nose
noStroke();
fill(237,171,166);
ellipse(x+14,y-75,nosew,noseh);

}``````

For this project, I wanted to make a simple wallpaper of bunnies! I discovered that this project was easier than I thought it would be. I simply made a new function called “bunny” and placed all the features of the bunny in it, then referenced that function in the for loop (in the draw function).

Eunice Choe – Project-05 – Wallpaper

``````/* Eunice Choe
Section E
ejchoe@andrew.cmu.edu
Project-05
*/

function setup() {
createCanvas(480, 480);
background(116, 124, 181);
var ws = 80; // width spacing
var hs = 50; // height spacing

for (var y = 0; y < 11; y++) {
for (var x = 0; x < 7; x++) {
if (y % 2 == 1){ // even rows with coffee beans
var py = y * hs;
var px = (ws / 2) + x * ws; // offset shift to the right by half of width spacing
stroke(76, 44, 15);
ellipse(px, py, 10, 5);
ellipse(px + 10, py + 5, 5, 10)
ellipse(px, py + 10, 5, 10);

}
else { // odd rows with coffee mugs
var py = y * hs;
var px = x * ws;
// cream colored mug shape
noStroke();
fill(255, 242, 196);
arc(px, py, 60, 80, 0, PI, CHORD);
arc(px + 20, py + 15, 30, 20, 10, HALF_PI);
// brown mug outline
stroke(178, 154, 119);
strokeWeight(4);
noFill();
arc(px - 8, py, 60, 80, 0, PI, CHORD);
// zig zag steam lines
stroke(255);
strokeWeight(3);
line(px - 20, py - 10, px + 15, py - 12);
line(px + 15, py - 12, px - 15, py - 16);
line(px - 15, py - 16, px + 10, py - 20);
line(px + 10, py - 20, px - 5, py - 30);
}
}
}
noLoop();
}
``````

For my wallpaper project, I decided to created a pattern that alternated coffee mugs and coffee beans. I was inspired to create the mug pattern after seeing a wallpaper online. With the repeating pattern, I was interested in seeing how the mugs and coffee beans turned somewhat abstract over time. I originally did not intend to abstract the mugs, but I actually like how they look in the final result! I like the idea of someone looking twice at the wallpaper before realizing what the pattern is. Overall, this project was good practice for using nested for loops.

Jessica Timczyk – Project 05 – Wall Paper

``````// Jessica Timczyk
// Section D
// jtimczyk@andrew.cmu.edu
// Project-05-Wall Paper

var SIZE = 10;

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

function draw() {
background(185, 248, 252); // light blue between cirlces
drawGrid();
noLoop();
}

function drawGrid() {

// small squares covering background
for (var y = SIZE / 2; y < height + SIZE / 2; y += SIZE) {
for (var x = SIZE / 2; x < width +SIZE / 2; x += SIZE) {
ellipse(x, y, SIZE, SIZE);
}
}
// diagonal stripes
for ( var i = 0; i <= 150; i ++) {
x1 = i * 70;
y1 = i * 70;
strokeWeight(20);
stroke(255, 235, 14)
line(width + 300, x1 + 100, 0, y1 - 600);
}
// loop to repeatedly draw squiggle shape
for (var x = 20; x <= width + 60; x += 50) {
for ( var y = 0; y <= height + 80; y += 60) {
fill(0);
stroke(255);
strokeWeight(3);
beginShape(); // squiggle shape
vertex(x - 25, y - 5);
bezierVertex(x - 50, y , x - 45, y + 65, x + 5, y + 25);
bezierVertex(x - 10, y + 40, x - 30, y + 115, x - 25, y - 5);
endShape();
}
}
}

``````

This wall paper did not turn out how I originally intended it to. I had imagined making a sort of night sky mural but along the way I had gotten distracted by drawing many circles as apposed to a few to make stars. Spiraling off of that I eventually morphed what was a moon shape into the weird squiggly shape and built off of it from there. Although it didn’t turn out how I had originally intended, I very much like how the pattern turned out and I find it very  visually interesting and now reminds me slightly of candy stripes

.