// Face variables
var eyeSize = 30;
var faceWidth = 80;
var faceHeight = 125;
var noseSize = 335;
var earSize = 15;
var mouthSize = 345;
function setup() {
createCanvas(480, 600);
}
function draw() {
background('blue');
//hair
fill('brown');
ellipse(width / 2, height / 2 -20, faceWidth, faceHeight);
//face
fill(253, 228, 200);
ellipse(width / 2, height / 2, faceWidth, faceHeight);
fill('white');
//eyes
var eyeLX = width / 2 - faceWidth * 0.25;
var eyeRX = width / 2 + faceWidth * 0.25;
ellipse(eyeLX, height / 2, eyeSize, eyeSize);
ellipse(eyeRX, height / 2, eyeSize, eyeSize);
//iris
fill('brown');
ellipse(eyeLX, height / 2, eyeSize * .25, eyeSize * .25);
ellipse(eyeRX, height / 2, eyeSize * .25, eyeSize * .25);
//nose
fill(253, 228, 200);
triangle(240, 320, 237, noseSize, 243, noseSize);
//mouth
arc(width / 2, mouthSize, 10, 10, 0, PI, OPEN);
//ears
ellipse(240 - faceWidth * .5, 285, 10, earSize);
ellipse(240 + faceWidth * .5, 285, 10, earSize);
}
function mousePressed() {
faceWidth = random(70, 125);
faceHeight = random(120, 160);
eyeSize = random(18, 37);
noseSize = random(330, 340);
earSize = random(12, 18);
mouthSize = random(343, 348)
}
I had trouble with variables at first, but once I understood them more it was fine.
]]>function setup() {
createCanvas(300, 200);
}
function draw() {
background(76, 45, 143);
//neck
fill(253, 228, 200);
rect(140, 140, 20, 70);
//face
ellipse(150, 150, 55, 65);
//eye
fill('white');
ellipse(140, 140, 12, 10);
ellipse(160, 140, 12, 10);
//iris
fill('brown');
ellipse(140, 140, 6, 6);
ellipse(160, 140, 6, 6);
//pupil
fill('black');
ellipse(140, 140, 2, 2);
ellipse(160, 140, 2, 2);
//nose
fill(253, 228, 200);
triangle(150, 150, 148, 160, 153, 160);
//mouth
arc(150, 166, 10, 10, 0, PI, OPEN);
//eylashes left side
line(140, 134, 140, 131);
line(136, 135, 136, 131);
line(138, 134, 138, 131);
line(134, 135, 134, 131);
line(142, 134, 142, 131);
line(144, 135, 144, 131);
//eyelashes right side
line(160, 134, 160, 131);
line(162, 134, 162, 131);
line(164, 136, 164, 131);
line(166, 136, 166, 131);
line(160, 134, 160, 131);
line(158, 134, 158, 131);
line(156, 135, 156, 131);
//hair
stroke('brown');
line(mouseX, 105, 150, 116);
line(mouseX+5, 105, 155, 118);
line(mouseX+10, 105, 160, 120);
line(mouseX+15, 105, 165, 122);
line(mouseX-5, 105, 145, 118);
line(mouseX-10, 105, 140, 120);
line(mouseX-15, 105, 135, 122);
}
This is my first time coding. Also my hair is animated.
]]>