Face Animation in Processing

Using Processing I created an animation illustrating myself playing a videogame that scares me.

The following is the code used to create this animation.

int numFrames = 130; //do i need this?
int frame = 0;
long timer;
float framespeed = 250;

int p = 12; //pupil
int px = 100; //pupil x position
int py = 180; //pupil y position
int elm = 130; //eye lid move
int eB = 0; //eye blink
int hcy = 325; //hoodie chest y
int m = 1; //mouth
int eby= 137; //eyebrow y

int step = 0; //for test

void setup() {
size(300, 400);
smooth();
}
void draw() {

if (millis() – timer > framespeed) {
timer = millis();
frame ++;
}
if (frame == numFrames) {
frame = 0;
}
background(175);
fill(125);
stroke(125);
ellipse(154, 193, 246, 332); //headphones
fill(175);
stroke(175);
rect(39, 278, 230, 69);
stroke(50);
fill(50);
ellipse(154, 201, 224, 325); //hoodie
rect(30, hcy, 249, 198, 65); // hoodie chest
fill(255, 229, 180);
ellipse(width/2, height/2, 200, 300); // head
fill(125);
stroke(0);
rect(141, 354, 15, 62, 8); //zipper
line(148, 359, 148, 405); //zipper
fill(255);
ellipse(100, 180, 40, 40); // left eye
ellipse(186, 180, 40, 40); // right eye
fill(3, 104, 255);
ellipse(px, py, p+9, p+9); //eye color
ellipse(px+86, py, p+9, p+9); //eye color
fill(0);
ellipse(px, py, p, p); // left pupil
ellipse(px+86, py, p, p); // right pupil
fill(255, 229, 180);
stroke(255, 229, 180);
ellipse(100, elm, 45, 45); // left eye lid
ellipse(186, elm, 45, 45); // right eye lid
fill(50);
stroke(50);
ellipse(154, 100, 164, 106); //hoodie
fill(255, 229, 180);
stroke(255, 229, 180);
ellipse(150, 121, 165, 73); //face above
fill(0);
stroke(0);
ellipse(143, 280, 50, m); // mouth
fill(192, 162, 114);
stroke(255, 229, 180);
rect(72, eby, 64, 17, 8); //L eyebrow
rect(154, eby, 64, 17, 8); //R eyebrow
fill(100);
stroke(100);
rect(258, 156, 33, 91, 8); //L headphone
rect(14, 156, 33, 91, 8); //R headphone

//————eye blink ————-
if ( frame == 0 || frame == 10 || frame == 20 || frame == 30 || frame == 40 || frame == 50 || frame == 52 || frame == 60 || frame == 70 || frame == 80 || frame == 90 || frame == 100 || frame == 110 || frame == 120)
{
eB = 1;
}
if (eB == 1) {
elm = elm + 5;
if (elm >= 182) {
elm = 182;
eB = 2;
}
}

if (eB == 2) {
elm = elm – 5;
if (elm <= 130) {
elm = 130;
eB = 3;
}
}
//end———————————

//—————look (px=100 py=180)—————-
if (frame==3)
{if (py<184) py=py+1;}
if (frame==9)
{if (px<105) px=px+1;}
if (frame==18)
{if (px>96) px=px-1;}
if (frame==24)
{if (px<105) px=px+1;}
if (frame==30)
{if (px>96) px=px-1;}
if (frame==42)
{if (px<100) px=px+1;
if (py>183) py=py-1;}
//after dialation——————–
if (frame==58)
{if (px>96) px=px-1;
if (py<184) py=py+1;}
if (frame==75)
{if (px<104) px=px+1;}
if (frame==88)
{if (px>96) px=px-1;}
if (frame==95)
{if (px<104) px=px+1;}
if (frame==110)
{if (px>96) px=px-1;}
if (frame== 120)
{if (px<100) px=px+1;
if (py>180) py=py-1;}

//end——————————————-

//—————-cringe———–
//————-eyebrows——————-
if (frame==48)
{if (eby > 129) eby = eby – 1;}
//————–pupil dialation———-
if (frame==48)
{if (p < 16) p = p + 1;}
//—————chest—————-
if (frame==48)
{if (hcy > 250) hcy = hcy -1;}
//—————-mouth————-
if (frame==48)
{if (m < 6) m = m + 1;}
//end——————————————-

//eyebrows slight down
if (frame==66)
{if (eby < 132) eby = eby + 1;}

//—————-UNcringe———–
//————-eyebrows——————-
if (frame==89)
{if (eby < 137) eby = eby + 1;}
//————–pupil dialation———-
if (frame==88)
{if (p > 12) p = p – 1;}
//—————chest—————-
if (frame==110)
{if (hcy < 325) hcy = hcy +1;}
//—————-mouth————-
if (frame==95)
{if (m > 1) m = m – 1;}
//end——————————————-
}

Advertisements
This entry was posted in Time-Based and tagged , , , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s