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)))
![[OLD FALL 2018] 15-104 • Introduction to Computing for Creative Practice](https://courses.ideate.cmu.edu/15-104/f2018/wp-content/uploads/2020/08/stop-banner.png)
