# Week 1: Self portrait

This is my first processing project, a self portrait, and being a rather crafty person it felt just like using different paper cutouts and somehow putting them together to create a portrait of myself – well somewhat. Getting to know how to create different 2D shapes in Processing, I thought about which shapes to use to create a face and how I will take advantage of the fact that I am not limited by paper cutouts but could actually add some movement and interaction. While experimenting in class, at some point the eyes I had created where not static anymore but moving and creating a pattern behind the head which I thought would be a cool repetition of a visual element in the portrait and add some fun. I kept the face, eyes and mouth simple while trying to remember radian values from high school to create a semi-circle for the mouth. When looking for a somewhat realistic blonde tone RGB value I realized that the color would not match with the skin tone I used. That is how my favorite part of the portrait was added, the color changing hair. To make the code work took another reflection because my approach was too narrow minded thinking about our class example where the color of a rectangle would only change when clicking on it. The simple solution was to define mouseX and mouseY within the whole area of my “artwork” so you can click anywhere within the window and the hair color will change. Hope you enjoy!

P.S. I  have not died my hair yet.

```//portrait
//for animated reference
int x;
int y;
int xSpeed = 9;
int ySpeed = 9;

//for static reference
int a;
int b;

//to change hair color
float red = 255;
float green = 0;
float blue = 0;
int value = 0;

void setup () {
size(640, 480);
x = width/2;
y = height/2;
a = width/2;
b = height/2;
}

void draw () {
noStroke();

//eyes background animation
noFill();
ellipseMode(CENTER);

//white part/sclera
fill(252);
ellipse(x-35, y-10, 30, 30);
ellipse(x+35, y-10, 30, 30);

//black part/iris
fill(0);
ellipse(x-35, y-10, 10, 10);
ellipse(x+35, y-10, 10, 10);

if (x >= width || x <= 0) {
xSpeed *= -1;
}

if (y >= height || y <= 0) {
ySpeed *= -1;
}

x = x + xSpeed;
y = y + ySpeed;

//hair: behind body
fill(red, green, blue); //hair changes color
rectMode(CENTER);
rect(a, b+40, 180, 0.7*b);

//body shape behind face
fill(0); //clothes color
rectMode(CENTER);
rect(a, 1.5*b, 80, b);

//face shape
fill(235, 221, 188);
ellipse(a, b, 180, 220);

//static eyes
//white part/sclera
fill(252);
ellipse(a-35, b-10, 30, 30);
ellipse(a+35, b-10, 30, 30);

//black part/iris
fill(0);
ellipse(a-35, b-10, 10, 10);
ellipse(a+35, b-10, 10, 10);

//nose
fill(209, 156, 50);
ellipse(a-8, b+20, 6, 6);
ellipse(a+8, b+20, 6, 6);

//mouth
arc(a, b+40, 80, 80, 0, PI, PIE);

//hair
//bangs
fill(red, green, blue); //hair changes color
arc(a, b-40, 180, 180, PI, 2*PI);
//sides
rectMode(CORNER);
rect(a-90, b-50, 20, 0.7*b);
rect(a+70, b-50, 20, 0.7*b);

//arms
stroke(0);
strokeWeight(20);
noFill();
arc(a, b+100, 300, 180, 0, PI, OPEN);
}

void mousePressed () {
if (mouseX > 0 && mouseX < width && mouseY > 0 && mouseY < height) {
red = random(255);
green = random(255);
blue = random(255);
}
}```