# Variable Faces

I used the last homework as a template since I couldn’t figure out a way to start from the scratch. I put the face shape, ears(the size and the placement), eye size, eyebrows and mouth as a variable. The mouth and eye placement is not random but is calculated every time and is placed relative to the face and the chin. The face colour is also random on a very small scale, since I wanted to keep the colour close to peach colour

```color faceColor = color(200,200,200);

float earPlaceY = 172;
float earSizeX = 27;
float earSizeY = 45;
float faceLengthY = 270;
float faceChinX = 120;
float faceChinY = 230;
float faceWidthX = 100;
float faceWidthY = 150;
float faceForheadX = 130;
float faceForheadY = 100;
float eyeSizeX = 40;
float eyeSizeY = 30;
float eyebrowY1 = 130;
float eyebrowY2 = 150;
float mouthMid = 250;

void setup(){
size(400, 400);
}

void mousePressed(){
faceColor = color(random(240,255),random(208,228),random(180,190));
earPlaceY = random(160,185);
earSizeX = random(20,35);
earSizeY = random(35,55);
faceLengthY = random(230,310);
faceChinX = random(100,140);
faceChinY = random(210,250);
faceWidthX = random(70,130);
faceWidthY = random(120,180);
eyeSizeX = random(20,60);
eyeSizeY = random(15,45);
eyebrowY1 = random(130,150);
eyebrowY2 = random(130,150);
//mouthX = random();
//mouthY = random();
mouthMid = random(190,270);
}

void draw(){
background(0,77,153);
strokeWeight(4);
stroke(0);
//face colors
fill(faceColor);
//ears
ellipse(faceWidthX,earPlaceY,earSizeX,earSizeY);
ellipse(400-faceWidthX,earPlaceY,earSizeX,earSizeY);
//face
beginShape();
curveVertex(faceWidthX,faceWidthY);
curveVertex(faceChinX,faceChinY);
curveVertex(200,faceLengthY);
curveVertex(400-faceChinX,faceChinY);
curveVertex(400-faceWidthX,faceWidthY);
endShape(CLOSE);
//eyes
fill(255);
fill(0);
//mouth
beginShape();
curveVertex((faceWidthX+200)/2,faceChinY);
curveVertex(faceChinX*3/2,faceChinY-20);
curveVertex(200,mouthMid);
curveVertex(400-faceChinX*3/2,faceChinY-20);
curveVertex(400-(faceWidthX+200)/2,faceChinY);
endShape();
//eyebrows
strokeWeight(8);
line((faceWidthX+200)/2-15,eyebrowY1,(faceWidthX+200)/2+15,eyebrowY2);
line(415-(faceWidthX+200)/2,eyebrowY1,385-(faceWidthX+200)/2,eyebrowY2);
//hair
strokeWeight(4);
}

```

# Miss America Generator

The source of all Miss Americas!

I was unable to convert it to p5.js. It would have been better to click yourself to generate a Miss America. This was put together with a lot of brute force coding, I used the random function for every variable. Some of the random numbers were randomly choosing a type of object or string to put (like the type of bangs, or the names) and the other way I used random numbers were to change the size of something (like the slight change in the shape of the eyes, or the hair length)

```//cc Charlotte Stiles
//Miss America Generator

float sideFace = 0, chin = 0;
color bgColor = color(int(random(200)),int(random(200)),int(random(200)));
String [] issueOne = {"Human ", "Youth ", "Senior ", "Homeless ", "Animal ","Disease ", "Prison ","World Peace ","Global Climate Change "};
String [] issueTwo = {"Rights", "Brought to Justice", "Awareness", "Abuse Pervention", "Help","Problems","Rescue","Fund","Appreciation"};
String [] name = {"Sophia","Emma","Olivia","Stephanie","Ava","Mia","Emily","Abigail","Madison","Vanessa","Nina","Avery","Sofia",
int nameNum = int(random(name.length));
int i1 = int(random(1,9));
int i2 = int(random(1,9));
int bangsNum = int(random(1,4));
color hairColor;
color skinColor;
int hairColorNum = int(random(8));
int hairLength = int(random(20));
float eyeNum = random(-3,3);
float mouthNum = random(-3,3);
float ex=0,ey=0;
void setup(){
size(400,400);
ellipseMode(CENTER);
}

void draw(){
noStroke();
fill(bgColor);
rect(0, 0, width, height);
hair();
face();
hairColorFun();
skinColorFun();
eyes();
bangs();
platformIssue();
name();
mouth();

}

void face(){
fill(skinColor);
beginShape();
curveVertex(252,142);
curveVertex(158,129);
curveVertex(131,126);
curveVertex(112,150);
curveVertex(120-sideFace,223);//left cheak
curveVertex(200,279+ chin); //chin
curveVertex(280+sideFace,218 );// right cheak
curveVertex(287,155);
curveVertex(257,118);
curveVertex(130,127);
curveVertex(156,219);
endShape();
}

void hairColorFun(){

if (hairColorNum < = 5) {
hairColor = color(231,235,153) ;
}
else if (hairColorNum == 6) {
hairColor = color(80,10,2) ;
}
else if (hairColorNum == 7){
hairColor = color (200,127,33);
}

}

void skinColorFun(){

if (hairColorNum <= 5) { skinColor = color(255,218,186) ; } else if (hairLength >= 20) {
skinColor = color(138,93,33) ;
}
else if (hairLength < = 19){
skinColor = color (250,194,145);
}

}

void bangs(){
fill(hairColor);
if (bangsNum == 1) {
beginShape();
curveVertex(97,89);
curveVertex(157,82);
curveVertex(258,175);
curveVertex(313,170);
curveVertex(310,157);
curveVertex(278,96);
curveVertex(239,178);
endShape();

}

else if (bangsNum == 2) {
beginShape();
curveVertex(250,35);
curveVertex(138,71);
curveVertex(108,137);
curveVertex(290,142);
curveVertex(297,100);
curveVertex(246,74);
endShape();
}

else if (bangsNum == 3) {
beginShape();
curveVertex(239,112);
endShape();
}

}

void name(){
textSize(30);
textAlign(CENTER);
}

void hair(){
fill(hairColor);
ellipse(201,142,220,-176);
rect (94,137,216,224 - hairLength,32);
}

void eyes(){
fill(0);
beginShape();
curveVertex(ex+120,ey+249);
curveVertex(ex+127+eyeNum,ey+186);
curveVertex(ex+145,ey+177);
curveVertex(ex+159,ey+184);
curveVertex(ex+163+eyeNum,ey+192);
curveVertex(ex+137,ey+195);
endShape();

triangle(119,170,134,186,127,187);
triangle(123,162,142,187,132,184);
triangle(130,161,149,182,139,183);

triangle(277,164,264,181,268,184);
triangle(273,162,259,187,248,184);
triangle(265,161,252,182,241,183);

beginShape();
curveVertex(ex+153,ey+210);
curveVertex(ex+262-eyeNum,ey+188);
curveVertex(ex+257,ey+177);
curveVertex(ex+232,ey+184);
curveVertex(ex+233-eyeNum,ey+192);
curveVertex(ex+246,ey+195);
endShape();

}

void mouth(){
noStroke();
fill(200 + (hairColorNum*7) ,50,50);
beginShape();
curveVertex(width/2+157, height/2+10);
curveVertex(width/2+9, height/2+22);
curveVertex(width/2+-2, height/2+25);
curveVertex(width/2+-19, height/2+23);
curveVertex(width/2-47, height/2+37);
curveVertex(width/2+-3, height/2+(61+mouthNum));
curveVertex(width/2+39, height/2+33);
curveVertex(width/2+11, height/2+-13);
endShape();
fill(255);
beginShape();
curveVertex(width/2+207, height/2+10);
curveVertex(width/2+15, height/2+35);
curveVertex(width/2+0, height/2+37);
curveVertex(width/2+-23, height/2+36);
curveVertex(width/2-46, height/2+37);
curveVertex(width/2+0, height/2+47);
curveVertex(width/2+40, height/2+33);
curveVertex(width/2+11, height/2+37);
endShape();
}

void platformIssue(){
textSize(13);
fill(0);
text("Platform Issue: " + issueOne[i1] + issueTwo[i2],width/2,380);
//I'm putting i1 and i2 as global variables so it choses one random
//number for each time the program runs, and sticks with it
}

void mouseClicked(){
sideFace = random(-10,10);
chin=(random(-5,15));
bgColor = color(int(random(200,255)),int(random(200,255)),int(random(200,255)));
i1 = int(random(1,9));
i2 = int(random(1,9));
bangsNum = int(random(1,4));
hairColorNum = int(random(8));
hairLength = int(random(48));
eyeNum = random(-3,3);
mouthNum = random(-3,3);
}

```

# CSB — Chernoff Faces — P5JS

Please click the white space below in order to initiate the script.

The number of mouse clicks modifies a number of variables, including frameRate, so click a lot.

CSBCHERNOFF

Here are some screenshots from previous (scrapped) versions of the program:

# Alex Face Changer

Face Changer

This was the assignment I decided to start out with. It was quite a challenge and more of an experience/ experimental piece. Fun fact: I figured out how to randomize the color on my own before we were taught it in class. so, that was a very proud accomplishment of mine, which is kind of sad. My second modification was adding a mouth to the example face. For this used a triangle to stick to the simple geometric shape aesthetic. I then continued to have the mouth shape randomize. My third modification was adding pupils and getting the position of the eye and pupils to move with ever frame.

```float eyeSize = 20;
float eyePlace = height/2;
float faceWidth = 100;
float faceHeight = 120;
float mouthWidth = 50;
float mouthHeight = 200;
int red=255;
int blue=255;
int green=255;

void setup(){
size(300,300);
frameRate (2);
}

void draw(){
background(180);
float clampedX = constrain(mouseX, faceWidth, faceWidth);
fill(red, green, blue);
ellipse (width/2, height/2, faceWidth, faceHeight);

fill(red/2,green/2, blue/2);
float eyeLX = width/2 - faceWidth*0.25;
float eyeRX = width/2 + faceWidth*0.25;
ellipse (eyeLX, eyePlace, eyeSize, eyeSize);
ellipse (eyeRX, eyePlace, eyeSize, eyeSize);

float mouthLX = width/2 - faceWidth*0.25;
float mouthRX = width/2 + faceWidth*0.25;
float mouthHX = mouthHeight + faceHeight*0.25;
triangle (mouthLX/2,170, mouthRX+70, 170, width/2+70, mouthHX);

fill(0);
ellipse (eyeLX, eyePlace, eyeSize/2, eyeSize/2);
ellipse (eyeRX, eyePlace, eyeSize/2, eyeSize/2);

faceWidth  = random (75,  150);
faceHeight = random (100, 200);
eyeSize    = random (10,  30);
mouthWidth = random (25, mouthHeight);
mouthHeight = random (150, 225);
eyePlace = random (100, 150);
}

void mousePressed(){
red = int(random(0,256));
blue = int(random(0,256));
green = int(random(0,256));

}
```

# Generating Darwin’s Galapagos Finches

For the face generator project, I decided to create a program that generates finches, based off of the beak permutations found in Darwin’s finches of the Galapagos Islands (see images below). I pretty much eyeballed the parameters for the finches’ basic beak shapes, but I think this project would be worth revisiting with accurate mathematical data reflecting each beak’s dimensions. With regards to my completed program, I’d like to find a way to make the curvature of the beak less prominent in the smaller beak permutations.

```//Miranda Jacoby
//majacoby@andrew.cmu.edu
//EMS INTERACTIVITY SECTION A
//Copyright Miranda Jacoby 2014

//Variable Bird Faces

float headX = 25;
float headY = -50;
float headBeakAnchorX1 = random(100, 110);
float headBeakAnchorY1 = random(175, 200); //range of randdomness to atleast 200
float headBeakAnchorX2 = 150;
float headBeakAnchorY2 = 350; //Throat control. Currently unused, see headBeakAnchors

//Anchor the eye x and y pos to some dimension of the beak
float eyeX = 200 + headBeakAnchorX1/10;
float eyeY = 140 + headBeakAnchorY1/10;
float eyeH = 30;
float eyeW = 35;

float beakX = 0;
float beakY = 0;
float beakHeight = 100; //Currently unsued, see headbeakAnchors
float beakWidth = random(25, 60); //10 is a long beak, 100 is a short beak
float beakAnchorX = 200;
float beakAnchorY = 200;

void setup() {

size(400, 400);
//Values for messing about with tweak
headBeakAnchorY1 = 175; //range of randdomness to atleast 200
headBeakAnchorY2 = 333; //Currently unused, see headBeakAnchors
beakHeight = 100; //Currently unsued, see headbeakAnchors
beakWidth = 49; //25 is a long beak, 70 is a short beak
beakAnchorX = 200;
beakAnchorY = 200;
}

void draw() {

background(255);

noStroke();
fill(0);
beginShape();
endShape(CLOSE);

//birdbody
fill(0);
ellipse(310, 340, 300, 250);

//birdbeak
//Change headbeakAnchors, subtract beakHeight from them
fill(234, 188, 152);
beginShape();
vertex(beakX + beakAnchorX, beakY + beakAnchorY    );

//curveVertex(819, 572);
curveVertex(beakAnchorX + 639, beakAnchorY + 185);
curveVertex(beakX + beakAnchorX, beakY + beakAnchorY    );
curveVertex(beakX + beakWidth, beakY + beakAnchorY);
curveVertex(beakAnchorX + 58, beakAnchorY + -43);
//vertex(beakX + beakWidth, beakY + beakAnchorY    );

//vertex(beakX + headBeakAnchorX2, beakY + headBeakAnchorY2);//(beakAnchorY + beakWidth/3));
vertex(beakX + headBeakAnchorX2, beakY + (beakAnchorY + beakWidth/3));
endShape(CLOSE);

//Line seperating top and bottom of beak
//Averages highest and lowest point, connects to beak tip and beak anchor
stroke(245, 229, 210);
strokeJoin(ROUND);
strokeWeight(2);
line(beakX + beakAnchorX, beakY + beakAnchorY, (beakWidth/2)+(headBeakAnchorX1 + headBeakAnchorX2)/2, (beakHeight/5) + (headBeakAnchorY1 + headBeakAnchorY2)/3 );
line( (beakWidth/2) + (headBeakAnchorX1 + headBeakAnchorX2)/2, (beakHeight/5) + (headBeakAnchorY1 + headBeakAnchorY2)/3, beakX + beakWidth, beakY + beakAnchorY);
noStroke();

//birdeye
fill(255);
//Eye Ring
ellipse(eyeX, eyeY, eyeW, eyeH);
//Eye Iris
fill(88, 48, 18);
ellipse(eyeX, eyeY, eyeW - 5, eyeH - 5);
//Eye Pupil
fill(0);
ellipse(eyeX, eyeY, eyeW - 20, eyeH - 15);
//Highlight
fill(255);
ellipse(eyeX - 5, eyeY - 5, eyeW -28, eyeH -27);

}
////Make Bird's beak change randomly by clicking
void mousePressed(){

headBeakAnchorX1 = random(100, 110);
headBeakAnchorY1 = random(175, 220);
beakWidth = random(35, 80);
eyeX = 200 + headBeakAnchorX1/8;
eyeY = 140 + headBeakAnchorY1/8;
}

```