ssontag- Looking Outwards

As far as generative art goes the only knowledge I have is generative modeling used in architecture. This year I am taking a generative modeling class that will teach me how to use python within the modeling space of Rhino to use parametric modeling to influence my designs. One of the most famous architects to use generative modeling in their work is Zaha Hadid. She has been an extremely influential architect as far as women in the field of architecture, but has also been an amazing influence to me because of her work. She has always been on the cutting edge of the design world in architecture and design. Her legacy lives on through her firm Zaha Hadid Architects.

Zaha Hadid Architects

 

Looking Outwards 02

http://www.quayola.com/laocoon-series/

This group uses a 7-axis, milling setup to create different sculptures of the human body, in their self-proclaimed “Sculpture Factory.” I admire how they combine a renaissance style of sculpture and a more geometric, contemporary style. Their process likely consists of creating the model in a 3D program and then entering it into the mill to carve away at the EPS blocks. They probably used an algorithm to create the triangular geometries and how they attach to themselves. I would want to know how the artist planned where and how the geometries fused with the natural human body.

ssontag – Project 02 – Variable Faces

sketch

//box1 Variables
var box1W = 120;
var box1H = 170;
var box1X = 160;
var box1Y = 200;

//box2 Variables
var box2W = 60;
var box2H = 300;
var box2X = 110;
var box2Y = 35;

//box3 Variables
var box3W = 250;
var box3H = 90;
var box3X = 50;
var box3Y = 50;

//box4 Variables
var box4W = 200;
var box4H = 200;

//box5 Variables
var box5W = 40;
var box5H = 90;
var box5X = 200;
var box5Y = 60;

//box6 Variables

var box6W = 100;
var box6H = 10;
var box6X = 160;
var box6Y = 200;

//box7 Variables
var box7W = 30;
var box7H = 60;
var box7X = 57;
var box7Y = 150;

//box8 Variables
var box8W = 30;
var box8H = 60;
var box8X = 290;
var box8Y = 57;


//box9 Variables
var box9W = 60;
var box9H = 10;
var box9X = 40;
var box9Y = 100;


//box10 Variables
var box10W = 15;
var box10H = 15;
var box10X = 130;
var box10Y = 190;


//eye1 Variables
var eye1W = 50;
var eye1H = 80;

//eye2 Variables
var eye2W = 30;
var eye2H = 24;



function setup() {
    createCanvas(400, 400);
    
}

function draw() {
    background(210);

//box1
    strokeWeight(0);
    fill(213, 180, 118);
    rect(box1X, box1Y, box1W, box1H);

//box2
    strokeWeight(0);
    fill(222, 184, 135);
    rect(box2X, box2Y, box2W, box2H);

//box3
    strokeWeight(0);
    fill(139, 69, 19);
    rect(box3X, box3Y, box3W, box3H);
    
//box4 
    strokeWeight(0);
    fill(210, 180, 140);
    rect(width / 6, height / 6, box4W, box4H);

//box5
    strokeWeight(0);
    fill(205, 133, 63);
    rect(box5X, box5Y, box5W, box5H);

//box6
    strokeWeight(0);
    fill(139, 69, 19);
    rect(box6X, box6Y, box6W, box6H);

//box7
    strokeWeight(0);
    fill(255, 222, 173);
    rect(box7X, box7Y, box7W, box7H);

//box8
    strokeWeight(0);
    fill(255, 222, 173);
    rect(box8X, box8Y, box8W, box8H);

//eye1
    strokeWeight(0);
    fill(0);
    ellipse(160, 55, eye1W, eye1H);

//eye2
    strokeWeight(0);
    fill(0);
    ellipse(260, 90, eye2W, eye2H);

//box9
    strokeWeight(0);
    fill(218, 165, 32);
    rect(box9X, box9Y, box9W, box9H);

//box10
    strokeWeight(0);
    fill(222, 184, 135);
    rect(box10X, box10Y, box10W, box10H);

}

function mousePressed() {
//when mouse is 
//box1 Variables
    box1W = random(110, 130);
    box1H = random(160, 180);
    box1X = random(155, 165);
    box1Y = random(195, 205);

//box2 Variables
    box2W = random(50, 70);
    box2H = random(290, 310);
    box2X = random(105, 115);
    box2Y = random(30, 40);

//box3 Variables
    box3W = random(240, 260);
    box3H = random(80, 100);
    box3X = random(45, 55);
    box3Y = random(45, 55);

//box4 Variables
    box4W = random(190, 210);
    box4H = random(190, 210);

//box5 Variables
    box5W = random(30, 50);
    box5H = random(80, 100);
    box5X = random(195, 205);
    box5Y = random(55, 65);


//box6 Variables
    box6W = random(90, 110);
    box6H = random(1, 20);
    box6X = random(155, 165);
    box6Y = random(195, 205);

//box7 Variables
    box7W = random(20, 40);
    box7H = random(50, 70);
    box7X = random(52, 63);
    box7Y = random(145, 155);

//box8 Variables
    box8W = random(20, 40);
    box8H = random(50, 70);
    box8X = random(285, 295);
    box8Y = random(52, 63);


//box9 Variables
    box9W = random(50, 70);
    box9H = random(1, 20);
    box9X = random(35, 45);
    box9Y = random(95, 105);

//box10 Variables
    box10W = random(5, 25);
    box10H = random(5, 25);
    box10X = random(125, 135);
    box10Y = random(185, 195);

//eye1 Variables
    eye1W = random(45, 55);
    eye1H = random(75, 85);

//eye2 Variables
    eye2W = random(25, 35);
    eye2H = random(19, 29);
}

When we were assigned with the task to make our faces from last week variable I continued with the theme of the cubist style. Cubism typically abstracts motion into simple geometric shapes. By the click of the mouse the face comes alive and the geometries jitter within their respective areas. My goal was to make the viewer uncomfortable while clicking the screen.

Enwandu-Project-02-Variable-Face

Variable Face

/*  Emmanuel Nwandu
    enwandu@andrew.cmu.edu
    Section D
    Project-02-Variable-Face
*/
var faceWidth = 420;
var faceHeight = 420;
var eyeSize = 82;
var eyePatchH = 176;
var eyePatchW = 111;
var mouthStroke = 7;
var earWidth = 173;
var earHeight = 195;
var blushWidth = 45;
var blushHeight = 27;
var blushRed = 253;
var blushGreen = 216;
var blushBlue = 201;

function setup() {
    createCanvas(480, 640);
    background(256);
    text("p5.js vers 0.5.12 test.", 10, 15);
}

function draw() {
    background(256);

    //ears
    fill(0);
    ellipse(97, 170, earWidth, earHeight);
    ellipse(388, 170, earWidth, earHeight);

    //inner ears
    fill(blushRed, blushGreen, blushBlue);
    ellipse(97, 170, earWidth - 78, earHeight - 91);
    ellipse(388, 170, earWidth - 78, earHeight - 91);

    //head
    noStroke();
    fill(256);
    ellipse(width/2, height/2, faceWidth, faceHeight);

    //eyepatches
    noStroke();
    fill(0);
    ellipse(130, 337, eyePatchW, eyePatchH);
    ellipse(353, 337, eyePatchW, eyePatchH);


    //eyes including pupil and highlights
    noStroke();
    fill(256)
    ellipse(136, 355, eyePatchW - 29, eyePatchW - 29);
    ellipse(359, 355, eyePatchW - 29, eyePatchW - 29);
    fill(0);
    ellipse(136, 355, 62, 62);
    ellipse(359, 355, 62, 62)

    fill(256)
    //Defines edge conditions
    //Allows the highlights to follow the mouse within the boundary
    var leftEdgeR = 120;
    var rightEdgeR = 147;
    var leftEdgeL = 343;
    var rightEdgeL = 370;

    var xcR = constrain(mouseX, leftEdgeR, rightEdgeR);
    var xcL = constrain(mouseX, leftEdgeL, rightEdgeL);

    ellipse(xcR, 337, 33, 33);
    ellipse(130, 356, 12, 12);
    ellipse(xcL, 337, 33, 33);
    ellipse(353, 356, 12, 12);

    //nose
    fill(0);
    ellipse(243, 413, 50, 20);
    ellipse(243, 419, 27, 20);

    //blush
    fill(blushRed, blushGreen, blushGreen);
    ellipse(132, 452, blushWidth, blushHeight);
    ellipse(356, 452, blushWidth, blushHeight);

    //mouth
    noFill();
    stroke(0);
    strokeWeight(mouthStroke);
    arc(243, 425, 75, 60, HALF_PI, PI);

}
//When the mouse is pressed variables are randomized
function mousePressed() {
    mouthStroke = random(1, 10);
    faceWidth = random(360, 420);
    faceHeight = random(360, 420);
    earWidth = random(100, 180);
    earHeight = random(120, 200);
    eyePatchW = random(65, 150);
    eyePatchH = random(150, 200);
    blushWidth = random(40, 85);
    blushHeight = random(20, 35);
    blushRed = random(150, 260);
    blushGreen = random(200, 220);
    blushBlue = random(175, 210);

}

Inspired by my love of pandas, I coded the image with the intent of playing with figure ground relationships, negative and positive space, and how it can inform the clarity of the image.

I started by coding the base image that is seen first, and through trial and error began coding the randomized variations.

Project 2, odh

odh-variables

//Owen D Haft
//Section D
//odh@andrew.cmu.edu
//Project 02
    
var headX = 200;
var headY = 300;
var earX = 60;
var earY = 100;
var eyeX = 50;
var eyeY = 50;
var eyeU = 25;
var eyeV = 25;
var musX = 100;
var musY = 80;

function setup() {
    createCanvas(640, 480);
    
}

function draw() {

    background(64, 64, 154);
    noStroke(0);

//body
    fill(200, 0, 0)
    arc(320, 480, 150, 100, PI, PI);
    
//neck
    fill(247, 231, 197);
    rect(300 ,340 ,40 , 100);

//ears
    ellipse(200, 230, earX, earY);
    ellipse(440, 230, earX, earY);

//head
    ellipse(320, 260, headX, headY);

//eyes
    fill(255);
    ellipse(275, 220, eyeX, eyeX);
    ellipse(365, 220, eyeY, eyeY); 

//pupils
    fill(0, 0, 0);
    ellipse(275, 220, eyeU, eyeU);
    ellipse(365, 220, eyeV, eyeV);   

//mustache
    fill(120, 100, 60)
    arc(320, 310, musX, musY, PI, PI)

}

function mousePressed(){

    earX = random(50, 100);
    earY = random(80, 120);
    headX = random(200, 250);
    headY = random(300, 350);
    eyeX = random(40, 75);
    eyeY = random(40, 75);
    eyeU = random(6, 36);
    eyeV = random(6, 36);
    musX = random(80, 120);
    musY = random(75, 85);

}

I worked primarily with simpler geometries while experimenting with the variables. I played with using the same variables for both the “x” and “y” of certain shapes, like the eyes and pupils, allowing them to change independent of each other.

cduong-LookingOutwards-02

This is an architectural project that aims to get the public to have an experiential feel while they are in this space using all of their senses. It is known as Phenomena and was made by Benjamin Dillenburger and Demetris Shammas. It is a piece of architecture that reacts differently with its surroundings depending on the time of day: reflects light and casts shadow during the day and transforms into an “oversized 3D display for video projection” at night.

In my architectural modern history class we are learning about more modern architecture and how the idea of architecture is no longer only about buildings, which is exactly what this project incorporates. Phenomena is considered architecture because of its experience and not because it is a building, which I find amazing because I used to think that architecture was only associated with buildings.

Based on the complexity of the shape of Phenomena it is obvious that the creators had to use a computer program to create this project and based on several algorithms that they had to create, such as the different types of materials and how each material reacts to different factors, including light. Another algorithm could have been how different forms could come together to create a certain feeling.

The creator’s artistic sensibilities are manifested in the algorithms because they had to create the set of variables that they wanted this project to be based on. Based on what they wanted this project to accomplish they had to create a set of algorithms for those goals they had for the project. Also the creators had to add their own artistic touch to the project, whether it be what types of forms they wanted to create and what types of materials and color they wanted to use.

Phenomena by Benjamin Dillenburger and Demetris Shammas (2015)

http://www.michael-hansmeyer.com/projects/phenomena_info.html?screenSize=1&color=0#undefined

VideoLink: http://www.michael-hansmeyer.com/projects/phenomena_video.html?screenSize=1&color=0

cduong-Project02-Variable Faces-SectionD

project02variablefaces

/*
Name: Colleen Duong
Class Section: D; 9:30AM
Email: cduong@andrew.cmu.edu
Project-02-Variable Faces
*/

//List of Variables that are used for the Front Character
var eyeSize = 20;
var faceWidth = 200;
var faceHeight = 200;
var Blush = 60;
var Mouth = 30;
var Sprout = 30;
var BodyShake = 300;

//List of Variables for the background Characters
var ShadowPosseHead = 100;
var ShadowPosseBody = 200;
var ShadowBack = 0;
var ShadowMiddle = 30;
var ShadowFront = 60;


function setup() {
    createCanvas(640, 480);
}

function draw() {
    background(137, 0, 0);
    noStroke();

    //Stalkers Body (Left/Black). The variables will make the shapes move left and right frequently
    fill(ShadowBack);
    ellipse(ShadowPosseBody+80, 450, ShadowPosseHead, ShadowPosseHead);
    ellipse(ShadowPosseBody+130, 450, ShadowPosseHead, ShadowPosseHead);
    ellipse(ShadowPosseBody+150, 420, ShadowPosseHead, ShadowPosseHead);
    ellipse(ShadowPosseBody-100, 450, ShadowPosseHead, ShadowPosseHead);
    ellipse(ShadowPosseBody-200, 450, ShadowPosseHead, ShadowPosseHead);

    //Stalkers Body (Left/DarkGrey). The variables will make the shapes move left and right frequently
    fill(ShadowMiddle);
    ellipse(ShadowPosseBody, 350, ShadowPosseHead, ShadowPosseHead);
    rect(ShadowPosseBody, 380, 20, 40, 10);
    arc(ShadowPosseBody+10, 440, 70, 70, PI, 0);
    rect(ShadowPosseBody-30, 430, 75, 70, 10);
    ellipse(ShadowPosseBody-100, 370, ShadowPosseHead, ShadowPosseHead);
    rect(ShadowPosseBody-100, 400, 20, 40, 10);
    arc(ShadowPosseBody-90, 460, 70, 70, PI, 0);
    rect(ShadowPosseBody-125, 460, 70, 70);

    //Stalkers Body (Left/LightGrey). The variables will make the shapes move left and right frequently
    fill(ShadowFront);
    ellipse(ShadowPosseBody-50, 400, ShadowPosseHead, ShadowPosseHead);
    rect(ShadowPosseBody-50, 430, 20, 40, 10);
    arc(ShadowPosseBody-40, 490, 70, 70, PI, 0);
    rect(ShadowPosseBody-80, 480, 75, 70, 10);
    ellipse(ShadowPosseBody+80, 400, ShadowPosseHead, ShadowPosseHead);
    rect(ShadowPosseBody+80, 430, 20, 40, 10);
    arc(ShadowPosseBody+90, 490, 70, 70, PI, 0);
    rect(ShadowPosseBody+60, 480, 75, 70, 10);
    ellipse(ShadowPosseBody-150, 400, ShadowPosseHead-10, ShadowPosseHead-10);
    rect(ShadowPosseBody-150, 430, 20, 40, 10);
    arc(ShadowPosseBody-140, 485, 70, 70, PI, 0);
    rect(ShadowPosseBody-170, 480, 75, 70, 10);

    //Stalkers Body (Right/Black). The variables will make the shapes move left and right frequently
    fill(ShadowBack);
    ellipse(ShadowPosseBody+300, 450, ShadowPosseHead, ShadowPosseHead);
    ellipse(ShadowPosseBody+400, 450, ShadowPosseHead+10, ShadowPosseHead+10);
    ellipse(ShadowPosseBody+200, 450, ShadowPosseHead, ShadowPosseHead);

    //Stalkers Body (Right/DarkGrey). The variables will make the shapes move left and right frequently
    fill(ShadowMiddle);
    ellipse(ShadowPosseBody+300, 350, ShadowPosseHead, ShadowPosseHead);
    rect(ShadowPosseBody+300, 380, 20, 40, 10);
    arc(ShadowPosseBody+310, 440, 70, 70, PI, 0);
    rect(ShadowPosseBody+280, 430, 75, 70, 10);
    ellipse(ShadowPosseBody+200, 370, ShadowPosseHead, ShadowPosseHead);
    rect(ShadowPosseBody+200, 400, 20, 40, 10);
    arc(ShadowPosseBody+210, 460, 70, 70, PI, 0);
    rect(ShadowPosseBody+180, 445, 70, 70);

    //Stalkers Body (Right/LightGrey). The variables will make the shapes move left and right frequently
    fill(ShadowFront);
    ellipse(ShadowPosseBody+250, 400, ShadowPosseHead, ShadowPosseHead);
    rect(ShadowPosseBody+250, 430, 20, 40, 10);
    arc(ShadowPosseBody+260, 490, 70, 70, PI, 0);
    rect(ShadowPosseBody+230, 480, 75, 70, 10);
    ellipse(ShadowPosseBody+380, 400, ShadowPosseHead, ShadowPosseHead);
    rect(ShadowPosseBody+380, 430, 20, 40, 10);
    arc(ShadowPosseBody+390, 490, 70, 70, PI, 0);
    rect(ShadowPosseBody+360, 480, 75, 70, 10);

    //Face Shape. Variables makes the face change size.
    fill(256);
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);

    //Blush. Variables makes blush change size in correlation with the eyes.
    var eyeLX = width / 2.1 - faceWidth * 0.25;
    var eyeRX = width / 2.1 + faceWidth * 0.25;
    fill(255, 114, 129);
    ellipse(eyeLX, 270, Blush, Blush);
    ellipse(eyeRX+20, 270, Blush, Blush);

    //Eyes. Variables makes blush change size in correlation with the head.
    fill(0);
    rect(eyeLX, height / 2.3, eyeSize, eyeSize*2, 10);
    rect(eyeRX, height / 2.3, eyeSize, eyeSize*2, 10);

    //Mouth. Variable makes mouth change size.
    fill(0);
    arc(310, 290, Mouth, Mouth, PI, 0);

    //Sprout. Variable makes sprout grow in height
    fill(201, 208, 126);
    ellipse(290, 100, 50, 30);
    ellipse(340, 100, 50, 30);
    rect(305, 100, 20, Sprout+30, 10);

    //Body. Variable makes body move right to left to make it look as though it's shaking.
    fill(256);
    rect(BodyShake+5, 310, 35, 50, 10);
    arc(BodyShake+30, 390, 100, 100, PI, 0);
    rect(BodyShake-20, 385, 100, 100);
}

function mousePressed() {
    faceWidth = random(180, 220);
    faceHeight = random(180, 220);
    eyeSize = random(10, 30);
    Blush = random(50, 70);
    ShadowPosseBody = random(190, 210);
    Mouth = random(10, 50);
    Sprout = random(20, 30);
    ShadowBack = random(0, 20);
    ShadowMiddle = random(30, 50);
    ShadowFront = random(60, 80);
    BodyShake = random(295, 305);

}

For my code I wanted to draw a character that I tend to doodle a lot.

Initially I wanted to make the sprout look evil and scary, but after coding it I realized it wasn’t really possible with it’s basic characteristics, which were ellipse eyes, blush, and a big sprout coming out of its head. So after coding the sprout and making the facial features and the sprout move I decided to continue with my “evil and scary” idea and made these shadow-like creatures behind my sprout character. Initially I was going to just leave them there but I wanted them to move a little as if they were moving towards the sprout character.

At this point I thought I was done but I thought having the sprout character’s body stay still made the entire picture look a bit static when it was clicked on, so I decided to make it look as though the sprout character’s body was shaking as the shadows behind it were coming after it.

My ideas did not really come in an orderly manner so my code was a bit difficult to work with and a bit unorganized, but hopefully it is easier to read after I added some comments to it.

dnoh-sectionD-project02-variableface

sketch

/*
Daniel Noh
Section D
dnoh@andrew.cmu.edu
Project-02
*/

var yolkSize = 230;
var eggX = 0;
var eggY = 0;
var eggA = 0;
var eggB = 0;
var rEye = 20;
var lEye = 20;
var r = -15;
var g = -15;
var b = 15;
var bubbleSize = 30;

function setup() {
  createCanvas(640, 480);
  background(255);
}

function draw() {
//fryingpanback
  stroke(0);
  strokeWeight(7);
  fill(40);
  ellipse(320, 480, 1000, 1000);
  noStroke();
  fill(60);
  ellipse(320, 480, 850, 850)

//egg white shape
  fill(240+b, 240+b, 240+b);
  stroke(0);
  strokeWeight(7);

  beginShape();
  curveVertex(100+eggX, 540+eggY);
  curveVertex(100+eggX, 540+eggY);
  curveVertex(80+eggX, 400+eggY);
  curveVertex(110+eggA, 300+eggB);
  curveVertex(200+eggB, 250+eggX);
  curveVertex(320+eggX, 150+eggA);
  curveVertex(440+eggB, 250+eggY);
  curveVertex(530+eggY, 300+eggB);
  curveVertex(560+eggX, 400+eggA);
  curveVertex(540+eggA, 540+eggB);
  curveVertex(540+eggA, 540+eggB);
  endShape();

//yolk face
  fill(255+r, 255+g, 0+b);
  stroke(0);
  strokeWeight(7);
  ellipse(320, 450, yolkSize, yolkSize);

//eyes
  fill(0);
  noStroke();
//uppereye
  ellipse(270+r, 460+r, bubbleSize+r+10, bubbleSize+r+10);
//lowereye
  ellipse(320+g, 400+r, bubbleSize, bubbleSize);

//mouth
  stroke(0);
  ellipse(340, 480, bubbleSize+20+eggA, bubbleSize+40+b);
}

function mousePressed() {
  eggX = random(-25, 25);
  eggY = random(-25, 25);
  eggA = random(-25, 25);
  eggB = random(-25, 25);
  r = random(-15, 0);
  g = random(-25, 0);
  b = random(0, 25);
  yolkSize = random(200, 230);
  bubbleSize = random(20, 25);
  clear();
}

I honestly went directly to coding only knowing that I wanted to create a dynamic egg face, so at first I was slightly confused. I plotted points down relative to the overall canvas and went from there. I reused several randomized variables for different things, which made my code a bit unorganized. However, I am content with my final product.

hyt-Looking-Outward-02: Deep Learning Drawing Machine

Shantell Martin and Sarah Schwettmann working on the “Mind the Machine” prototype. 2017
Template products of the “Mind the Machine”

For most people in the world, creative processes and ideas usually are associated with words such as “unique,” “special,” or  “innovative.” However, recently I have discovered a British artist who crafted something that might be contrary to people’s conventional connotations.

Shantell Martin, recently residing in New York, collaborated with computational cognitive neuroscientist Sarah Schwettmann to create a systematic “drawing machine” trained by deep neural leaning. What’s interesting about this algorithm-based drawing is that it completes its learning through Shantell Martin’s own three-hundred drawings, then extract common, recurring elements and tempts to rearrange the patterns for new creations. According to the artist herself, as she is more a improvised, “stream of conscious” kind of artist, this deep learning tool has enabled her to understand her “system of thought” and artistic style more.

Personally, I find the experimental art project intriguing since it’s almost like a prototype machine for the future world –dissembling the artists’ elements of style and ideologies and streamline-producing seemingly hand-drawn artworks to the audience. I think this project worth pondering and reflecting for all of us as we step into the creative industry in later days of our lives, to think about how we can utilize machines to a greater use and at the mean time maintain our own uniqueness and integrity.

ghou-project-02-VariableFace

I really liked the googly-eyes, I feel like it added a little more dynamic to this drawing. There definitely could be more characteristics varied but I think the image should stay somewhat recognizable.

sketch

//Grace Wanying Hou
//15-104 Section D
//ghou@andrew.cmu.edu
//Assignment 02

var faceWidth = 200;
var faceHeight = 250;
var earsize = 100;
var eyesize = 20
var mouthsize = 50;

var faceround = 10;
var earround = 20;

//each of these features have 3 types that will get chosen when clicked 
var facet = 1;
var eart = 1;
var types =[1,2,3];
//colours
var facer = 255;
var faceg = 220;
var faceb = 200;
var eyer = 255;
var eyeg = 255;
var eyeb = 255;

// setting the canvas and changing rectangle mode to center
function setup() {
    createCanvas(480,640);
    rectMode(CENTER);
}


function draw() {
    //background will always be in a darker shade than the face
    background(facer-150, faceg-150, faceb-150);
    fill (facer, faceg, faceb);
    
    stroke(facer+25,faceg+25,faceb+25);
    strokeWeight(20);
    
    
    //types of ears
    if(eart == 1){
        ellipse(width/2 - faceWidth/2, height/2 - faceHeight/4, earsize*4/5, earsize);
        ellipse(width/2 + faceWidth/2, height/2 - faceHeight/4, earsize*4/5, earsize);
    }
    if(eart == 2){
        rect(width/2 - faceWidth/2, height/2 - faceHeight/4, earsize/2, earsize, earround);
        rect(width/2 + faceWidth/2, height/2 - faceHeight/4, earsize/2, earsize, earround);
    }
    if(eart == 3){
        triangle(width/2 - faceWidth/4, height/2 - faceHeight/5, width/2, height/2 - faceHeight/3, width/2 - faceWidth/3, height/2 - faceHeight/2 - earsize/2);
        triangle(width/2 + faceWidth/4, height/2 - faceHeight/5, width/2, height/2 - faceHeight/3, width/2 + faceWidth/3, height/2 - faceHeight/2 - earsize/2);
    }
    
    
    //tyes of faces
    strokeWeight(6);
    if(facet == 1){
        ellipse(width/2, height/2, faceWidth, faceHeight);
    }
    if(facet == 2){
        rect(width/2, height/2, faceWidth, faceHeight, faceround);
    }
    if(facet == 3){
        triangle(width/2 - faceWidth/2, height/2 - faceHeight/2,
		 width/2 + faceWidth/2, height/2 - faceHeight/2,
		 width/2, height/2 + faceHeight/2);
    }
    
    
    //eyes
    noStroke();
    
    //the white? part of the eye???
    fill(facer + 100, faceb + 100, faceg + 100)
    ellipse(width/2 - width/16, height/2 - height/40, eyesize*2, eyesize*2);
    ellipse(width/2 + width/16, height/2 - height/40, eyesize*2, eyesize*2);
    
    //eyeballs??
    fill(0);
    noStroke();
    var eyeballrX = constrain(mouseX, width/2 - width/16 - eyesize/3, width/2 - width/16 + eyesize/3);
    var eyeballlX = constrain(mouseX, width/2 + width/16 - eyesize/3, width/2 + width/16 + eyesize/3);
    var eyebally = constrain(mouseY, height/2 - height/40 - eyesize/3, height/2 - height/40 + eyesize/3);
    
    ellipse(eyeballrX, eyebally, eyesize, eyesize);
    ellipse(eyeballlX, eyebally, eyesize, eyesize);
    
    //mouth
    fill(facer-100, faceg-150, faceb-150);
    stroke(facer-25,faceg-25,faceb-25);
    ellipse(width/2, height/2 + faceHeight/4, faceWidth/500*mouthsize);
    
    }
 
function mousePressed() {
    faceWidth = random(150,300);
    faceHeight = random(100,350);
    facet = random(types);
    
    earsize = random(80,150);
    mouthsize = random(0,100);
    
    faceround = random(10,20);
    earround = random(5,20);

    eart = random(types);
    facer = random (100,255);
    faceg = random (100,255);
    faceb = random (100,255);
}