{"id":65559,"date":"2021-09-11T17:37:50","date_gmt":"2021-09-11T21:37:50","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/?p=65559"},"modified":"2021-09-11T17:37:50","modified_gmt":"2021-09-11T21:37:50","slug":"project-2-variable-faces-5","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/09\/11\/project-2-variable-faces-5\/","title":{"rendered":"Project 2: Variable Faces"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<html><body><div class=\"wp-block-file\"><a>sketch<\/a><a class=\"p5_sketch_link\" data-width=\"480\" data-height=\"640\" href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/09\/sketch-94.js\" download>Download<\/a><iframe src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/plugins\/p5-embedder\/p5_iframe.html\" class=\"p5_exampleFrame\" width=\"480\" height=\"640\"><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">var eyeSize = 35;\nvar faceWidth = 250;\nvar faceHeight = 290;\nvar face = 1; \/\/1 = happy, 2 = surprised, 3 = sad\n\nfunction setup() {\n    createCanvas(480, 640);\n}\n\nfunction draw() {\n    background(200);\n    strokeWeight(0);\n    fill(231, 198, 142);\n    ellipse(width\/2, height\/2, faceWidth, faceHeight);\n    var eyeLX = width \/ 2 - faceWidth * 0.25;\n    var eyeRX = width \/ 2 + faceWidth * 0.25;\n    var pupilLX = width \/ 2 - faceWidth * 0.25;\n    var pupilRX = width \/ 2 + faceWidth * 0.25\n    var noseLx = width \/ 2 - faceWidth * 0.15;\n    var noseRx = width \/ 2 + faceWidth * 0.15;\n    var nosey = height \/ 2 + faceWidth * 0.25;\n    var cheekL = width \/ 2 - faceWidth * 0.3;\n    var cheekR = width \/ 2 + faceWidth * 0.3;\n    var hairL = width \/ 2 - faceWidth * 0.75;\n    var hairR = width \/ 2 + faceWidth * 0.45;\n    var earLx = hairL + faceWidth * 0.27; \n    var earLy = height \/ 2;\n    var earRx = hairL + faceWidth * 1.23;\n    var earRy = height \/ 2;\n    fill(250); \/\/left eye\n    ellipse(pupilLX, height \/ 2.1, eyeSize * 1.7, eyeSize);\n    fill(250); \/\/right eye\n    ellipse(pupilRX, height \/ 2.1, eyeSize * 1.7, eyeSize);\n    fill(0); \/\/left eye\n    ellipse(eyeLX, height \/ 2.1, eyeSize, eyeSize);\n    fill(0); \/\/right eye\n    ellipse(eyeRX, height \/ 2.1, eyeSize, eyeSize);\n    fill(202, 176, 131); \/\/nose\n    triangle(width \/ 2, height \/ 2 - faceWidth * 0.1, noseLx, nosey, noseRx, nosey);\n    if (face == 1 || face == 2) {\n        fill(250, 148, 178); \/\/cheeks\n        ellipse(cheekL, height \/ 1.8, eyeSize * 1.4, eyeSize * 1.4);\n        ellipse(cheekR, height \/ 1.8, eyeSize * 1.4, eyeSize *1.4);\n    } else {\n        fill(95, 175, 211); \/\/tears\n        ellipse(cheekL, height \/ 1.8, eyeSize * 0.5, eyeSize * 1.4);\n        ellipse(cheekR, height \/ 1.8, eyeSize * 0.5, eyeSize *1.4);\n    }  \n    fill(77, 48, 26); \/\/hair\n    rect(hairL, height\/3.5, faceWidth * 0.3, faceHeight * 1.3);\n    rect(hairR, height\/3.5, faceWidth * 0.3, faceHeight * 1.3);\n    rect(hairL, height\/3.8, faceWidth * 1.5, faceHeight * 0.3);\n    fill(231, 198, 142); \/\/ears\n    ellipse(earLx, earLy, faceWidth * 0.1, faceHeight * 0.15);\n    ellipse(earRx, earRy, faceWidth * 0.1, faceHeight * 0.15);\n    if (face == 1) {\n        fill(250, 148, 178); \/\/mouth\n        arc(width \/ 2, height \/ 2 + faceWidth * 0.35, 120, 70, 2 * PI, PI, OPEN);\n    } else if (face == 2) {\n        fill(250, 148, 178); \/\/mouth\n        ellipse(width\/2, height \/2 + faceWidth * 0.4, eyeSize * 2, eyeSize * 1.4);\n    } else {\n        fill(250, 148, 178); \/\/mouth\n        arc(width \/ 2, height \/ 2 + faceWidth * 0.45, 120, 70, PI, 2 * PI, OPEN);\n    }\n}\n\nfunction mousePressed() {\n    if (face == 1) {\n        face = 2;\n    } else if (face == 2) {\n        face = 3;\n    } else {\n        face = 1;\n    }\n}<\/code><\/pre><\/div>\n\n\n\n<p>I really enjoyed making this because it was the first time using variables and the mousepressed function. I was really satisfied when I got the function to work.<\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>sketchDownload var eyeSize = 35; var faceWidth = 250; var faceHeight = 290; var face = 1; \/\/1 = happy, 2 = surprised, 3 = sad function setup() { createCanvas(480, 640); } function draw() { background(200); strokeWeight(0); fill(231, 198, 142); ellipse(width\/2, height\/2, faceWidth, faceHeight); var eyeLX = width \/ 2 &#8211; faceWidth * 0.25; var &hellip; <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/09\/11\/project-2-variable-faces-5\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Project 2: Variable Faces&#8221;<\/span><\/a><\/p>\n","protected":false},"author":643,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[97,58],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/65559"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/users\/643"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/comments?post=65559"}],"version-history":[{"count":3,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/65559\/revisions"}],"predecessor-version":[{"id":65563,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/65559\/revisions\/65563"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/media?parent=65559"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/categories?post=65559"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/tags?post=65559"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}