{"id":71253,"date":"2022-09-10T21:09:00","date_gmt":"2022-09-11T01:09:00","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/?p=71253"},"modified":"2022-09-10T21:09:00","modified_gmt":"2022-09-11T01:09:00","slug":"variable-face-2","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/10\/variable-face-2\/","title":{"rendered":"Variable Face"},"content":{"rendered":"\n

I liked uncovering the associations across each variable and being able to articulate those connections in writing to make illustrations. I learned the value of arranging my code and adding required comments for specific lines to help me remember important information when I was making two figures on one canvas.<\/p>\n\n\n\n

\"\" — Ideation <\/figcaption><\/figure>
sketch<\/a><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">var eyeSize = 40;\nvar faceWidth = 100;\nvar faceHeight = 150;\nvar diam = 40;\nvar lipw = 40;\nvar liph = 25;\nvar lipr = 50;\nvar on = false;\nvar r = 102; \/\/ values of gray\nvar g = 102; \nvar b = 102;\nvar eyeType = 2\n\nfunction setup() {\n createCanvas(480, 640);\n\n}\n\nfunction draw() {\n background(204, 229, 255);\n\n fill(0, 0, 0);\n stroke(0, 0, 0);\n ellipse((width\/2), (height\/2), 200, 250); \/\/ hair \n\n fill(0, 0, 0);\n stroke(0, 0, 0);\n rect((width\/2.9), (height\/2.6), 150, 200); \/\/ hair\n \n if (on == true) { \/\/ stating the color change in the hair\n fill(r, g, b );\n stroke(r, g, b);\n ellipse((width\/2), (height\/2), 200, 250);\n rect((width\/2.9), (height\/2.6), 150, 210); \n } else {\n fill(255-r, 255-g, 255-b);\n stroke(255-r, 255-g, 255-b);\n ellipse((width\/2), (height\/2), 200, 250);\n rect((width\/2.9), (height\/2.6), 150, 210);\n }\n\n fill (215, 180, 146);\n stroke(215, 180, 146);\n ellipse(width\/2, height\/2, faceWidth, faceHeight); \/\/ variable faces\n\n\n stroke (195, 43, 79);\n strokeWeight(1);\n fill(195, 43, 79);\n arc((width\/2) - 5, (height\/2)+40, lipw, liph, lipr, PI + QUARTER_PI); \/\/ different mouth expressions\n\n stroke(0, 0, 0);\n line((width\/2)-35, (height\/2)-35, (width\/2)-10, (height\/2)-35);\n line((width\/2) + 35, (height\/2)-35, (width\/2)+ 10, (height\/2)-35);\/\/ static eyebrows\n\n \n var eyeLX = width \/ 2 - faceWidth * 0.25;\n var eyeRX = width \/ 2 + faceWidth * 0.25;\n \n fill (0,0,0);\n stroke (0, 0, 0);\n ellipse(eyeLX, height \/ 2, diam, diam);\n ellipse(eyeRX, height \/ 2, diam, diam);\n\n if(eyeType > 1 & eyeType < 2) { \/\/altering between two eye types \n fill(0, 0, 0);\n\n } else {\n fill(255, 255, 255);\n }\n ellipse((width\/2)-(faceWidth\/4), height\/2, 40, 30);\n ellipse((width\/2)+(faceWidth\/4), height\/2, 40, 30);\n \n if(eyeType > 1 & eyeType < 2) { \n fill(255, 255, 255);\n } else {\n fill(0, 0, 0);\n }\n ellipse((width\/2)-(faceWidth\/4), (height\/2)+7, 20, 10);\n ellipse((width\/2)+(faceWidth\/4), (height\/2)+7, 20, 10);\n\n}\n\nfunction mousePressed() {\n faceWidth = random(50, 150);\n faceHeight = random(150, 250);\n lipw = random (20, 50);\n liph = random (10, 30);\n lipr = random (40, 60);\n eyeType = random(0,2);\n\n \n if (on == false) { \/\/ color flip using boolean \n on = true;\n } else {\n on = false;\n }\n \n}\n\n\n\n\n<\/code><\/pre><\/div><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>I liked uncovering the associations across each variable and being able to articulate those connections in writing to make illustrations. I learned the value of arranging my code and adding required comments for specific lines to help me remember important information when I was making two figures on one canvas.<\/p>\n","protected":false},"author":696,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/71253"}],"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\/696"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=71253"}],"version-history":[{"count":4,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/71253\/revisions"}],"predecessor-version":[{"id":71271,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/71253\/revisions\/71271"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=71253"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=71253"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=71253"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}