Month: October 2021

LO 05: Man Mask

LO 5

Man Mask

By Rachel Rossin

“Man Mask” is a VR piece by Rachel Rossin in which the viewer inhabits (literally is placed inside) a call of duty avatar. The piece takes the viewer on “a guided meditation through landscapes taken from the game Call of Duty: Black Ops, drained of violence and transformed into an ethereal dream world”. I think that the idea of taking assets and environments from a video game and recontextualizing them for a completely different effect is pretty interesting. It allows for commentary on the particular piece of media, but also the freedom to depart from it. This piece was created in part as a reaction to the artist’s own experience playing first person shooters and taking on a male avatar online in search for neutrality. I also think it is interesting how it places the viewer visibly inside the avatar, so you are more immersed in the character than in a third person view, but not really looking through the character’s eyes, rather from behind them.

http://rossin.co/

clip from installation

Wallpaper Project

sketchDownload

/*
Yanina Shavialenka
Section B
yshavial@andrew.cmu.edu
Project 5: Wallpaper
*/

var x = 100;
var y = 45;
var s = 8;

var xS1 = 193;
var yS1 = 60;
var xS2 = 193;
var yS2 = 115;


function setup() {
  createCanvas(600, 600);
  background(0, 0, 51);
  text("p5.js vers 0.9.0 test.", 10, 15);
} 

function draw() { 
    background(0, 0, 51);
    
    //Hexagonal background
    for(var xH = 0; xH <= 600; xH += 15){
        for (var yH = 0; yH <= 600; yH += 2*s*sqrt(3)/2){
            fill(0, 0, 51);
            hexagon(xH, yH);
        }
    }
    for (var xH = 10; xH <= 600; xH += 15){
        for (var yH = s*sqrt(3)/2; yH <= 600; yH += 2*s*sqrt(3)/2){
            fill(0, 0, 95)
            hexagon(xH, yH);
        }
    }


    //Solar Systems
    for(x = 100; x <= width; x += 200){
        for(y = 85; y <=height; y += 300){
            solarSystem();
        }
    }
    for(x = 0; x <= width; x += 200){
        for(y = 235; y <= height; y += 300){
            solarSystem();
        }
    }

    //Yellow Stars
    for(xS1 = -7; xS1 <= width; xS1 += 200){
        for(yS1 = 45; yS1 <=height; yS1 += 300){
            star();
        }
    }
    for(xS1 = 93; xS1 <= width; xS1 += 200){
        for(yS1 = 195; yS1 <= height; yS1 += 300){
            star();
        }
    }

    //Pink Stars
     for(xS2 = -7; xS2 <= width; xS2 += 200){
        for(yS2 = 115; yS2 <=height; yS2 += 300){
            star();
        }
    }
    for(xS2 = 93; xS2 <= width; xS2 += 200){
        for(yS2 = 265; yS2 <= height; yS2 += 300){
            star();
        }
    }
}

function star() {
    /*
    This function draws yellow and pink stars.
    The star is made out of a square in the middle and 4
    triangles that surround that square.
    */

    //Yellow Star
    noStroke();
    fill(255, 255, 102);
    rect(xS1, yS1, 13, 13);
    triangle(xS1, yS1, xS1+6.5, yS1-13, xS1+13, yS1);
    triangle(xS1, yS1, xS1-13, yS1+6.5, xS1, yS1+13);
    triangle(xS1, yS1+13, xS1+6.5, yS1+26, xS1+13, yS1+13);
    triangle(xS1+13, yS1, xS1+26, yS1+6.5, xS1+13, yS1+13);

    //Pink Star
    noStroke();
    fill(255, 178, 153);
    rect(xS2, yS2, 13, 13);
    triangle(xS2, yS2, xS2+6.5, yS2-13, xS2+13, yS2);
    triangle(xS2, yS2, xS2-13, yS2+6.5, xS2, yS2+13);
    triangle(xS2, yS2+13, xS2+6.5, yS2+26, xS2+13, yS2+13);
    triangle(xS2+13, yS2, xS2+26, yS2+6.5, xS2+13, yS2+13);
}

function solarSystem() {
    /*
    This function draws Solar System with sun in the middle
    and planets rotating around the sun on their orbits.
    */
    
    //Orbits
    stroke(255);
    fill(0, 0, 0, 0);
    ellipse(x, y, 25, 25);
    ellipse(x, y, 45, 45);
    ellipse(x, y, 65, 65);

    push();
    strokeWeight(3);
    stroke(180);
    ellipse(x, y, 85, 85);
    pop();
    ellipse(x, y, 105, 105);

    ellipse(x, y, 125, 125);
    ellipse(x, y, 145, 145);
    ellipse(x, y, 165, 165);


    //Sun
    noStroke();
    fill(255, 255, 0);
    ellipse(x, y, 12, 12);

    //Venus
    noStroke();
    fill(160, 160, 160);
    ellipse(x+8, y+10, 8, 8);

    //Earth
    noStroke();
    fill(0, 102, 204);
    ellipse(x+10, y-20, 13, 13);
    fill(0,220,0);
    ellipse(x+11, y-22, 8, 4);
    ellipse(x+11, y-17, 4, 2.5);
    ellipse(x+7, y-19, 5, 2);

    //Mars
    noStroke();
    fill(204, 65, 0);
    ellipse(x-30, y-10, 12, 12);

    //Jupiter
    noStroke();
    fill(255, 155, 0);
    ellipse(x+40, y+35, 18, 18);
    stroke(195, 0, 0);
    line(x+35, y+28, x+48, y+34);
    stroke(205, 50, 0);
    line(x+32, y+33, x+46, y+40);

    //Saturn
    stroke(255);
    fill(0, 0, 0, 0);
    ellipse(x+37, y-50, 30, 9);
    noStroke();
    fill(190, 190, 190);
    ellipse(x+37, y-50, 16.5, 16.5);

    //Uranus
    noStroke();
    fill(153, 204, 255);
    ellipse(x-53, y+50, 15, 15);

    //Neptune
    noStroke();
    fill(10, 76, 153);
    ellipse(x-45, y-70, 15, 15);
}


function hexagon(xH,yH){
    /*
    This function draws one hexagon with a side of 8 pixels 
    that is made out of 8 triangles.
    */
    push();
    translate(xH,yH)
    noStroke();
    triangle(0,0,-s,0,-s/2,-s*sqrt(3)/2)
    triangle(0,0,-s/2,-s*sqrt(3)/2,s/2,-s*sqrt(3)/2)
    triangle(0,0,s,0,s/2,-s*sqrt(3)/2)
    triangle(0,0,-s,0,-s/2,s*sqrt(3)/2)
    triangle(0,0,-s/2,s*sqrt(3)/2,s/2,s*sqrt(3)/2)
    triangle(0,0,s,0,s/2,s*sqrt(3)/2)
    pop();
}

|

This project was very interesting in the fact that I get to design whatever I want which also made this project hard as if it was hard to stop on one idea only. I came up with the idea of Solar system with planets surrounding a sun in the middle. All of the systems are identical and are separated by yellow and pink stars.

LO 5: 3D Computer Graphics

For this Week’s Looking Outwards, I will talk Romain Lemaire’s Color Project – Blue 01 Oily Paint Stroke (Early 2021).

Lemaire is a French “Freelance Material Artist” – as per his ArtStation Profile. He created this artwork as he sees his ability to work with color as a weakness. Hence, by working more with color, he will improve his abilities.

The Work itself was made using rendering techniques from what I could find. As for guesses on what algorithms were used, I would say ones that depend on where the strokes of the mouse are. I admit I am unknowledgeable of the process of creating 3D art other than the common terms like “rendering” that are used.

Other than that, I like the Work because of how different it is from everything else I saw. When Professor Cortina told us not to do Video Games, I was kind of dreading writing this LO up. That dread increased as I was trying to find 3d Computer Graphic Artwork that was not Video Game related. I originally used google images, but after clicking on one of the links for this Week LO’s writeup, I began searching on ArtStation instead. After searching the tags of #Digital 3D and #Abstract, I found Lemaire’s Work.


Besides the Work’s originality, I liked how warm it made me feel and a weird sort of peace that it instilled. Finally, it just looks good in all honesty – which I know I say for all of my LOs.


Here is the links to this Work, his ArtStation Profile, and his ArtStation Blog.

Project 05 Wallpaper

sketch

//Tim Nelson-Pyne
//tnelsonp@andrew.cmu.edu
//Section C
//Project-05-Wallpaper


//controls the spacing of the pattern
var cellSize;
//controls the width of the eyes
var eyeWidth;
//controls the height of the eyes
var eyeHeight;
//controls the x position of the patten elements
var x;
//controls the y position of the pattern elements
var y;

function setup() {
    createCanvas(600, 600);
    background(255);
    cellSize = width / 4
}


//tileA draws everything to do with the eyes

function tileA(x, y, cellSize) {

    eyeHeight = cellSize / 7;
    eyeWidth = cellSize / 4;

    //clown makeup
    
    stroke(248, 24, 148);
    fill(255, 204, 239);
    strokeWeight(4);
    bezier(x + eyeWidth / 4, y + eyeHeight + 5, x, y + eyeHeight + 5, x, y + eyeHeight + 5, x, y + cellSize / 2 - 10);
    bezier(x - eyeWidth / 4, y + eyeHeight + 5, x, y + eyeHeight + 5, x, y + eyeHeight + 5, x, y + cellSize / 2 - 10);
    bezier(x + eyeWidth / 4, y - eyeHeight - 5, x, y - eyeHeight - 5, x, y - eyeHeight - 5, x, y - cellSize / 2 + 10);
    bezier(x - eyeWidth / 4, y - eyeHeight - 5, x, y - eyeHeight - 5, x, y - eyeHeight - 5, x, y - cellSize / 2 + 10);
    //eye shadow
    for (i = 0; i < 20; i += 1) {
        noFill();
        strokeWeight(.5);
        stroke(248, map(i, 0, 20, 24, 255), map(i, 0, 20, 148, 255));
        ellipse(x, y, eyeWidth + i, eyeHeight + i);
    }

    // eye
    fill(255);
    strokeWeight(3);
    stroke(245, 230, 0);
    ellipse(x, y, eyeWidth, eyeHeight);
    fill(0, 0, 255);
    ellipse(x, y, 20, eyeHeight);
    fill(255);
    noStroke();
    arc(x, y, 20, eyeHeight, radians(220), radians(250))

}

//tileB draws the mouth
function tileB(x, y, cellSize) {
    noFill();
    strokeWeight(5);
    stroke(248, 24, 148);
    arc(x, y, cellSize / 3, cellSize / 10 + 10, radians(0), radians(180));
    arc(x, y, cellSize / 3, cellSize / 10, radians(0), radians(180));
}

//tileC draws the nose
function tileC(x, y, cellSize) {
    fill(248, 24, 148);
    noStroke();
    ellipse(x, y - cellSize / 4, cellSize / 4, cellSize / 4);
    fill(255, 204, 239);
    ellipse(x, y - cellSize / 4, cellSize / 5, cellSize / 5);
}

function draw() {
    for (x = cellSize / 2; x < width; x += cellSize){
        for (y = cellSize / 2; y < height; y += cellSize){
            tileA(x, y, cellSize);
        }
    }
    for (x = cellSize; x < width; x += cellSize){
        for (y = cellSize; y < height; y += cellSize){
            tileB(x, y, cellSize);
            tileC(x, y, cellSize);

        }
    }
    noLoop();

}

I made a clown face wallpaper. The walls have eyes, and they’re clowning you.

Project-05: Wallpaper

My Work

//cbtruong;
//Section B;

function setup() {
    createCanvas(600, 600);
    //cream background color that goes with the wallpaper-esque idea;
    background(248, 241, 196);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
    background(248, 241, 196);
    //two for loops to draw repeated versions of pattern 1;
    //inner loop is the x coordinate while the outer is the y coordinate;
    //both i and j are initialized as width/height /4 to allow for centering;
    for (var j = height/4; j < height*2; j += 300){
        for (var i = width/4; i < width*2; i += 300){
            pattern1(i, j);
        }
    }
    //two for loops to draw repeated versions of pattern 2;
    //inner loop is the x coordinate while the outer is the y coordinate;
    //both l and m are intialized as width/height /2 to allow for centering;
    //between pattern 1;
    for (var m = height/2; m < height*2; m += 300){
        for (var l = width/2; l < width*2; l += 300){
            pattern2(l, m);
        }

    }
}


function pattern1 (x, y) {
    //scaled it down by 0.5 by encasing;
    //the entire pattern in a push/pop;
    push();

    scale(0.5);
    strokeWeight(1);
    noFill();
    //connecting lines;
    line(x, y, x - 50, y);
    line(x, y, x + 50, y);
    curve(x + 50, y, x - 50, y, x - 50, y - 50, x + 50 , y);
    curve(x - 50, y, x + 50, y, x + 50, y + 50, x - 50, y);
    //white circle;
    fill(255);
    circle(x, y, 15);
    //muted blue color rectangle;
    fill(92, 143, 191);
    rect(x - 50, y - 70, 20, 40);
    //muted red color rectangle;
    fill(182, 30, 40);
    rect(x + 30, y + 30, 20, 40);
    //reddish lines;
    fill(196, 59, 62);
    strokeWeight(4);
    line(x - 40, y - 10, x - 5, y - 40);
    line(x - 35, y - 5, x, y - 35);
    line(x + 5, y + 40, x + 40, y + 10);
    line(x, y + 35, x + 35, y + 5);
    //muted green triangles;
    strokeWeight(1);
    fill(62, 167, 32);
    triangle(x + 45, y + 50, x + 25, y + 70, x - 15, y + 60);
    triangle(x - 45, y - 50, x - 25, y - 70, x + 15, y - 60);
    //second set of connecting lines;
    line(x, y, y - 40, y + 40);
    line(x, y, y + 40, y - 40);
    noFill();
    curve(x, y, x - 40, y + 40, x - 50, y, x, y);
    curve(x, y, x + 40, y - 40, x + 50, y, x, y);
    //yellow ellipse tilted using push/pop;
    push();
    translate(x - 30, y + 50);
    rotate(radians(45));
    fill(217, 227, 10);
    ellipse(0, 0, 20, 50);
    pop();
    //orange ellipse tilted using push/pop;
    push();
    translate(x + 30, y - 50);
    rotate(radians(45));
    fill(226, 160, 29);
    ellipse(0, 0, 20, 50);
    pop();

    pop();
    noLoop();
}

function pattern2 (x, y){
    //scaled it down by 0.5 as well;
    //also encased it in a push/pop to allow scaling;
    push();
    scale(0.5);

    //draws aquamarine rectangle;
    fill(69, 166, 159);
    rectMode(CENTER);
    rect(x, y, 30, 30);
    //draws connecting lines;
    line(x - 20, y + 15, x - 35, y + 35);
    line(x + 20, y - 15, x + 35, y - 35);
    line(x + 35, y - 35, x - 15, y - 35);
    line(x - 35, y + 35, x + 15, y + 35);
    line(x - 20, y + 15, x - 20, y - 15);
    line(x + 20, y - 15, x + 20, y + 15);
    //draws muted pink circles;
    fill(153, 139, 102);
    circle(x - 35, y - 35, 40);
    circle(x + 35, y + 35, 40);
    //draws muted reddish triangles;
    fill(196, 59, 62);
    triangle(x - 20, y - 15, x - 30, y + 20, x - 60, y);
    triangle(x + 20, y + 15, x + 30, y - 20, x + 60, y);
    //draws tilted muted yellow rectangles;
    fill(187, 164, 91);
    push();
    translate(x - 10, y + 40);
    rotate(radians(315));
    rect(0, 0, 20, 30);
    pop();
    push();
    translate(x + 10, y - 40);
    rotate(radians(315));
    rect(0, 0, 20, 30);
    pop();

    pop();
}

I based it off of the early 20th Century Russian Art Movement known as Suprematism. I had the most fun so far creating this Program. Overall, it is very simple in terms of its creation. I just used pre-defined shapes and muted colors. I also used push/pop transformations to angle somethings and to make the main two patterns fit better on the 600×600 canvas.

Project 5: Wallpaper

var s = 50;
function hexagon(xCenter,yCenter,color,col) {

    var canvas = document.getElementById('hexagons');
    var ctx = canvas.getContext('2d');
    
    ctx.beginPath();

    ctx.moveTo(xCenter - s, yCenter);
    ctx.lineTo(xCenter - (s/2), yCenter - s*Math.sqrt(3)/2);
    ctx.lineTo(xCenter + (s/2), yCenter - s*Math.sqrt(3)/2);
    ctx.lineTo(xCenter + s, yCenter);
    ctx.lineTo(xCenter + (s/2), yCenter + s*Math.sqrt(3)/2);
    ctx.lineTo(xCenter - (s/2), yCenter + s*Math.sqrt(3)/2);
    ctx.lineTo(xCenter - s, yCenter);

    ctx.closePath();
    ctx.stroke();
    if (col) {
        if (color % 3 == 1) {
            ctx.fillStyle = '#f00';
        } else if (color % 3 == 2) {
            ctx.fillStyle = '#0f0';
        } else {
            ctx.fillStyle = '#00f';
        }
    } else {
        if (color % 3 == 1) {
            ctx.fillStyle = '#00f';
        } else if (color % 3 == 2) {
            ctx.fillStyle = '#f00';
        } else {
            ctx.fillStyle = '#0f0';
        }
    }
    
    ctx.fill();
}

function draw() {

    var above = true;
    for (var i = 1; i <= 6; i++) {

        for (var j = 1; j <= 5; j++) {
            hexagon(150 * j - 100, (25 * Math.sqrt(3) * 2 * i),i,true);
        }
        
    }

    for (var i = 1; i <= 5; i++) {

        for (var j = 1; j <= 4; j++) {

        hexagon(150 * j - 25,(25 * Math.sqrt(3) * 2 * i) + 25 * Math.sqrt(3),i,false);
        }
    }

}
draw();

LO #5

“Unexpected Growth” is an augmented reality installation by Tamiko Thiel in 2018 and part of Whitney Museum’s exhibition “Programmed: Rules, Codes, and Choreographies in Art, 1965-2018.” Viewers were able to experience the installation directly through their smartphones on the Whitney Museum’s terrace. After opening the video, viewers can walk through the balcony and see it crawling with unchartered growths and plants that create an oceanic alternative to the New York high rise. I find most interesting how the futuristic, fictional visuals essentially occupies and invades the viewer’s very physical location, which to some degree closes the typical perception gap between such type of futuristic art and the viewer. Personally this digital installation epitomizes the title of the class for it is enabled by technology to bridge reality and another space, in this case the artist’s creation of a submerged New York in some undated future, into coexisting as one dimension. It allows a degree of inclusion and interaction for viewers that is not usually provided by more traditional art mediums.

Project 5: Wallpaper

sketch-wall

var x = 5
var y = 5
var w = 5
var h = 20
var dx = 8

function setup() {
    createCanvas(500, 500);
    background(220);
}

function draw() {
    for (hirow = 0; hirow < 5; hirow += 1) { // higher rows
        x = 5 + hirow*130
        for (hicol = 0; hicol < 5; hicol += 1) { // higher columns
            squiggle();
            y = 5 + hicol*154
        }
    }
    for (lorow = 0; lorow < 5; lorow += 1) { // lower rows
        x = 53 + lorow*130
        for (locol = 0; locol < 5; locol += 1) { // lower columns
            squiggle();
            y = 100 + locol*154
        }
    }
}

function squiggle() { // diamond of arcs w/ ellipses 
    noFill();
    strokeWeight(1);
    stroke(107, 70, 27);
    for (arccount = 0; arccount < 7; arccount += 1) {
        y += 3
        arc(x + arccount*dx, y, w, h, 3*PI/2, PI/2);
        arc(x + arccount*dx, y+h, w, h, -3*PI/2, -PI/2);
        arc(x + arccount*dx, y+2*h, w, h, 3*PI/2, PI/2);
        arc(x + arccount*dx, y+3*h, w, h, -3*PI/2, -PI/2);
    }
    ellipse(x + 7*dx, y+h, 11, 15);
    ellipse(x + 7*dx, y+3*h, 11, 15)
}

For my wallpaper, I drew inspiration from this design circa 1805. I thought the handmade recurring pattern, most likely created through block printing, would be fun to convert to a digital format. While I took the diamond shape from the original design, I opted for a more minimalist approach that didn’t need to align exactly to be visually interesting.

LO 5: 3D Computer Graphics

The piece of 3D Computer Graphics I’m studying this week is widely regarded as one of the best early works of CGI to date. The creation of the dinosaurs in Jurassic Park (1993) is an interesting endeavor and product for multiple reasons. First, as a dramaturgy major, I view movie visuals in terms of how they relate to the plot. In the case of Jurassic Park, the realistic appearance of the dinosaurs was paramount to the success of the movie. Second, the technical skill was unparalleled at the time. To give the dinosaurs the appearance of real weight and depth, the movie used a combination of animatronics and CGI. The computer generated work focused on texture and light to give a realistic 3D effect.

Project 5: Wallpaper

kstargio proj 05Download
// Katherine Stargiotti, kstargio, B

function setup() {
    createCanvas(600, 400);
    background(235, 220, 230);
}

//draws a randomized flower-covered wallpaper with vines and leaves. 
//color, placement, flower style, size, and rotation are all randomized to 
//produce a completely new wallpaper each time the program runs:
function draw() {
	for (l=random(25); l<width; l+=50) {		//vines go accross the entire canvas
	    drawVine(l, random(20));				//each vine is drawn before the flowers
	    for (d=0; d<2; d+=1) {	            	// density of the flowers
	        for (h=random(45); h<height+25; h+=random(45,75)) {		//parameters randomized to create variability throughout the piece
		        drawFlowerHead(l+random(-5, 5), h, random(.35, 1.25), int(random(4, 7)), int(random(3)));
	        } 
        }
    }
}

//draws a vine; random() used to add variation for weight, color, curve.
function drawVine(x, y) {
    push();
    translate(x, y);
	vineColor = color(random(100, 150), random(150,200), random(100,150));
	stroke(vineColor);
	strokeWeight(random(1,2));
	noFill();
	den = random(10, 20)			
	beginShape();
	    curveVertex(0, -20);
	    curveVertex(0, -20);
	    curveVertex(3, height/den);
	    curveVertex(0, 2*height/den);
	    curveVertex(-3, 3*height/den);
	    curveVertex(0, 4*height/den);
	    curveVertex(3, 5*height/den);
	    curveVertex(0, 6*height/den);
	    curveVertex(-3, 7*height/den);
	    curveVertex(0, 8*height/den);
	    curveVertex(3, 9*height/den);
	    curveVertex(0, 10*height/den);
	    curveVertex(-3, 11*height/den);
	    curveVertex(0, 12*height/den);
	    curveVertex(3, 13*height/den);
	    curveVertex(0, 14*height/den);
	    curveVertex(-3, 15*height/den);
	    curveVertex(0, 16*height/den);
	    curveVertex(3, 17*height/den);
	    curveVertex(0, 18*height/den);
	    curveVertex(-3, 19*height/den);
	    curveVertex(0, height);
	    curveVertex(0, height);
	endShape();
	drawLeaves(0, vineColor);
	pop();
}

//draws leaves onto a vine using the vineColor and x placement:
function drawLeaves(x, vineColor) {
	fill(vineColor);
	for (f=0; f<height; f+=random(45, 65)) {
		drawLeaf(x, f);
	}
}

//draws one leaf of random size at point x,y:
function drawLeaf(x, y) {
	let leafSize = random(1, 3);
	x += random(-.5, .5);
	//if the leaf is to the left of the vine it faces left; to the right is pointed right:
	if (x>0) {
		beginShape();
			vertex(x+(8*leafSize), y);
	   		curveVertex(x+(7*leafSize), (y-.2));
	   		curveVertex(x+(6*leafSize), (y-.5));
	   		curveVertex(x+(4.5*leafSize), (y-1.2));
	   		curveVertex(x+(3*leafSize), (y-2.1));
	    	curveVertex(x+(2.2*leafSize), (y-2.25));
	   		curveVertex(x+(1.5*leafSize), (y-2));
	   		curveVertex(x, (y-1.1));
	   		curveVertex(x, y);
	   		curveVertex(x, (y+1.1));
	   		curveVertex(x+(1.5*leafSize), (y+2));
	   		curveVertex(x+(2.2*leafSize), (y+2.25));
	   		curveVertex(x+(3*leafSize), (y+2.1));
	   		curveVertex(x+(4.5*leafSize), (y+1.2));
	   		curveVertex(x+(6*leafSize), (y+.5));
	   		curveVertex(x+(7*leafSize), (y+.2));
	   		vertex(x+(8*leafSize), y);
		endShape(CLOSE);
	} else {
		beginShape();
			vertex(x-(8*leafSize), y);
	   		curveVertex(x-(7*leafSize), (y-.2));
	   		curveVertex(x-(6*leafSize), (y-.5));
	   		curveVertex(x-(4.5*leafSize), (y-1.2));
	   		curveVertex(x-(3*leafSize), (y-2.1));
	    	curveVertex(x-(2.2*leafSize), (y-2.25));
	   		curveVertex(x-(1.5*leafSize), (y-2));
	   		curveVertex(x, (y-1.1));
	   		curveVertex(x, y);
	   		curveVertex(x, (y+1.1));
	   		curveVertex(x-(1.5*leafSize), (y+2));
	   		curveVertex(x-(2.2*leafSize), (y+2.25));
	   		curveVertex(x-(3*leafSize), (y+2.1));
	   		curveVertex(x-(4.5*leafSize), (y+1.2));
	   		curveVertex(x-(6*leafSize), (y+.5));
	   		curveVertex(x-(7*leafSize), (y+.2));
	   		vertex(x-(8*leafSize), y);
		endShape(CLOSE);
	}
	
}

//draws a flowerhead using petals:
function drawFlowerHead(x, y, flowerSize, petalNum, style) { 
	push();
	translate(x, y);		//centers flower at (0,0)
	//colors randomized in a specific range to create a cohesive pallet:
    var c = color(random(170,225), random(100,180), random(130,200)); 
	var co = color(130, 110, 140);		// purpley used for all flowers
	var rot = random(180);				// flowers start at different angles
	// drawing petals:
	for (q=0; q<petalNum; q++) {
		rotate(rot);
		if (style == 0) { drawPetalA(flowerSize*2, 0, c, co, flowerSize) }
		else if (style == 1) {drawPetalB(flowerSize*2, 0, c, co, flowerSize) }
		else { drawPetalC(flowerSize*2, 0, c, co, flowerSize) }
        rot = 2*PI/petalNum;			// rotation value based on number of petals
    }
    // center of flower drawn on top of petals:
    fill(120, 100, 110);
    circle(0, 0, flowerSize*5);
    fill(127, 100, 110);
    circle(0, 0, flowerSize*3);
    fill(135, 100, 110);
    circle(0, 0, flowerSize);
    pop();
}

// draws a petal in the FIRST[0] style. (pointy)
function drawPetalA(x, y, petalColor, outerColor, petalSize) {
    petalSize = petalSize/5;
	noStroke();	
	fill(outerColor);
	beginShape();
		vertex((x+85)*petalSize, y*petalSize);
	    curveVertex((x+70)*petalSize, (y-2)*petalSize);
	    curveVertex((x+60)*petalSize, (y-5)*petalSize);
	    curveVertex((x+45)*petalSize, (y-12)*petalSize);
	    curveVertex((x+30)*petalSize, (y-21)*petalSize);
	    curveVertex((x+22)*petalSize, (y-22.5)*petalSize);
	    curveVertex((x+15)*petalSize, (y-20)*petalSize);
	    curveVertex((x+5)*petalSize, (y-11)*petalSize);
	    curveVertex(x, y);
	    curveVertex((x+5)*petalSize, (y+11)*petalSize);
	    curveVertex((x+15)*petalSize, (y+20)*petalSize);
	    curveVertex((x+22)*petalSize, (y+22.5)*petalSize);
	    curveVertex((x+30)*petalSize, (y+21)*petalSize);
	    curveVertex((x+45)*petalSize, (y+12)*petalSize);
	    curveVertex((x+60)*petalSize, (y+5)*petalSize);
	    curveVertex((x+70)*petalSize, (y+2)*petalSize);
	    vertex((x+85)*petalSize, y);
	endShape(CLOSE);
	fill(petalColor);
	beginShape();
		vertex((x+75)*petalSize, y*petalSize);
	    curveVertex((x+60)*petalSize, (y-3)*petalSize);
	    curveVertex((x+45)*petalSize, (y-9)*petalSize);
	    curveVertex((x+30)*petalSize, (y-17)*petalSize);
	    curveVertex((x+15)*petalSize, (y-17)*petalSize);
	    curveVertex((x+5)*petalSize, (y-9)*petalSize);
	    curveVertex(x, y);
	    curveVertex((x+5)*petalSize, (y+9)*petalSize);
	    curveVertex((x+15)*petalSize, (y+17)*petalSize);
	    curveVertex((x+30)*petalSize, (y+17)*petalSize);
	    curveVertex((x+45)*petalSize, (y+9)*petalSize);
	    curveVertex((x+60)*petalSize, (y+3)*petalSize);
	    vertex((x+75)*petalSize, y);
	endShape(CLOSE);
	fill(outerColor);
	beginShape();
	    curveVertex(x, y);
	    curveVertex(x+petalSize*15, y+7);
	    curveVertex(x+petalSize*35, y+2);
	    curveVertex(x+petalSize*15, y+6);
	endShape(CLOSE);
	beginShape();
	    curveVertex(x, y);
	    curveVertex(x+petalSize*10, y+12);
	    curveVertex(x+petalSize*30, y+9);
	    curveVertex(x+petalSize*15, y+12);
	endShape(CLOSE);
	beginShape();
	    curveVertex(x, y);
	    curveVertex(x+petalSize*15, y-7);
	    curveVertex(x+petalSize*35, y-2);
	    curveVertex(x+petalSize*15, y-6);
	endShape(CLOSE);
	beginShape();
	    curveVertex(x, y);
	    curveVertex(x+petalSize*10, y-12);
	    curveVertex(x+petalSize*30, y-9);
	    curveVertex(x+petalSize*15, y-12);
	endShape(CLOSE);
	beginShape();
	    curveVertex(x, y);
	    curveVertex(x+petalSize*17, y-.5);
	    curveVertex(x+petalSize*40, y);
	    curveVertex(x+petalSize*17, y+.5);
	endShape(CLOSE);
	noLoop();
}

// draws a petal in the SECOND[1] style. (squiggled)
function drawPetalB(x, y, petalColor, outerColor, petalSize) {
    petalSize = petalSize/5;
	noStroke();	
	fill(outerColor);
	beginShape();
		vertex((x+80)*petalSize, y*petalSize);
	    curveVertex((x+70)*petalSize, (y-7)*petalSize);
	    curveVertex((x+60)*petalSize, (y-12)*petalSize);
	    curveVertex((x+45)*petalSize, (y-18)*petalSize);
	    curveVertex((x+30)*petalSize, (y-22)*petalSize);
	    curveVertex((x+22)*petalSize, (y-22.5)*petalSize);
	    curveVertex((x+15)*petalSize, (y-20)*petalSize);
	    curveVertex((x+5)*petalSize, (y-12)*petalSize);
	    curveVertex(x, y);
	    curveVertex((x+5)*petalSize, (y+12)*petalSize);
	    curveVertex((x+15)*petalSize, (y+20)*petalSize);
	    curveVertex((x+22)*petalSize, (y+22.5)*petalSize);
	    curveVertex((x+30)*petalSize, (y+22)*petalSize);
	    curveVertex((x+45)*petalSize, (y+18)*petalSize);
	    curveVertex((x+60)*petalSize, (y+12)*petalSize);
	    curveVertex((x+70)*petalSize, (y+7)*petalSize);
	    vertex((x+80)*petalSize, y);
	endShape(CLOSE);
	fill(petalColor);
	beginShape();
		vertex((x+70)*petalSize, y*petalSize);
	    curveVertex((x+60)*petalSize, (y-2)*petalSize);
	    curveVertex((x+57)*petalSize, (y-4)*petalSize);
	    curveVertex((x+53)*petalSize, (y-2)*petalSize);
	    curveVertex((x+50)*petalSize, (y-4)*petalSize);
	    curveVertex((x+47)*petalSize, (y-9)*petalSize);
	    curveVertex((x+44)*petalSize, (y-12)*petalSize);
	    curveVertex((x+37)*petalSize, (y-10)*petalSize);
	    curveVertex((x+30)*petalSize, (y-17)*petalSize);
	    curveVertex((x+15)*petalSize, (y-17)*petalSize);
	    curveVertex((x+5)*petalSize, (y-9)*petalSize);
	    curveVertex(x, y);
	    curveVertex((x+5)*petalSize, (y+9)*petalSize);
	    curveVertex((x+15)*petalSize, (y+17)*petalSize);
	    curveVertex((x+30)*petalSize, (y+17)*petalSize);
	    curveVertex((x+37)*petalSize, (y+10)*petalSize);
	    curveVertex((x+44)*petalSize, (y+12)*petalSize);
	    curveVertex((x+47)*petalSize, (y+9)*petalSize);
	    curveVertex((x+50)*petalSize, (y+4)*petalSize);
	    curveVertex((x+53)*petalSize, (y+2)*petalSize);
	    curveVertex((x+57)*petalSize, (y+4)*petalSize);
	    curveVertex((x+60)*petalSize, (y+2)*petalSize);
	    vertex((x+70)*petalSize, y);
	endShape(CLOSE);
	noLoop();
}

// draws a petal in the THIRD[2] style. (rounded)
function drawPetalC(x, y, petalColor, outerColor, petalSize) {
    petalSize = petalSize/5;
	noStroke();	
	fill(outerColor);
	beginShape();
		vertex((x+70)*petalSize, y*petalSize);
	    curveVertex((x+68)*petalSize, (y-6)*petalSize);
	    curveVertex((x+65)*petalSize, (y-10)*petalSize);
	    curveVertex((x+60)*petalSize, (y-15)*petalSize);
	    curveVertex((x+45)*petalSize, (y-22)*petalSize);
	    curveVertex((x+30)*petalSize, (y-25)*petalSize);
	    curveVertex((x+22)*petalSize, (y-24)*petalSize);
	    curveVertex((x+15)*petalSize, (y-22)*petalSize);
	    curveVertex((x+5)*petalSize, (y-11)*petalSize);
	    curveVertex(x, y);
	    curveVertex((x+5)*petalSize, (y+11)*petalSize);
	    curveVertex((x+15)*petalSize, (y+22)*petalSize);
	    curveVertex((x+22)*petalSize, (y+24)*petalSize);
	    curveVertex((x+30)*petalSize, (y+25)*petalSize);
	    curveVertex((x+45)*petalSize, (y+22)*petalSize);
	    curveVertex((x+60)*petalSize, (y+15)*petalSize);
	    curveVertex((x+65)*petalSize, (y+10)*petalSize);
	    curveVertex((x+68)*petalSize, (y+6)*petalSize);
	    vertex((x+70)*petalSize, y);
	endShape(CLOSE);
	fill(petalColor);
	beginShape();
		vertex((x+60)*petalSize, y*petalSize);
	    curveVertex((x+58)*petalSize, (y-6)*petalSize);
	    curveVertex((x+45)*petalSize, (y-15)*petalSize);
	    curveVertex((x+30)*petalSize, (y-17)*petalSize);
	    curveVertex((x+15)*petalSize, (y-15)*petalSize);
	    curveVertex((x+5)*petalSize, (y-9)*petalSize);
	    curveVertex(x, y);
	    curveVertex((x+5)*petalSize, (y+9)*petalSize);
	    curveVertex((x+15)*petalSize, (y+15)*petalSize);
	    curveVertex((x+30)*petalSize, (y+17)*petalSize);
	    curveVertex((x+45)*petalSize, (y+15)*petalSize);
	    curveVertex((x+58)*petalSize, (y+6)*petalSize);
	    vertex((x+60)*petalSize, y);
	endShape(CLOSE);
	noLoop();
}

I was inspired by flowers for this project. I did not sketch out any patterns before programming, but I knew that I wanted to create a few different types of petals that could be turned into many unique flowers. By starting with the petals and smaller units of the images, I was able to randomize parameters to produce completely different flowers each time the program is run. I also recorded my screen while creating this project and condensed the progress into a short video embedded below.

15-104 Project 05 video (google drive link)