9-10XIST
Face
Code
void setup() {
size(500, 400);
background(255);
}
void draw() {
// head
fill(153,204,255);
ellipse(250, 200, 300, 300);
//eyebrows
stroke(0);
fill(0);
rect(130, 140, 70, 8);
rect(300, 140, 70, 8);
//nose
stroke(255);
fill(255,255,204);
triangle(225, 230, 252, 175, 281, 230);
int augeLW =175, augeLH =200, augeRW =330, augeRH=200;
int pupileLW = augeLW, pupileLH, pupileRW, pupileRH;
int mundH = 275;
if (mousePressed)
{
stroke(0, 0, 0);
fill(0, 0, 0);
ellipse(175, 200, 70, 70);
ellipse(330, 200, 70, 70);
} else
{
stroke(0, 0, 0);
fill(255);
ellipse(augeLW, augeLH, 70, 70);
ellipse(augeRW, augeRH, 70, 70);
}
fill(0);
if (mouseX < 155)
{
pupileLW =155;
} else if (mouseX > 195)
{
pupileLW = 195;
} else
{
pupileLW = mouseX;
}
if (mouseY < 180)
{
pupileLH = 180;
} else if ( mouseY > 220)
{
pupileLH = 220;
} else
{
pupileLH = mouseY;
}
ellipse(pupileLW, pupileLH, 30, 30);
if (mouseX < 310)
{
pupileRW =310;
} else if (mouseX > 350)
{
pupileRW = 350;
} else
{
pupileRW = mouseX;
}
if (mouseY < 180)
{
pupileRH = 180;
} else if ( mouseY > 220)
{
pupileRH = 220;
} else
{
pupileRH = mouseY;
}
fill(0);
ellipse(pupileRW, pupileRH, 30, 30);
if (mouseY < 275)
{
mundH = 0;
} else if(mouseY > 325)
{
mundH = 50;
}
else
{
mundH = mouseY - 275;
}
fill(255,153,153);
rect(200, 275, 100, mundH);
}
Video Demonstration
This code creates a face in which the pupils follow the cursor. As the cursor moves down the screen, the mouth drops simultaneously. I modified this code by changing the colour of the face and the colour of the mouth when it drops. I also made the eyebrows thinner. The hardest modification was the nose. I wanted to change it into a triangle. Making sure the nose was correctly sized and placed took a lot of trial and error. The process became easier when I realised that the placement is related to math. Once I worked out the math, it was easy to move the nose around whilst keeping its shape. As a result of all the trials and errors, I became better at placing the nose on the screen. I could roughly estimate the amount I needed to take away or add to move to a certain point. I also changed the colour of the nose from a dark blue to a light yellow. The main functions used include ellipse(), rect() and triangle().
​
(click the functions underlined to learn more about them)