{"id":70961,"date":"2022-09-10T14:38:56","date_gmt":"2022-09-10T18:38:56","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/?p=70961"},"modified":"2022-09-10T14:39:53","modified_gmt":"2022-09-10T18:39:53","slug":"project-02-2","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/10\/project-02-2\/","title":{"rendered":"Project 02"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<html><body><p>Variable Face<\/p>\n\n\n\n<div class=\"wp-block-file\"><a class=\"p5_sketch_link\" data-width=\"1000\" data-height=\"1000\" id=\"wp-block-file--media-94c19e61-ec81-4f8c-be61-2a51043e077e\" href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/uploads\/2022\/09\/sketch-143.js\">sketch<\/a><a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/uploads\/2022\/09\/sketch-143.js\" class=\"wp-block-file__button\" download aria-describedby=\"wp-block-file--media-94c19e61-ec81-4f8c-be61-2a51043e077e\">Download<\/a><iframe src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/plugins\/p5-embedder\/p5_iframe.html\" class=\"p5_exampleFrame\" width=\"1000\" height=\"1000\"><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/\/ Ilia Urgen\n\/\/ Section B\n\n\/\/background color\nvar r = 128;\nvar g = 235;\nvar b = 255;\n\n\/\/shirt color\nvar r1 = 217;\nvar g1 = 0;\nvar b1 = 0;\n\nvar faceWidth = 480;\nvar faceHeight = 660;\n\nvar neckWidth = 250; \n\nvar eyebrowHeight = 518;\nvar eyebrowThickness = 30;\n\nvar eyeDiameter = 60;\n\nvar eyeCenterX1 = 400;\nvar eyeCenterY1 = 575;\nvar eyeCenterX2 = 600;\n\n\/\/nose width coordinates\nvar noseX = 500;\nvar noseY = 540;\n\nvar mouth = 3;\n\nfunction setup() {\n    createCanvas (1000, 1000);\n}                                   \n                                    \nfunction draw() {                   \n    background (r, g, b);\n\n    \/\/neck outline\n    noStroke();\n    fill (243, 207, 187);\n    rect (375, 500, neckWidth, 800);        \n    \n    \/\/face outline                      \n    ellipse (500, 600, faceWidth, faceHeight);  \n\n    \/\/left ear\n    arc (500-(faceWidth\/2)-15,620,80,160,PI + HALF_PI,PI + HALF_PI);  \n    \n    \/\/right ear\n    arc (500+(faceWidth\/2)+15,620,80,160,PI + HALF_PI,PI + HALF_PI);  \n\n    \/\/left eye\n    fill (0,0,0); \/\/black\n    ellipse (eyeCenterX1, eyeCenterY1, eyeDiameter + 50, eyeDiameter);  \n    fill (255,255,255); \/\/white\n    ellipse (eyeCenterX1, eyeCenterY1, eyeDiameter + 30, eyeDiameter); \n    fill (102,51,0); \/\/brown\n    ellipse (eyeCenterX1, eyeCenterY1, eyeDiameter, eyeDiameter);\n    fill (0,0,0); \/\/black\n    ellipse (eyeCenterX1, eyeCenterY1,12,12);\n    fill (255,255,255); \/\/white\n    ellipse (eyeCenterX1, eyeCenterY1,5,5);\n\n    \/\/right eye\n    fill (0,0,0); \/\/black\n    ellipse (eyeCenterX2, eyeCenterY1, eyeDiameter + 50, eyeDiameter);\n    fill (255,255,255); \/\/white\n    ellipse (eyeCenterX2, eyeCenterY1, eyeDiameter + 30, eyeDiameter);\n    fill (102,51,0); \/\/brown\n    ellipse (eyeCenterX2, eyeCenterY1, eyeDiameter, eyeDiameter);\n    fill (0,0,0); \/\/black\n    ellipse (eyeCenterX2, eyeCenterY1,12,12);\n    fill (255,255,255); \/\/white\n    ellipse (eyeCenterX2, eyeCenterY1,5,5);\n\n    \/\/nose\n    fill (240,190,180);\n    triangle (noseX - 50,700,500,noseY,noseX + 50,700);\n    \n    \/\/t-shirt                                                              \n    fill (r1,g1,b1);                                              \n    quad (500-(neckWidth\/2),920,200,1000,800,1000,500+(neckWidth\/2),920);\n\n    \/\/left eyebrow\n    noFill();\n    strokeWeight (eyebrowThickness);\n    stroke (55,39,45);\n    arc (400,eyebrowHeight,120,30,PI,0);\n\n    \/\/right eyebrow\n    arc (600,eyebrowHeight,120,30,PI,0);\n\n    \/\/mouth\n    noFill();\n    strokeWeight (35);\n    stroke (193,104,115);\n    \n    \/\/sad face\n    if (mouth == 1) { \n        arc (500,785,180,40,PI,0);\n    }\n\n    \/\/happy face\n    else if (mouth == 2) {\n        arc (500,775,180,40,0, PI);\n    }\n\n    \/\/shocked face\n    else if (mouth == 3) {\n        fill (255);\n        stroke (255);\n        ellipse (500,790,115,10);\n\n        noFill();\n        strokeWeight (35);\n        stroke (193,104,115);\n        arc (500,770,180,40,PI,0);\n        arc (500,780,180,40,0, PI);\n    }\n\n    \/\/ear lines\n    noFill();\n    stroke (55,39,45);\n    strokeWeight (2);\n\n    arc (500-(faceWidth\/2)-20,625,30,100,HALF_PI, PI + HALF_PI);\n    arc (500+(faceWidth\/2)+20,625,30,100,PI + HALF_PI, HALF_PI);\n\n    \/\/hair\n    strokeWeight (eyebrowThickness);\n\n    line (300,660-(faceHeight\/2.5),100,(faceHeight\/2)-20);\n    line (310,660-(faceHeight\/2.5),120,(faceHeight\/2)-25);\n    line (320,660-(faceHeight\/2.5),140,(faceHeight\/2)-30);\n\n    line (330,660-(faceHeight\/2.5),160,(faceHeight\/2)-35);\n    line (340,660-(faceHeight\/2.5),180,(faceHeight\/2)-40);\n    line (350,660-(faceHeight\/2.5),200,(faceHeight\/2)-45);\n\n    line (360,660-(faceHeight\/2.5),220,(faceHeight\/2)-50);\n    line (370,660-(faceHeight\/2.5),240,(faceHeight\/2)-55);\n    line (380,660-(faceHeight\/2.5),260,(faceHeight\/2)-60);\n\n    line (390,660-(faceHeight\/2.5),280,(faceHeight\/2)-65);\n    line (400,660-(faceHeight\/2.5),300,(faceHeight\/2)-70);\n    line (410,660-(faceHeight\/2.5),320,(faceHeight\/2)-75);\n\n    line (420,660-(faceHeight\/2.5),340,(faceHeight\/2)-80);\n    line (430,660-(faceHeight\/2.5),360,(faceHeight\/2)-85);\n    line (440,660-(faceHeight\/2.5),380,(faceHeight\/2)-90);\n\n    line (450,660-(faceHeight\/2.5),400,(faceHeight\/2)-95);\n    line (460,660-(faceHeight\/2.5),420,(faceHeight\/2)-100);\n    line (470,660-(faceHeight\/2.5),440,(faceHeight\/2)-105);\n\n    line (480,660-(faceHeight\/2.5),460,(faceHeight\/2)-110);\n    line (490,660-(faceHeight\/2.5),480,(faceHeight\/2)-115);\n    \n    line (500,660-(faceHeight\/2.5),500,(faceHeight\/2)-120);\n    \n    line (510,660-(faceHeight\/2.5),520,(faceHeight\/2)-115);\n    line (520,660-(faceHeight\/2.5),540,(faceHeight\/2)-110);\n\n    line (530,660-(faceHeight\/2.5),560,(faceHeight\/2)-105);\n    line (540,660-(faceHeight\/2.5),580,(faceHeight\/2)-100);\n    line (550,660-(faceHeight\/2.5),600,(faceHeight\/2)-95);\n\n    line (560,660-(faceHeight\/2.5),620,(faceHeight\/2)-90);\n    line (570,660-(faceHeight\/2.5),640,(faceHeight\/2)-85);\n    line (580,660-(faceHeight\/2.5),660,(faceHeight\/2)-80);\n\n    line (590,660-(faceHeight\/2.5),680,(faceHeight\/2)-75);\n    line (600,660-(faceHeight\/2.5),700,(faceHeight\/2)-70);\n    line (610,660-(faceHeight\/2.5),720,(faceHeight\/2)-65);\n\n    line (620,660-(faceHeight\/2.5),740,(faceHeight\/2)-60);\n    line (630,660-(faceHeight\/2.5),760,(faceHeight\/2)-55);\n    line (640,660-(faceHeight\/2.5),780,(faceHeight\/2)-50);\n\n    line (650,660-(faceHeight\/2.5),800,(faceHeight\/2)-45);\n    line (660,660-(faceHeight\/2.5),820,(faceHeight\/2)-40);\n    line (670,660-(faceHeight\/2.5),840,(faceHeight\/2)-35);\n\n    line (680,660-(faceHeight\/2.5),860,(faceHeight\/2)-30);\n    line (690,660-(faceHeight\/2.5),880,(faceHeight\/2)-25);\n    line (700,660-(faceHeight\/2.5),900,(faceHeight\/2)-20);\n\n}\n\nfunction mousePressed() {\n    \n    \/\/background color\n    r = random (0,255);\n    g = random (0,255);\n    b = random (0,255);\n\n    \/\/shirt color\n    r1 = random (0,255);\n    g1 = random (0,255);\n    b1 = random (0,255);\n\n    faceWidth = random (400, 900);\n    faceHeight = random (400, 800);\n\n    eyebrowThickness = random (10,50);\n    eyebrowHeight = random (500, 545);\n\n    eyeDiameter = random (20,80);\n    eyeCenterY1 = random (570,600);\n\n    \/\/nose width coordinates\n    noseX = random (480,520);\n    noseY = random (500,590);\n\n    \/\/mouth option 1,2, or 3\n    mouth = int(random (1,4));\n}\n<\/code><\/pre><\/div><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>Variable Face<\/p>\n","protected":false},"author":765,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[97,56],"tags":[82,81],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/70961"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/users\/765"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=70961"}],"version-history":[{"count":2,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/70961\/revisions"}],"predecessor-version":[{"id":70968,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/70961\/revisions\/70968"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=70961"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=70961"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=70961"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}