Project 01 – Self Portrait

This is my self portrait, that changes color when you move your mouse around

self-portrait
/*
*Alyssa Song
*agsong@andrew.cmu.edu
*Section C
*
*This program draws a self-protrait. It takes a little bit of time to load!
*/

function setup() {
    createCanvas(800, 800);
    //background(255, 255, 255);
}
   

function draw() {
	stroke(0);
	strokeWeight(5);
	//background changes color when mouse is on left or right side of screen
	 if (mouseX < 0.5*width) {
    	background(228, 228, 253); //light purple background
    } else {
    	background(198, 226, 249); //light blue background
    }

	//hair in the back and face
	fill(0, 0, 0);
	quad(0.25*width, 0.25*height, 0.125*width, 0.875*height, 0.875*width, 0.875*height, 0.75*width, 0.25*height) //back hair
	fill(227, 180, 171); //skin color
	ellipse(0.5*width, 0.5*height, 0.5*width, 0.7*height); //face

    //eyebrows
    fill(0, 0, 0);
    quad(0.4375*width, 0.40625*height, 0.4375*width, 0.4375*height, 0.3125*width, 0.4375*height, 0.3125*width, 0.40625*height); //left eyebrow
    quad(0.6875*width, 0.40625*height, 0.6875*width, 0.4375*height, 0.5625*width, 0.4375*height, 0.5625*width, 0.40625*height); //right eyebrow

    //hair in front of face
    quad(0.25*width, 0.25*height, 0.25*width, 0.5*height, 0.5*width,0.25*height, 0.5*width, 0.125*height) //left side hair
    fill(0, 0, 0);
    quad(0.75*width, 0.25*height, 0.75*width, 0.5*height, 0.5*width, 0.25*height, 0.5*width, 0.125*height) //right side hair
    fill(0, 0, 0);

    //eyes
    fill(255, 255, 255); //white
    ellipse(0.375*width, 0.5*height, 0.125*width, 0.0625*height); //left eye
    //change left eye color when mouse is on left or right side of the screen
    if (mouseX < 0.5*width) {
    	fill(149,85,73); //light brown
    } else {
    	fill(104, 47, 48); //brown
    }
    ellipse(0.375*width, 0.5*height, 0.0625*width); //left iris
    fill(0, 0, 0); //black
    ellipse(0.375*width, 0.5*height, 0.02*width); //left pupil
    fill(255, 255, 255); //white
    ellipse (0.38*width, 0.49*height, 0.02*width); //left shine
    fill(255, 255, 255); //white
    ellipse(0.625*width, 0.5*height, 0.125*width, 0.0625*height); //right eye
    //change right eye color when mouse is on left or right side of the screen
    if (mouseX < 0.5*width) {
    	fill(149,85,73); //light brown
    } else {
    	fill(104, 47, 48); //brown
    }
    ellipse(0.625*width, 0.5*height, 0.0625*width); //right pupil
    fill(0, 0, 0) //black
    ellipse(0.625*width, 0.5*height, 0.02*width); //right pupil
    fill(255, 255, 255); //white
    ellipse(0.635*width, 0.49*height, 0.02*width); //right shine

    //nose 
    line(0.5*width, 0.5*height, 0.5*width, 0.5625*height); 
    line(0.5*width, 0.5625*height, 0.5625*width, 0.625*height);
    line(0.5*width, 0.625*height, 0.5625*width, 0.625*height);

    //mouth
    //change lip color when mouse is on left or right side of the screen
    if (mouseX < 0.5*width) {
    	fill(160, 95, 120); //nude lip
    } else {
    	fill(152, 41, 41); //red lip
    }
    quad(0.4375*width, 0.71875*height, 0.46875*width, 0.6875*height, 0.53125*width, 0.6875*height, 0.5625*width, 0.7185*height); //upper lip
    quad(0.4375*width, 0.71875*height, 0.46875*width, 0.75*height, 0.53125*width, 0.75*height, 0.5625*width, 0.7185*height); //lower lip
    
    //blush
    if (mouseX < 0.5*width) {
    	fill(241, 212, 230); //nude lip
    } else {
    	fill(229, 142, 196); //red lip
    }
    ellipse(0.625*width, 0.625*height, 0.0625*width); //right cheek
    ellipse(0.375*width, 0.625*height, 0.0625*width); //left cheek

}

Leave a Reply