Drawing with coordinates was confusing at first, as it was not based on a system which I was familiar too. In mathematics the point of origin is always going from the null point  i.e. left to right on the x-axis and from null upwards on the y-axis. The difference on the computer is that the "drawing" of a program start's from the upper left corner downwards. This is because as we humans read from left to right, line for line so does the computer. After understanding this concept the process of drawing and creating in script was quiet enjoyable. Using functions such as pushMatrix(); and popMatrix(); to lock and move different set coordinate grids, made changing only certain areas such as mouth or eyes more manageable.

In the fallowing lessons we learned the concept of variables and functions. Variables are defined by the programmer and can contain values which are defined by the user and also are able to be interchanged with other values. By knowing this our objective for this lesson was to create our own function which would make a smiley rotate around a larger smiley. My solution to this was to use a function which Processing gives the User: the frameCount();. By counting the frames I had a variable which automatically got larger in time. The other way to solve this would be to define a variable x which started at null and counted upwards which is what the frameCount(); does.

</pre>
</div>
<div>int SMILEY_DEFAULT = 1;
int SMILEY_SAD = 2;
int SMILEY_DRUNK = 3;
int SMILEY_ANGRY = 4;
int SMILEY_OLD = 5;
int SMILEY_ASTOUND = 6;
int SMILEY_SLEEPY = 7;
int SMILEY_HORNY = 8;
int SMILEY_PANIC = 9;

int smileyType = SMILEY_DEFAULT;

void setup()
{
size(400, 400); // def. fenstergroesse

smooth(); // aktiviere antialiasing
strokeWeight(15); // linienbreite
}

void draw()
{
background(255); // def. hintergrundfarbe

// teste ob der mauszeiger innerhalb des smiley ist
/*if (mouseX > (width * .5 - 90) && mouseX < (width * .5 + 90) &&
mouseY > (height * .5 - 90) && mouseY < (height * .5 + 90))
// die mouse ist im smiley, smiley mag das nicht
smileyType = SMILEY_SAD;
else
smileyType = SMILEY_DEFAULT;
*/
pushMatrix(); // Moves the Center
translate(width * .5, width * .5);
smiley(smileyType); // funtions aufruf
popMatrix();
}

// funktion
void smiley(int smileyType)
{
noFill();
ellipse(0, 0, 180, 180); // kopf

fill(0);
if (smileyType == SMILEY_SAD)
{
noFill();

ellipse(0 - 30, 0 - 30, 20, 5); // linkes augen

ellipse(0 + 30, 0 - 30, 20, 5); // rechtes augen
}
else if (smileyType == SMILEY_DRUNK)
{
noFill();
ellipse(0 - 90, 0 - 160, 50, 50);
ellipse(0 - 30, 0 - 130, 40, 40);
ellipse(0 - 90, 0 - 100, 30, 30);
ellipse(0 - 30, 0 - 30, 30, 30); // linkes augen
ellipse(0 + 30, 0 - 30, 20, 5); // rechtes augen
}
else if (smileyType == SMILEY_PANIC)
{
pushStyle();
noFill();

ellipse(0 - 30, 0 - 30, 30, 30); // linkes augen
ellipse(0 + 30, 0 - 30, 40, 40); // rechtes augen
popStyle();
}
else if (smileyType == SMILEY_ANGRY)
{
beginShape();
vertex(0-40, 0-40);
vertex(0-20, 0-20);
vertex(0-40, 0-10);
endShape(); // rechtes augen
beginShape();
vertex(0+40, 0-40);
vertex(0+20, 0-20);
vertex(0+40, 0-10);
endShape();
}
else if (smileyType == SMILEY_OLD)
{
popMatrix();
translate(width/2, height/2);
ellipse(0 - 30, 0 - 30, 20, 5);

ellipse(0 + 30, 0 - 30, 20, 5);
ellipse(0 - 30, 0 - 25, 5, 5);

ellipse(0 + 30, 0 - 25, 5, 5);
pushStyle();
strokeWeight(2);
noFill();
ellipse(0 - 30, 0 - 20, 60, 60);
ellipse(0 + 30, 0 - 20, 60, 60);
line(20,-60,-20,-60);
line(15,-70,-15,-70);
popStyle();

pushMatrix();
}
else if (smileyType == SMILEY_SLEEPY)
{
line(-20,0 - 30,-50, 0 - 30); // linkes augen
line(20,0 - 30,50, 0 - 30);
}

else if (smileyType == SMILEY_HORNY)
{
//line(-20,0 - 30,-50, 0 - 30); // linkes augen
line(20,0 - 30,50, 0 - 30);
pushStyle();
noFill();
arc(-35,0-20, 40, 50, radians(180+20), radians(360-20));
popStyle();
}

else if (smileyType == SMILEY_OLD)
{
noFill();

ellipse(0 - 30, 0 - 30, 40, 40); // linkes augen
ellipse(0 + 30, 0 - 30, 40, 40); // rechtes augen
}
else
{
ellipse(0 - 30, 0 - 30, 20, 20); // linkes augen
ellipse(0 + 30, 0 - 30, 20, 20); // rechtes augen
}

noFill();
if (smileyType == SMILEY_SAD ||smileyType == SMILEY_DRUNK)
{
arc(0, 60, 100, 100, radians(180+20), radians(360-20));
} // mund
else if (smileyType == SMILEY_ANGRY)
{
beginShape();
vertex(0 -40, 30);
vertex(0+40, 30);
endShape();
}
else if (smileyType == SMILEY_OLD)
{
beginShape();
vertex(0 -20, 30);
vertex(0+20, 30);
endShape();
}
else if (smileyType == SMILEY_ASTOUND)
{
ellipse(0,50,10,10);
}
else if (smileyType == SMILEY_SLEEPY)
{
arc(0, 0, 50, 50, radians(20), radians(180-20));
pushMatrix();
translate(80,-80);
beginShape();
vertex(20,0);
vertex(0,0);
vertex(20,-20);
vertex(0,-20);
endShape();
popMatrix();
pushMatrix();
translate(120,-120);
beginShape();
vertex(30,0);
vertex(0,0);
vertex(30,-30);
vertex(0,-30);
endShape();
popMatrix();
}
else if (smileyType == SMILEY_PANIC)
{
pushMatrix();
pushStyle();
fill(255);
//translate(width/2,height/2);

arc(0, 80, 120, 120, radians(180+20), radians(360-20));
popStyle();
popMatrix();
// pushStyle();
// fill(0);
// noStroke();
// arc(0, 100, 120, 120, radians(180+20), radians(360-20));
// popStyle();
}
else
{
arc(0, 0, 100, 100, radians(20), radians(180-20)); // mund
}

}

void keyPressed()
{
if (key == '1')
smileyType = SMILEY_SAD;
else if (key == '2')
smileyType = SMILEY_DRUNK;
else if (key == '3')
smileyType = SMILEY_ANGRY;
else if (key == '4')
smileyType = SMILEY_OLD;
else if (key == '5')
smileyType = SMILEY_ASTOUND;
else if (key == '6')
smileyType = SMILEY_SLEEPY;
else if (key == '7')
smileyType = SMILEY_HORNY;
else if (key == '8')
smileyType = SMILEY_PANIC;
}

void keyReleased() {
smileyType = SMILEY_DEFAULT;
}
<pre>

rot smily code

void setup()</pre>
{
size(400,400); // def. fenstergroesse
frameRate(60);
smooth(); // aktiviere antialiasing
strokeWeight(15); // linienbreite
}

void draw()
{
background(255); // def. hintergrundfarbe

float radius = dist(mouseX,mouseY,width/2,height/2); // rechne die distanz vom mousecursor zum fensterzentrum aus
radius = map(radius,0,width,1,4); // rechne aus in welchem bereich der radius am schluss sein sollte

pushMatrix();
translate(200,200);
rotate(calcAngle());
scale(radius);
smiley();
rotate(frameCount*0.01);
translate(0,130);
scale(.2);
smiley(); // funtions aufruf
popMatrix();

}

// funktion
void smiley()
{
noFill();
ellipse(0,0,180,180); // kopf

fill(0);
ellipse(0 - 30,0 - 30,20,20); // linkes augen
ellipse(0 + 30,0 - 30,20,20); // rechtes augen

noFill();
arc(0,0,100,100,radians(20),radians(180-20)); // mund
}

// berechne den winkel zur fenstermitter vom mausecursor aus
// die winkel sind in radiant
float calcAngle()
{
return -atan2(mouseX - (width / 2),mouseY - (height / 2));
}