{"id":65637,"date":"2021-09-11T20:47:57","date_gmt":"2021-09-12T00:47:57","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/?p=65637"},"modified":"2021-09-19T18:34:32","modified_gmt":"2021-09-19T22:34:32","slug":"project-2-variable-faces-11","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/09\/11\/project-2-variable-faces-11\/","title":{"rendered":"Project 2: Variable Faces"},"content":{"rendered":"\n

sketch<\/a><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/\/ Simple beginning template for variable face.\nvar eyeSize = 20;\nvar faceWidth = 100;\nvar faceHeight = 150;\nvar noseWidth = 15;\nvar noseHeight = 15;\nvar mouthWidth = 20;\nvar mouthHeight = 20;\nvar eyebrowHeight = 20;\nvar eyebrowWidth = 40;\nvar fillFaceR = 200\nvar fillFaceG = 200\nvar fillFaceB = 200\nvar filleyeR = 200\nvar filleyeG = 200\nvar filleyeB = 200\nvar fillMouthR = 200\nvar fillMouthG = 200\nvar fillMouthB = 200\nvar fillBrowR = 200\nvar fillBrowG = 200\nvar fillBrowB = 200\nvar fillHairR = 200\nvar fillHairG = 200\nvar fillHairB = 200\n\n\nfunction setup() {\n createCanvas(640, 480);\n}\n\nfunction draw() {\n background(255, 242, 242);\n strokeWeight(0);\n fill(fillFaceR, fillFaceG, fillFaceB);\n ellipse(width \/ 2, height \/ 2, faceWidth, faceHeight);\n strokeWeight(0);\n fill(0);\n var eyeLX = width \/ 2 - faceWidth * 0.25;\n var eyeRX = width \/ 2 + faceWidth * 0.25;\n ellipse(eyeLX, height \/ 2, eyeSize, eyeSize);\n ellipse(eyeRX, height \/ 2, eyeSize, eyeSize);\n fill(166, 83, 83)\n ellipse(width\/2, 250, noseWidth, noseHeight);\n \/\/nose\n fill(fillMouthR, fillMouthG, fillMouthB);\n ellipse(width\/2, 280, mouthWidth, mouthHeight);\n \/\/mouth function\n fill(fillBrowR, fillBrowG, fillBrowB);\n var eyebrowLX = width \/ 2 - faceWidth * 0.5 \n \/\/Left eyebrow variable thing\n var eyebrowRX = width \/ 2 + faceWidth * 0.52\n \/\/Right eyebrow variable thing\n rect(eyebrowLX, height \/ 2 - 20, eyebrowWidth, eyebrowHeight);\n \/\/Left Eyebrow\n rect(eyebrowRX - 40, height \/ 2 - 20, eyebrowWidth, eyebrowHeight);\n \/\/Right Eyebrow\n strokeWeight(0);\n fill(fillFaceR, fillFaceG, fillFaceB);\n rect(width \/ 2 - 17, 265, 35, 15)\n \/\/this is the rectangle that makes the mouth into a smile\n strokeWeight(0);\n fill(fillHairR, fillHairG, fillHairB);\n ellipse(width \/ 2, height \/ 3 + 10, 40, 40)\n \/\/this is the hair bun\n\n\n\n}\n\nfunction mousePressed() {\n \/\/ when the user clicks, these variables are reassigned\n \/\/ to random values within specified ranges. For example,\n \/\/ 'faceWidth' gets a random value between 75 and 150.\n faceHeight = random(120, 150);\n eyeSize = random(10, 30);\n noseWidth = random(5, 12);\n noseHeight = random(5, 12);\n mouthWidth = random(15, 35);\n mouthHeight = random(5, 25);\n eyebrowHeight = random(6, 20);\n eyebrowWidth = random(30, 45);\n fillFaceR = random(70, 255);\n fillFaceB = random(70, 150);\n fillFaceG = random(70, 150);\n filleyeR = random(10, 100);\n filleyeG = random(10, 100);\n filleyeB = random(10, 100);\n fillMouthR = random(150, 255);\n fillMouthG = random(1, 50);\n fillMouthB = random(1, 50);\n fillBrowR = random(0, 100);\n fillBrowG = random(0, 100);\n fillBrowB = random(0, 1255);\n fillHairR = random(0, 255);\n fillHairG = random(0, 100);\n fillHairB = random(0, 255);\n}<\/code><\/pre><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p>My main challenges were trying to place the eyebrows correctly, and getting the colors correct. I think starting was also a bit difficult, but once I got use to using global variables a bit more it got easier.<\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>My main challenges were trying to place the eyebrows correctly, and getting the colors correct. I think starting was also a bit difficult, but once I got use to using global variables a bit more it got easier.<\/p>\n","protected":false},"author":655,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[97,57],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/65637"}],"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\/655"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/comments?post=65637"}],"version-history":[{"count":2,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/65637\/revisions"}],"predecessor-version":[{"id":65642,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/65637\/revisions\/65642"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/media?parent=65637"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/categories?post=65637"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/tags?post=65637"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}