Tracy – [OLD SEMESTER] 15-104 • Introduction to Computing for Creative Practice

Project 2: Variable Face

Tracy — Sun, 11 Sep 2022 02:45:10 +0000

Hi here are my faces! The hardest part of the project is to create all these different options for hair, eyes, mouth etc. Then linking those to the random function.

sketch

//Tracy Meng
//Section B

// GLOBAL VARIABLES
var eyeSize = 20;
var mouthSize = 50;
var earringSize = 30;
var faceWidth = 100;
var faceHeight = 150;
var earSize = 20;
var noseSize = 30;
var pupSize = 10;
var noseType = 1;
var hairType = 1;
var eyeType = 1;
var earringType = 1;
var mouthType = 1;
var backgroundType = 1;


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

function draw() {
//BACKGROUND
    //background types
    if (backgroundType == 1) {
        background(225,246,255); //light blue background
    }

    else if (backgroundType == 2) {
        background(255,164,216); //light pink background
    }

    else {
        background(247,255,165); //light yellow background
    }


//HAIR
    // hair types    
    if (hairType == 1) {
        strokeWeight(15);
        stroke(127,82,0); //brownhair
        fill(127,82,0);
        arc(width / 2, height / 2, faceWidth, faceHeight, PI, 0); //straight long hair
        rect(width/2 - faceWidth/2, height/2, faceWidth, height);
    }

    else if (hairType == 2) {
        strokeWeight(45);
        stroke(209,209,20); //blondehair
        fill(209,209,20);
        arc(width / 2, height / 2, faceWidth, faceHeight, PI-PI/4, PI/4); //pom-poms
        ellipse(width/2 - faceWidth/2, height/2 + faceHeight/4, faceHeight/2); //pom-pom left
        ellipse(width/2 + faceWidth/2, height/2 + faceHeight/4, faceHeight/2); //pom-pom right
    }

    else {
        strokeWeight(80);
        stroke(27,6,0); //blackhair
        arc(width / 2, height / 2, faceWidth, faceHeight, PI-PI/8, PI/8); //short hair
    }


//EARS
    //local variable of EARS
var earLX = width / 2 - (faceWidth/2); // earLX = horizontal coordinate of LEFT ear
var earRX = width / 2 + (faceWidth/2); // earLX = horizontal coordinate of LEFT ear

    //left ear
    noStroke();
    fill(255,220,177); //nude color
    ellipse(earLX, height/2, earSize/2, earSize);

    //right ear
    ellipse(earRX, height /2, earSize/2, earSize); 

    //left ear hole
    strokeWeight(2);
    stroke(230,145,20); //dark nude stroke
    arc(earLX, height/2, earSize/4, earSize/2, -PI/2, -PI+PI/2); 
    
    //right ear hole
    arc(earRX, height /2, earSize/4, earSize/2, PI/2, -PI-PI/2);


//FACE / HEAD
//strokeWeight(1);  
    strokeWeight(0);
    fill(255,220,177); //nude color  
    ellipse(width / 2, height / 2, faceWidth,  faceHeight);


//EARRINGS
    //earring types
    if (earringType == 1) {
        strokeWeight(5);
        stroke(167,0,239); //purple
        noFill();
        ellipse(earLX, height/2 + earSize/2, earringSize/6, earringSize); //left ear
        ellipse(earRX, height/2 + earSize/2, earringSize/6, earringSize); // right ear
    }

    else if (earringType == 2) {
        noStroke();
        fill(27,255,255); //teal
        ellipse(earLX, height/2 + earSize/2, earringSize/2, earringSize); //left ear
        ellipse(earRX, height/2 + earSize/2, earringSize/2, earringSize); // right ear


        fill(0,159,11); //green - smaller circle
        ellipse(earLX, height/2 + earSize/2, earringSize/3, earringSize/1.5); //smaller cirlcle left
        ellipse(earRX, height/2 + earSize/2, earringSize/3, earringSize/1.5); //smaller circle right
    }

    else {
        fill(255,277,80); //orange
        rect(earLX-earringSize/4, height/2 + earSize/2, earringSize/2, earringSize,5); //left ear
        rect(earRX-earringSize/4, height/2 + earSize/2, earringSize/2, earringSize,5); // right ear
    }


//NOSE
    //local variables of NOSE
var noseX = width /2; // horizontal coordinates for NOSE
var noseY = height /2 + (faceHeight/8); // vertical coordinates for NOSE

noStroke();
fill(255,198,122); //nose color darker nude
    //nose types
    if (noseType == 1) {
        ellipse(noseX, noseY, noseSize, noseSize); // nose circle
    }

    else if (noseType == 2) {
        rect(noseX - (noseSize/4), noseY - (noseSize/2), noseSize/2, noseSize, 30); // nose rectangle
    }

    else {
        triangle(noseX, noseY - (noseSize/2), noseX - (noseSize/2), noseY + (noseSize/4), noseX + (noseSize/2), noseY + (noseSize/4)); // nose triangle
    }


//EYES    
    //local variable of EYES
var eyeLX = width /2 - (faceWidth * 0.25); //eyeLX = horizontal coordinate of LEFT eye
var eyeRX = width /2 + (faceWidth * 0.25); //eyeRX = horizontal coordinate of RIGHT eye


//eye type 1 - eye open  
    if (eyeType == 1) {

    //overall eyeball
        fill(255); //white eyeballs
        ellipse(eyeLX, height /2, eyeSize + eyeSize/4, eyeSize); //left eye
        ellipse(eyeRX, height /2, eyeSize + eyeSize/4, eyeSize); //right eye

    //eye color
        fill(0,176,203); //eye color - blue
        ellipse(eyeLX, height /2, eyeSize/2, eyeSize/2); // left eye color
        ellipse(eyeRX, height /2, eyeSize/2, eyeSize/2); // right eye color

    //eye pupils
        fill(0); //black pupils
        ellipse(eyeLX, height /2, pupSize, pupSize); // left eye pupil
        ellipse(eyeRX, height /2, pupSize, pupSize); // right eye pupil
    }

//eye type 2 - shut
    else if (eyeType == 2) {
        strokeWeight(2);
        stroke(230,145,20); //dark nude outline
        noFill();

    //LEFT EYE
        arc(eyeLX, height /2, eyeSize/2, eyeSize, 0, PI);

    //RIGHT EYE
        arc(eyeRX, height /2, eyeSize/2, eyeSize, 0, PI);
    }

//eye type 3 - sunglasses
    else {
        strokeWeight(4);
        stroke(250,145,164); //rim color hot pink
        fill(0); //glass of sunglasses is black

    //LEFT EYE SUNGLASSES
        rect(eyeLX - eyeSize/2, height /2 - eyeSize/2, eyeSize, eyeSize, 1);

    //RIGHT EYE SUNGLASSES
        rect(eyeRX - eyeSize/2, height /2 - eyeSize/2, eyeSize, eyeSize, 1);

    //LINE CONNECTION
        line(eyeLX + eyeSize/2, height /2 - eyeSize/4, eyeRX - eyeSize/2, height /2 - eyeSize/4);

    //GLARE
        strokeWeight(8);
        stroke(255);
        point(eyeLX + eyeSize /8, height /2 + eyeSize/4); //left eye
        point(eyeRX + eyeSize /8, height /2 + eyeSize/4); //right eye

    }

//MOUTH

    //local variable of MOUTH
var mouthX = width /2; //mouthX = horizontal coordinate of MOUTH
var mouthY = height /2 + (faceHeight/3); //mouthY = vertical coordinate of MOUTH

//mouth type 1 - surprised with tongue
    if (mouthType == 1) { 
        strokeWeight(2);
        stroke(225,0,37); //lip liner color - red
        fill(255);
        ellipse(mouthX, mouthY, mouthSize, mouthSize/2); //surprised

        //tongue
        noStroke();
        fill(255,144,159); //tongue color - pink
        ellipse(mouthX, mouthY + mouthSize/8, mouthSize/1.5, mouthSize/4); //tongue
    }

//mouth type 2 - smile
    else if (mouthType == 2) {
        noFill();
        strokeWeight(3);
        stroke(201,0,40); //lip liner color - red
        arc(mouthX, mouthY, mouthSize, mouthSize/2, 0, PI); //happy
    }

//mouth type 3 - frown
    else {
        stroke(94,53,0); //sad mouth color - dark brown
        strokeWeight(3);
        noFill();
        arc(mouthX, mouthY, mouthSize, mouthSize/2, PI, 0); //sad   
    }

}

function mousePressed() {
    // when the user clicks, these variables are reassigned
    // to random values within specified ranges. For example,
    // 'faceWidth' gets a random value between 75 and 150.

//CREATE RANDOM DIMENSIONS
    faceWidth = random(100, 400);
    faceHeight = random(100, 400);
    earSize = random(10, 80);
    eyeSize = random(10, 65);
    noseSize = random(10,50);
    pupSize = random(8,15);
    earringSize = random(20,60);

//CREATE RANDOM TYPES & OPTIONS
    noseType = random (1,3);
    noseType = round(noseType);

    hairType = random (1,3);
    hairType = round(hairType);

    eyeType = random (1,3);
    eyeType = round(eyeType);

    earringType = random (1,3);
    earringType = round(earringType);

    mouthType = random(1,3);
    mouthType = round(mouthType);

    backgroundType = random(1,3);
    backgroundType = round(backgroundType);


}

Looking Outwards 2 – Generative Art

Tracy — Sat, 10 Sep 2022 21:39:01 +0000

Title: Modular Lattice
Author: Marius Watz
Link: http://mariuswatz.com/2012/08/08/modular-lattice/

I am very interested in Marius Watz’ project called “Modular Lattice”, as I enjoy that it has a 3-dimensional component to it, unlike the typical 2-dimensional drawings. Being from an architecture background, I admire how these “forms” can almost be seen as structural. It would be interesting to see these 3D elements supporting buildings or even become the overall building form. I also admire that due to a change in set of parameters, these forms not only vary in the overall form, but the textile qualities (there seems to be various densities). Unfortunately I was not able to find much information on how these 3D elements are derived specifically, however with some knowledge in 3D generative modeling; I can assume that there are variables containing height, width, percentage of infill or number of faces that want to be generated in the final form. These variables can be changed or adjusted depending on specific parameters set. This perhaps allows an unlimited number of different generations of the form (however each are similar due to the same basic / standard elements). Marius Watz’ artistic sensibilities seem to manifest in the algorithm, as he tends to create very random and radially generated works. Therefore, there has to be something in the algorithm that connects to some origin point, with perhaps a randomizer function that allows unlimited possibilities but with parameters that the artist can set / control.

Project 01

Tracy — Fri, 09 Sep 2022 17:11:02 +0000

Here is me!

sketch

//Tracy Meng
//Section B

function setup() {
    createCanvas(600, 600);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
    //BACKGROUND
    background(225,246,255);        // light blue sky

    //CLOUDS
    noStroke();
    fill(255);                      // cloud color (white)
    circle(200,90,70);              // cloud 1
    circle(150,70,100);
    circle(100,90,80);
    circle(50,90,60);

    circle(340,180,80);             // cloud 2
    circle(400,160,120);
    circle(450,180,100);
    circle(500,180,90);
    circle(550,180,50);

    //HILLS
    fill(186,245,190);              // light green
    circle(150,550,300);            // hill 1
    circle(0,520,100);              // hill 2
    circle(450,520,200);            // hill 3
    circle(550,570,150);            // hill 4

    //TREES
    fill(104,193,110);              // dark green
    ellipse(50,500,70,300);         // tree 1
    ellipse(145,400,90,height);      // tree 2
    ellipse(480,500,70,500);        // tree 3

    //SHRUBS
    fill(77,235,87);                // light green 2
    ellipse(85,550,60,200);         // shrub 1
    ellipse(530,550,70,360);        // shrub 2

    //BACK OF HAIR
    fill(102,58,14);                // hair color (dark brown)
    rect(185,308,230,height);       

    //HAIR HIGHLIGHTS
    stroke(166,111,0);              // light brown
    strokeWeight(3);                // highlight thickness
    line(200,308,200,height);  
    line(240,308,240,height);
    line(225,308,225,432); 
    line(380,400,380,height);
    line(400,308,400,height);   

    //HEAD SHAPE
    noStroke();
    fill(255,220,177);              // skin color (nude)
    ellipse(width/2,height/2,220,250); // head shape & location

    //EARS
    fill(255,220,177);              // skin color (nude)
    ellipse(190,308,30,50);         // left ear
    ellipse(410,308,30,50);         // right ear

    //BODY
    //SHIRT
    fill(243,18,153);               // shirt color (hot pink)
    ellipse(width/2,490,250,100);   // shoulders
    quad(175,485,125,height,475,height,425,485); // rest of tshirt

    //SHIRT COLLAR
    noFill();                       
    stroke(255);                    // collar color (white)
    strokeWeight(10);
    arc(width/2,450,80,80,0,PI);

    //NECK
    noStroke();
    fill(255,220,177);              // skin color (nude)

    rect(260,410,80,35);  
    ellipse(width/2,450,80,80);     // neckline    

    //EAR HOLES
    noFill();
    strokeWeight(2);
    stroke(230,145,20);             // brown ear stroke
    arc(190,308,10,30,PI/2,PI/2+PI); // left hole
    arc(410,308,10,30,-PI/2,PI/2);   // right hole

    //CHIN DEFINITION
    arc(width/2,422,20,10,0,PI);

    //EARRINGS
    //LEFT TRIANGLE EARRING 
    strokeWeight(2);
    stroke(255,157,58);             // orange outline
    fill(255,239,0);                // gold 
    triangle(180,333,200,333,190,350);

    //RIGHT TRIANGLE EARRING
    triangle(400,333,420,333,410,350);

    //LEFT EARRING DANGLES 1
    strokeWeight(4);                // thicker orange outline
    fill(185,63,255);               // purple
    quad(190,350,170,365,190,385,210,365); 

    //RIGHT EARRING DANGLES 1
    quad(410,350,390,365,410,385,430,365); 

    //LEFT EARRING DANGLE 2
    noFill();
    stroke(0,233,194);              // teal dangle outline
    quad(190,385,180,395,190,410,200,395); 

    //RIGHT EARRING DANGLE 2
    quad(410,385,400,395,410,410,420,395); 

    //SUNGLASSES
    //FRAME + LENSES
    stroke(250,145,164);            // rim color (pink)
    strokeWeight(8);                // rim thickness
    fill(28,28,28);                 // lenses color (dark grey)
    rect(220,260,65,65,10);         // rectangle lense 1 (left)
    rect(315,260,65,65,10);         // rectangle lense 2 (right)

    line(285,295,315,295);          // connect rims
    line(220,295,195,295);          // left band
    line(380,295,405,295);          // right band

    //PEARLS
    strokeWeight(4);                // thickness of point
    stroke(255);                    // pearl color (white)
    point(230,260);                 // top left rim
    point(240,260);
    point(250,260);
    point(260,260);
    point(270,260);

    point(230,325);                 // bottom - left rim
    point(240,325);
    point(250,325);
    point(260,325);
    point(270,325);

    point(220,275);                 // left - left rim
    point(220,285);
    point(220,295);
    point(220,305);
    point(220,315);

    point(285,275);                 // right - left rim
    point(285,285);
    point(285,295);
    point(285,305);
    point(285,315);

    point(330,260);                 // top - right rim
    point(340,260);
    point(350,260);
    point(360,260);
    point(370,260);

    point(330,325);                 // bottom - right rim
    point(340,325);
    point(350,325);
    point(360,325);
    point(370,325);

    point(315,275);                 // left - right rim
    point(315,285);
    point(315,295);
    point(315,305);
    point(315,315);

    point(380,275);                 // right - right rim
    point(380,285);
    point(380,295);
    point(380,305);
    point(380,315);

    //GLARE LINES
    stroke(238,238,255);            // glare color (grey - white)
    strokeWeight(3);                // glare thickness
    line(242,304,264,282);          // glare left
    line(337,304,359,282);          // glare right

    //NOSE
    noFill();
    stroke(230,145,20);             // brown nose stroke
    strokeWeight(2);                // nose stroke weight
 
    arc(290,350,20,20,PI/2,PI/2+PI) // arc left: PI = Half of a circle
    arc(310,350,20,20,-PI/2,PI/2);  // arc right: PI = Half of a circle

    line(290,340,290,322);          // nose line left
    line(310,340,310,322);          // nose line right

    //NOSTRILS
    noStroke();
    fill(222,171,95);               // light brown
    ellipse(292,353,10,5);          // left nostril
    ellipse(308,353,10,5);          // right nostril

    //LIPS
    //BOTTOM LIP
    stroke(255,122,162);            // lip liner color
    fill(255,132,168);              // lip color (light red)

    ellipse(width/2,390,25,15);

    //TOP LIP
    noStroke();
    fill(255,78,132);               // lip color (deep red)


    ellipse(292,385,27,13);         // left side
    ellipse(308,385,27,13);         // right side

    //MAKEUP HIGHLIGHT
    //LIP SPARKLE
    stroke(255,238,210);            // sparkle color
    strokeWeight(5);                // sparkle thickness
    point(width/2,376);             // top sparkle
    point(width/2,402);             // bottom sparkle

    //NOSE SPARKLE
    line(width/2,340,width/2,322);

    //ROSY CHEEKS
    noStroke();
    fill(255,200,228);              // rose
    ellipse(245,340,60,20);         // blush left
    ellipse(355,340,60,20);         // blush right
      
    //HAIR BANGS
    stroke(166,111,0);              // light brown stroke (match highlight)
    strokeWeight(3);
    fill(102,58,14);                // bangs color (dark brown)  
    point(220,220);                 // left
    point(380,220);                 // right

    bezier(300,175,120,180,250,300,150,430); // left bangs
    bezier(300,175,480,180,350,300,450,430); // right bangs   

    //HIGHLIGHT BANGS
    //LEFT
    bezier(280,195,150,200,260,320,170,400);

    //RIGHT
    bezier(320,195,450,200,340,320,430,400);


 

}

LO: My Inspiration

Tracy — Wed, 07 Sep 2022 04:56:09 +0000

Title: Threads
Author: Bill Ralph
Link: https://billralph.com/threads/

Bill Ralph is a mathematician, artist and professor at Brock University in Canada. He is interested in the intersection of math and art, as his pieces are made entirely from mathematical scripts and formulas transformed into computer code. He creates his artworks using a loop and randomizing system, which can continuously auto generate variations of his pieces within minutes. He is greatly influenced and inspired by the works of Leonardo da Vinci, such as Vitruvian Man, Mona Lisa and the Last Supper. They both share the belief that there is no art without mathematical logic. I believe his work and approach have a lot of future potential in terms of AI generated art. If any imagery can be translated into a mathematical algorithm and be manipulatable by simply changing parameters, an unlimited amount of artwork and its variations can be generated within seconds. I am a huge fan of his pieces because at first they look creative, abstract and random without any logic at all. I could not tell that there is an entire mathematical system behind each piece. The viewer would assume that he is a typical abstract artist and will draw in an uncontrolled, fluid motion. However it is actually quite the opposite, he strategically knows exactly what shapes he’ll create and the exact position of them.

Project 01

Tracy — Wed, 07 Sep 2022 03:40:48 +0000

This is my project of my self portrait.

sketch

//Tracy Meng
//Section B

function setup() {
    createCanvas(600, 600);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
}

function draw() {
    //BACKGROUND
    background(225,246,255);        // light blue sky

    //CLOUDS
    noStroke();
    fill(255);                      // cloud color (white)
    circle(200,90,70);              // cloud 1
    circle(150,70,100);
    circle(100,90,80);
    circle(50,90,60);

    circle(340,180,80);             // cloud 2
    circle(400,160,120);
    circle(450,180,100);
    circle(500,180,90);
    circle(550,180,50);

    //HILLS
    fill(186,245,190);              // light green
    circle(150,550,300);            // hill 1
    circle(0,520,100);              // hill 2
    circle(450,520,200);            // hill 3
    circle(550,570,150);            // hill 4

    //TREES
    fill(104,193,110);              // dark green
    ellipse(50,500,70,300);         // tree 1
    ellipse(145,400,90,height);      // tree 2
    ellipse(480,500,70,500);        // tree 3

    //SHRUBS
    fill(77,235,87);                // light green 2
    ellipse(85,550,60,200);         // shrub 1
    ellipse(530,550,70,360);        // shrub 2

    //BACK OF HAIR
    fill(102,58,14);                // hair color (dark brown)
    rect(185,308,230,height);       

    //HAIR HIGHLIGHTS
    stroke(166,111,0);              // light brown
    strokeWeight(3);                // highlight thickness
    line(200,308,200,height);  
    line(240,308,240,height);
    line(225,308,225,432); 
    line(380,400,380,height);
    line(400,308,400,height);   

    //HEAD SHAPE
    noStroke();
    fill(255,220,177);              // skin color (nude)
    ellipse(width/2,height/2,220,250); // head shape & location

    //EARS
    fill(255,220,177);              // skin color (nude)
    ellipse(190,308,30,50);         // left ear
    ellipse(410,308,30,50);         // right ear

    //BODY
    //SHIRT
    fill(243,18,153);               // shirt color (hot pink)
    ellipse(width/2,490,250,100);   // shoulders
    quad(175,485,125,height,475,height,425,485); // rest of tshirt

    //SHIRT COLLAR
    noFill();                       
    stroke(255);                    // collar color (white)
    strokeWeight(10);
    arc(width/2,450,80,80,0,PI);

    //NECK
    noStroke();
    fill(255,220,177);              // skin color (nude)

    rect(260,410,80,35);  
    ellipse(width/2,450,80,80);     // neckline    

    //EAR HOLES
    noFill();
    strokeWeight(2);
    stroke(230,145,20);             // brown ear stroke
    arc(190,308,10,30,PI/2,PI/2+PI); // left hole
    arc(410,308,10,30,-PI/2,PI/2);   // right hole

    //CHIN DEFINITION
    arc(width/2,422,20,10,0,PI);

    //EARRINGS
    //LEFT TRIANGLE EARRING 
    strokeWeight(2);
    stroke(255,157,58);             // orange outline
    fill(255,239,0);                // gold 
    triangle(180,333,200,333,190,350);

    //RIGHT TRIANGLE EARRING
    triangle(400,333,420,333,410,350);

    //LEFT EARRING DANGLES 1
    strokeWeight(4);                // thicker orange outline
    fill(185,63,255);               // purple
    quad(190,350,170,365,190,385,210,365); 

    //RIGHT EARRING DANGLES 1
    quad(410,350,390,365,410,385,430,365); 

    //LEFT EARRING DANGLE 2
    noFill();
    stroke(0,233,194);              // teal dangle outline
    quad(190,385,180,395,190,410,200,395); 

    //RIGHT EARRING DANGLE 2
    quad(410,385,400,395,410,410,420,395); 

    //SUNGLASSES
    //FRAME + LENSES
    stroke(250,145,164);            // rim color (pink)
    strokeWeight(8);                // rim thickness
    fill(28,28,28);                 // lenses color (dark grey)
    rect(220,260,65,65,10);         // rectangle lense 1 (left)
    rect(315,260,65,65,10);         // rectangle lense 2 (right)

    line(285,295,315,295);          // connect rims
    line(220,295,195,295);          // left band
    line(380,295,405,295);          // right band

    //PEARLS
    strokeWeight(4);                // thickness of point
    stroke(255);                    // pearl color (white)
    point(230,260);                 // top left rim
    point(240,260);
    point(250,260);
    point(260,260);
    point(270,260);

    point(230,325);                 // bottom - left rim
    point(240,325);
    point(250,325);
    point(260,325);
    point(270,325);

    point(220,275);                 // left - left rim
    point(220,285);
    point(220,295);
    point(220,305);
    point(220,315);

    point(285,275);                 // right - left rim
    point(285,285);
    point(285,295);
    point(285,305);
    point(285,315);

    point(330,260);                 // top - right rim
    point(340,260);
    point(350,260);
    point(360,260);
    point(370,260);

    point(330,325);                 // bottom - right rim
    point(340,325);
    point(350,325);
    point(360,325);
    point(370,325);

    point(315,275);                 // left - right rim
    point(315,285);
    point(315,295);
    point(315,305);
    point(315,315);

    point(380,275);                 // right - right rim
    point(380,285);
    point(380,295);
    point(380,305);
    point(380,315);

    //GLARE LINES
    stroke(238,238,255);            // glare color (grey - white)
    strokeWeight(3);                // glare thickness
    line(242,304,264,282);          // glare left
    line(337,304,359,282);          // glare right

    //NOSE
    noFill();
    stroke(230,145,20);             // brown nose stroke
    strokeWeight(2);                // nose stroke weight
 
    arc(290,350,20,20,PI/2,PI/2+PI) // arc left: PI = Half of a circle
    arc(310,350,20,20,-PI/2,PI/2);  // arc right: PI = Half of a circle

    line(290,340,290,322);          // nose line left
    line(310,340,310,322);          // nose line right

    //NOSTRILS
    noStroke();
    fill(222,171,95);               // light brown
    ellipse(292,353,10,5);          // left nostril
    ellipse(308,353,10,5);          // right nostril

    //LIPS
    //BOTTOM LIP
    stroke(255,122,162);            // lip liner color
    fill(255,132,168);              // lip color (light red)

    ellipse(width/2,390,25,15);

    //TOP LIP
    noStroke();
    fill(255,78,132);               // lip color (deep red)


    ellipse(292,385,27,13);         // left side
    ellipse(308,385,27,13);         // right side

    //MAKEUP HIGHLIGHT
    //LIP SPARKLE
    stroke(255,238,210);            // sparkle color
    strokeWeight(5);                // sparkle thickness
    point(width/2,376);             // top sparkle
    point(width/2,402);             // bottom sparkle

    //NOSE SPARKLE
    line(width/2,340,width/2,322);

    //ROSY CHEEKS
    noStroke();
    fill(255,200,228);              // rose
    ellipse(245,340,60,20);         // blush left
    ellipse(355,340,60,20);         // blush right
      
    //HAIR BANGS
    stroke(166,111,0);              // light brown stroke (match highlight)
    strokeWeight(3);
    fill(102,58,14);                // bangs color (dark brown)  
    point(220,220);                 // left
    point(380,220);                 // right

    bezier(300,175,120,180,250,300,150,430); // left bangs
    bezier(300,175,480,180,350,300,450,430); // right bangs   

    //HIGHLIGHT BANGS
    //LEFT
    bezier(280,195,150,200,260,320,170,400);

    //RIGHT
    bezier(320,195,450,200,340,320,430,400);


 

}