Author: vreiter@andrew.cmu.edu

sketch

/*Victoria Reiter
Section B
vreiter@andrew.cmu.edu
Project-02-Variable-Face
*/

// defines coordinate position of freckle
var freckleX = 285;
var freckleY = 335;
// defines an increment value to be used under function mouseClicked()
var increment = 5;
// defines dimensions of pupils
var pupilWidth = 30;
var pupilHeight = 30;
// defines dimensions of the whites of the eyes
var whiteEyeWidth = 80;
var whiteEyeHeight = 80;
// defines dimensions of the irises of the eyes
var irisWidth = 55;
var irisHeight = 55;
// defines coordinates of the "point" of the nose
var pointyNoseX = 220;
var pointyNoseY = 325;
// defines y coordinates of the ears and inner ears
var earY = 260;
var innerEarY = earY + 5;
// defines dimensions of the mouth
var mouthWidth = 110;
var mouthHeight = 70;
// declares RGB values for hair
var hairColorR = 255;
var hairColorG = 255;
var hairColorB = 0;
// declares RGB values for irises of eyes
var irisColorR = 0;
var irisColorG = 102;
var irisColorB = 102;
// declares RGB values for hat
var hatColorR = 0;
var hatColorG = 76;
var hatColorB = 153;
// declares RGB values for hat band
var hatBandColorR = 0;
var hatBandColorG = 0;
var hatBandColorB = 51;

function setup() {
    // establishes canvas
    createCanvas(640, 480);
    background(220);
    // establishes background color
    background('rgb(153, 255, 204)');
    // writes a short message
    text("~V's Self-Portrait~", 10, 15);
}
function draw() {
    // reestablishes background now in dunction (draw)
    background(220);
    background('rgb(153, 255, 204)');
    noStroke();
    // Skin color
    fill('rgb(255,204,153)'); 
    //head
    ellipse(250, 285, 270, 290); 
    //ears
    ellipse(385,earY,50,70);
    ellipse(115,earY,50,70);
    noStroke();
    // inner ear color
    fill('rgb(255, 153, 153)'); 
    //inner ears
    ellipse(390,earY,30,50);
    ellipse(110,earY,30,50);
    //nose
    triangle(255,331,240,350,pointyNoseX,pointyNoseY);
    noStroke();
    // cheek blush color
    fill(255,204,204); 
    // cheek blush
    ellipse(185,335,60,25);
    ellipse(315,335,60,25);
    noStroke();
    // hairColor
    fill(hairColorR,hairColorG,hairColorB); 
    // hair
    quad(145,175,190,175,165,265,125,230);
    quad(180,175,215,175,245,260,230,245);
    quad(260,175,305,175,315,255,285,235);
    quad(315,175,355,175,370,220,335,245);
    noStroke();
    // hat color
    fill(hatColorR,hatColorG,hatColorB); 
    //hat
    ellipse(250, 190, 300, 75); 
    ellipse(210,140,110,150);
    ellipse(292,140,110,150);
    noStroke();
    // hat band color
    fill(hatBandColorR,hatBandColorG,hatBandColorB); 
    // hat band
    rect(155,152.5,192,30);
    // eye outline color
    stroke('rgb(0,158,255)');
    // white of eyes color
    fill('rgb(255, 255, 255)');
    // white of eyes
    ellipse(200,285,whiteEyeWidth,whiteEyeHeight);
    ellipse(305,285,whiteEyeWidth,whiteEyeHeight);
    // outline of mouth color
    stroke('rgb(102,0,51)');
    // mouth
    arc(250,360,mouthWidth,mouthHeight,0,PI,CHORD);
    noStroke();
    // irises
    fill(irisColorR,irisColorG,irisColorB);
    ellipse(200,272,irisWidth,irisHeight);
    ellipse(305,272,irisWidth,irisHeight);
    noStroke();
    // pupils
    fill('rgb(0,0,0)');
    ellipse(200,260,pupilWidth,pupilHeight);
    ellipse(305,260,pupilWidth,pupilHeight);
    noStroke();
    // freckle color
    fill('rgb(153,76,0)');
    // freckle
    ellipse(freckleX,freckleY,10,10);
}
    function mouseClicked() {
    // makes random variations occur in the portrait
    // moves freckle randomly about the face
    freckleX = random(150,350);
    freckleY = random(325,375);
    // changes size of the whites of eyes, pupils, and irises
    whiteEyeWidth = random(80,110);
    whiteEyeHeight = random(80,110);
    irisWidth = random(60,75);
    irisHeight = random(60,75);
    pupilWidth = random(25,55);
    pupilHeight = random(25,55);
    // changes nose shape or "pointiness"
    pointNoseX = random(185,245);
    pointyNoseY = random(305,345);
    // moves the ears up and down
    earY = random(250,270);
    // changes size of the mouth
    mouthWidth = random(40,150);
    mouthHeight = random(25,95);
    // changes color of the hair (warm colors)
    hairColorR = random(155,255);
    hairColorG = random(155,255);
    // changes color of the irises (cool colors)
    irisColorR = random(0,155);
    irisColorG = random(155,200);
    irisColorB = random(155,255);
    // changes color of the hat (completely random)
    hatColorR = random(0,255);
    hatColorG = random(0,255);
    hatColorB = random(0,255);
    // changes color of the hat band (grey scale)
    hatBandColorR = random(0,255);
    hatBandColorG = hatBandColorR;
    hatBandColorB = hatBandColorG;
}

In this project, I adapted my face from the week 1 project, and selected several variables to change randomly/within constraints. With a click of the mouse, my freckle moves across the screen, the sizes of the whites of my eyes, irises, and pupils change, the pointiness of my nose changes, my ears move up and down, my mouth changes size, my hair changes color (but sticks to warm colors), my irises change color (but stick to cool colors), my hat changes color randomly, and the band of my hat changes color along a grey scale.

I decided to use the basis of my face from the first project because I knew I would already have a LOT of difficulty figuring out the mechanics of this week’s task. And I did !!! I had no idea what was going on !!!!!!! So an immense enormous thank you to help from TAs Rain and Simin, who helped explain to me some concepts of how variables work and how declaring them and assigning them can be util for this and future tasks.

Furthermore, I adapted my code by adding in comments which I did not include in week one, cleaning up indentations and semicolons, and switching from hsl to rgb because I think it is a little easier to use and helpful for this project.

(((Again, THANK YOU TAs, I AM LESS HOPELESS WITH YOUR HELP)))