{"id":71692,"date":"2022-09-11T23:37:39","date_gmt":"2022-09-12T03:37:39","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/?p=71692"},"modified":"2022-09-11T23:37:39","modified_gmt":"2022-09-12T03:37:39","slug":"project-02-13","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/11\/project-02-13\/","title":{"rendered":"Project &#8211; 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>I started by trying to make the original face a more cartoonish version of my self-portrait from the first week. After that, I started to play around with different variables and changes that I could make with the drawing. My favorite part of the project is being able to color in the background when the user presses a key.<\/p>\n<div><a class=\"p5_sketch_link\" href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/uploads\/2022\/09\/sketch-241.js\" data-width=\"480\" data-height=\"640\">sketch<\/a><iframe src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/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\">\/\/Nakshatra Menon \n\/\/Section C \n\nvar centerOfFaceX = 278;\nvar centerOfFaceY = 377;\nvar faceHeight = 470\nvar faceWidth = 374\nvar centerOfEyeLX  = 220; \nvar centerOfEyeY = 347;\nvar centerOfEyeRX = 408;\nvar eyeWidth = 92;\nvar eyeHeight = 62; \nvar hair = 1;\nvar mouth = 1;\nvar value1 = 130;\nvar value2 = 15;\nfunction setup() {\n    createCanvas(480, 640);\n    background(0);\n}\n\nfunction draw() {\n        if(\/\/ when the mouse is pressed --&gt; realistic face \n        mouseIsPressed==true){\n        background(0)\n        noStroke();\n        fill(60, 20, 54);                \/\/purple1 \n        beginShape();\n            vertex(207, 139);\n            vertex(323, 130);\n            vertex(344, 450);\n            vertex(323, 523);\n            vertex(280, 605);\n            vertex(186, 576);\n            vertex(126, 521);\n            vertex(104, 469);\n            vertex(89, 367);\n        endShape(CLOSE);\n        fill(76, 28, 90);                \/\/purple2\n        beginShape();\n            vertex(323, 130);\n            vertex(312, 370);\n            vertex(287, 329);\n            vertex(281, 336);\n            vertex(292, 356);\n            vertex(298, 348);\n            vertex(346, 461);\n            vertex(323, 531);\n            vertex(280, 605);\n            vertex(133, 504);\n            vertex(104, 310);\n            vertex(126, 377);\n            vertex(133, 356);\n            vertex(152, 351);\n            vertex(205, 365);\n            vertex(188, 328);\n            vertex(189, 309);\n            vertex(165, 292);\n            vertex(172, 255);\n            vertex(204, 212);\n            vertex(204, 183);\n            vertex(226, 146);\n            vertex(276, 146);\n        endShape(CLOSE);\n        fill(126, 53, 79);                 \/\/purple3\n        beginShape();\n            vertex(325, 131);\n            vertex(226, 162);\n            vertex(187, 280);\n            vertex(207, 287);\n            vertex(202, 326);\n            vertex(226, 375);\n            vertex(159, 366);\n            vertex(131, 414);\n            vertex(195, 482);\n            vertex(197, 493);\n            vertex(178, 506);\n            vertex(207, 533);\n            vertex(226, 529);\n            vertex(212, 483);\n            vertex(234, 484);\n            vertex(255, 471);\n            vertex(276, 477);\n            vertex(269, 444);\n            vertex(288, 415);\n            vertex(305, 407);\n            vertex(305, 429);\n            vertex(283, 424);\n            vertex(279, 445);\n            vertex(302, 449);\n            vertex(315, 441);\n            vertex(336, 459);\n            vertex(325, 471);\n            vertex(288, 476);\n            vertex(297, 490);\n            vertex(284, 496);\n            vertex(306, 547);\n            vertex(254, 559);\n            vertex(266, 591);\n            vertex(299, 620);\n            vertex(356, 611);\n            vertex(425, 458);\n            vertex(304, 318);\n            vertex(309, 369);\n            vertex(291, 379);\n            vertex(278, 319);\n            vertex(303, 319);\n        endShape(CLOSE);\n\n        fill(78, 34, 6);                     \/\/brown1\n        beginShape();\n            vertex(150, 315);\n            vertex(147, 296);\n            vertex(203, 285);\n            vertex(278, 303);\n            vertex(274, 312);\n            vertex(194, 309);\n            vertex(165, 319);\n            vertex(150, 315);\n        endShape(CLOSE);\n        beginShape();\n            vertex(358, 349);\n            vertex(374, 302);\n            vertex(444, 274);\n            vertex(444, 331);\n            vertex(440, 342);\n            vertex(450, 366);\n            vertex(448, 444);\n            vertex(427, 476);\n            vertex(417, 525);\n            vertex(380, 573);\n            vertex(221, 490); \n            vertex(253, 498);\n            vertex(389, 489); \n        endShape(CLOSE);\n        beginShape();\n            vertex(138, 538);\n            vertex(181, 573);\n            vertex(284, 606); \n            vertex(296, 618);\n            vertex(312, 618);\n            vertex(343, 742); \n            vertex(115, 742); \n        endShape(CLOSE); \n        fill(130, 69, 20);                        \/\/brown2\n        beginShape();\n            vertex(207, 285);\n            vertex(222, 285);\n            vertex(292, 303);\n            vertex(303, 315);\n            vertex(257, 315); \n            vertex(255, 323);\n            vertex(280, 337);\n            vertex(276, 343);\n            vertex(249, 323);\n            vertex(227, 323);\n            vertex(222, 306);\n            vertex(276, 312);\n            vertex(278, 303);\n        endShape(CLOSE)\n        beginShape();\n            vertex(245, 326);\n            vertex(284, 351);\n            vertex(284, 358);\n            vertex(262, 341);\n            vertex(240, 330);\n        endShape(CLOSE);\n        beginShape();\n            vertex(236, 337);\n            vertex(248, 337);\n            vertex(264, 349);\n            vertex(262, 352);\n            vertex(235, 352);\n            vertex(239, 346);\n        endShape(CLOSE);\n        beginShape();\n            vertex(222, 360);\n            vertex(264, 355);\n            vertex(284, 360);\n            vertex(278, 369);\n            vertex(249, 377);\n            vertex(242, 364);\n        endShape(CLOSE);\n        beginShape();\n            vertex(373-30, 365-50);\n            vertex(415-30, 319-50);\n            vertex(473-30, 332-50);\n            vertex(470-30, 337-50);\n            vertex(438-30, 339-50);\n            vertex(408-30, 353-50);\n            vertex(460-30, 345-50);\n            vertex(474-30, 356-50);\n            vertex(461-30, 374-50);\n        endShape(CLOSE);\n        triangle(386-30, 374-50, 388-30, 400-50, 411-30, 372-50);\n        beginShape();\n            vertex(421-30, 373-50);\n            vertex(440-30, 373-50);\n            vertex(447-30, 379-50);\n            vertex(421-30, 378-50);\n        endShape(CLOSE);\n        beginShape();\n            vertex(422-30, 384-50);\n            vertex(421-30, 392-50);\n            vertex(424-30, 400-50);\n            vertex(412-30, 406-50);\n            vertex(413-30, 414-50);\n            vertex(404-30, 416-50);\n            vertex(399-30, 408-50);\n            vertex(392-30, 406-50);\n            vertex(404-30, 541-50);\n            vertex(420-30, 539-50);\n            vertex(403-30, 562-50);\n            vertex(392-30, 548-50);\n            vertex(356-30, 552-50);\n            vertex(361-30, 559-50);\n            vertex(351-30, 561-50);\n            vertex(344-30, 568-50);\n            vertex(312-30, 565-50);\n            vertex(312-30, 573-50);\n            vertex(324-30, 576-50);\n            vertex(342-30, 596-50);\n            vertex(355-30, 600-50);\n            vertex(356-30, 660-50);\n            vertex(321-30, 666-50);\n            vertex(327-30, 670-50);\n            vertex(384-30, 664-50);\n            vertex(402-30, 643-50);\n            vertex(421-30, 578-50);\n            vertex(440-30, 558-50);\n            vertex(452-30, 526-50);\n            vertex(473-30, 489-50);\n            vertex(478-30, 416-50);\n            vertex(442-30, 400-50);\n            vertex(447-30, 390-50);\n            vertex(439-30, 384-50); \n        endShape(CLOSE);\n\n        fill(183, 95, 53);        \/\/orange1 \n        beginShape();\n            vertex(237-30, 324-50);\n            vertex(259-30, 225-50);\n            vertex(352-30, 189-50);\n            vertex(461-30, 259-50);\n            vertex(473-30, 289-50);\n            vertex(473-30, 327-50);\n            vertex(404-30, 349-50);\n            vertex(392-30, 359-50);\n            vertex(422-30, 359-50);\n            vertex(460-30, 349-50);\n            vertex(460-30, 369-50);\n            vertex(386-30, 380-50);\n            vertex(401-30, 422-50);\n            vertex(429-30, 417-50);\n            vertex(420-30, 410-50);\n            vertex(440-30, 406-50);\n            vertex(444-30, 415-50);\n            vertex(461-30, 413-50);\n            vertex(470-30, 424-50);\n            vertex(470-30, 485-50);\n            vertex(452-30, 513-50);\n            vertex(430-30, 506-50);\n            vertex(427-30, 523-50);\n            vertex(404-30, 547-50);\n            vertex(351-30, 552-50);\n            vertex(337-30, 544-50);\n            vertex(345-30, 529-50);\n            vertex(362-30, 526-50);\n            vertex(375-30, 513-50);\n            vertex(351-30, 493-50);\n            vertex(348-30, 469-50);\n            vertex(354-30, 456-50);\n            vertex(356-30, 435-50);\n            vertex(347-30, 414-50);\n            vertex(322-30, 353-50);\n        endShape(CLOSE);\n        beginShape();\n            vertex(339-30, 572-50);\n            vertex(389-30, 563-50);\n            vertex(391-30, 570-50);\n            vertex(376-30, 591-50);\n            vertex(359-30, 595-50);\n            vertex(341-30, 583-50);\n        endShape(CLOSE);\n        beginShape(); \n            vertex(299-30, 625-50);\n            vertex(351-30, 613-50);\n            vertex(377-30, 595-50);\n            vertex(408-30, 556-50);\n            vertex(416-30, 551-50);\n            vertex(408-30, 617-50);\n            vertex(399-30, 645-50);\n            vertex(351-30, 661-50);\n            vertex(306-30, 643-50);\n        endShape(CLOSE);\n        beginShape();\n            vertex(197-30, 425-50);\n            vertex(299-30, 425-50);\n            vertex(314-30, 437-50);\n            vertex(288-30, 504-50);\n            vertex(254-30, 521-50);\n            vertex(215-30, 502-50);\n            vertex(200-30, 469-50);\n        endShape(CLOSE);\n        quad(259-30, 362-50, 275-30, 366-50, 275-30, 369-50, 259-30, 369-50);\n        fill(227, 122, 43);\n        beginShape();\n            vertex(284-30, 218-50);\n            vertex(328-30, 205-50);\n            vertex(361-30, 201-50);\n            vertex(462-30, 265-50);\n            vertex(470-30, 326-50);\n            vertex(392-30, 350-50);\n            vertex(374-30, 396-50);\n            vertex(392-30, 505-50);\n            vertex(374-30, 509-50);\n            vertex(358-30, 496-50); \n            vertex(351-30, 480-50);\n            vertex(361-30, 468-50);\n            vertex(361-30, 436-50);\n            vertex(352-30, 418-50);\n            vertex(335-30, 354-50);\n            vertex(252-30, 319-50);\n            vertex(264-30, 258-50);\n        endShape(CLOSE);\n        beginShape();\n            vertex(375-30, 399-50);\n            vertex(384-30, 399-50);\n            vertex(394-30, 418-50);\n            vertex(411-30, 426-50);\n            vertex(456-30, 419-50);\n            vertex(465-30, 431-50);\n            vertex(463-30, 486-50);\n            vertex(442-30, 503-50);\n            vertex(416-30, 496-50);\n            vertex(419-30, 517-50);\n            vertex(406-30, 544-50);\n            vertex(355-30, 551-50);\n            vertex(342-30, 540-50);\n            vertex(355-30, 532-50);\n            vertex(361-30, 546-50);\n            vertex(369-30, 523-50);\n            vertex(407-30, 504-50);\n            vertex(372-30, 409-50);\n        endShape(CLOSE);\n        circle(252-30, 472-50, 81);\n        beginShape()\n            vertex(401-30, 565-50);\n            vertex(411-30, 565-50);\n            vertex(404-30, 583-50);\n            vertex(406-30, 623-50);\n            vertex(390-30, 649-50);\n            vertex(335-30,649-50);\n            vertex(321-30, 628-50);\n            vertex(370-30, 617-50);\n            vertex(385-30, 602-50);\n            vertex(384-30, 592-50);\n        endShape(CLOSE);\n        beginShape()\n            vertex(422-30, 364-50);\n            vertex(435-30, 358-50);\n            vertex(437-30, 349-50);\n            vertex(455-30, 349-50);\n            vertex(461-30, 359-50);\n            vertex(446-30, 369-50);\n        endShape(CLOSE); \n        triangle(351-30, 581-50, 374-30, 565-50, 384-30, 576-50);\n        fill(251, 151, 55);                   \/\/Orange2\n        beginShape();\n            vertex(306-30, 220-50);\n            vertex(364-30, 215-50);\n            vertex(443-30, 253-50);\n            vertex(463-30, 284-50);\n            vertex(466-30, 322-50);\n            vertex(406-30, 342-50);\n            vertex(377-30, 359-50);\n            vertex(374-30, 388-50);\n            vertex(373-30, 417-50);\n            vertex(399-30, 483-50);\n            vertex(392-30, 500-50);\n            vertex(382-30, 507-50);\n            vertex(361-30, 488-50);\n            vertex(369-30, 467-50);\n            vertex(364-30, 427-50);\n            vertex(351-30, 396-50);\n            vertex(346-30, 354-50);\n            vertex(290-30, 319-50);\n            vertex(306-30, 297-50);\n            vertex(295-30, 264-50);\n        endShape(CLOSE);\n        beginShape();\n            vertex(379-30, 415-50);\n            vertex(410-30, 430-50);\n            vertex(425-30, 430-50);\n            vertex(443-30, 419-50);\n            vertex(460-30, 426-50);\n            vertex(460-30, 475-50);\n            vertex(454-30, 492-50);\n            vertex(435-30, 494-50);\n            vertex(411-30, 476-50);\n            vertex(411-30, 516-50);\n            vertex(402-30, 532-50);\n            vertex(370-30, 545-50);\n            vertex(370-30, 527-50);\n            vertex(393-30, 509-50);\n            vertex(403-30, 487-50);\n        endShape(CLOSE);\n        beginShape();\n            vertex(331-30, 632-50);\n            vertex(382-30, 620-50);\n            vertex(392-30, 628-50);\n            vertex(386-30, 643-50);\n            vertex(356-30, 643-50);\n        endShape(CLOSE);\n        circle(256-30, 469-50, 60);\n\n        fill(254, 187, 79);            \/\/yellow \n        beginShape();\n            vertex(356-30, 373-50);\n            vertex(373-30, 379-50);\n            vertex(373-30, 414-50);\n            vertex(364-30, 414-50);\n            vertex(356-30, 396-50);\n        endShape(CLOSE);\n        beginShape();\n            vertex(374-30, 420-50);\n            vertex(425-30, 438-50);\n            vertex(450-30, 430-50);\n            vertex(457-30, 448-50);\n            vertex(453-30, 478-50);\n            vertex(443-30, 482-50);\n            vertex(411-30, 467-50);\n            vertex(392-30, 472-50);\n        endShape(CLOSE)\n        beginShape();\n            vertex(373-30, 433-50);\n            vertex(399-30, 491-50);\n            vertex(392-30, 500-50);\n            vertex(375-30, 487-50);\n            vertex(377-30, 476-50);\n        endShape(CLOSE);\n        beginShape(); \n            vertex(272-30, 391-50);\n            vertex(287-30, 393-50);\n            vertex(287-30, 400-50);\n            vertex(270-30, 401-50);\n        endShape(CLOSE);\n        quad(424-30, 387-50, 440-30, 387-50, 440-30, 398-50, 424-30, 398-50);\n        ellipse(392-30, 284-50, 95, 105);\n\n        fill(21, 6, 1);                  \/\/black hair \n        beginShape();\n            vertex(70, 144);\n            vertex(154, 95);\n            vertex(270, 54);\n            vertex(370, 100);\n            vertex(477, 204);\n            vertex(498, 742);\n            vertex(291, 742);\n            vertex(313, 618);\n            vertex(364, 614);\n            vertex(372, 593);\n            vertex(379, 573);\n            vertex(417, 525);\n            vertex(427, 476);\n            vertex(448, 444);\n            vertex(450, 366);\n            vertex(440, 342);\n            vertex(444, 331);\n            vertex(443, 239);\n            vertex(437, 212);\n            vertex(322, 139);\n            vertex(210, 165);\n            vertex(193, 200);\n            vertex(139, 269);\n            vertex(131, 296);\n            vertex(151, 338);\n            vertex(121, 302);\n            vertex(119, 375);\n            vertex(108, 331);\n            vertex(93, 360);\n            vertex(111, 485);\n            vertex(126, 521);\n            vertex(181, 570);\n            vertex(218, 742);\n            vertex(0, 742);\n            vertex(0, 405);\n        endShape(CLOSE);\n        fill(40, 20, 16);                    \/\/brown1\n        beginShape();\n            vertex(251-30, 115-50);\n            vertex(314-30, 101-50);\n            vertex(361-30, 172-50);\n            vertex(355-30, 182-50);\n            vertex(327-30, 190-50);\n            vertex(290-30, 189-50);\n            vertex(310-30, 167-50);\n            vertex(252-30, 155-50);\n            vertex(285-30, 136-50);\n        endShape(CLOSE);\n        fill(56, 17, 4);                    \/\/brown2\n        beginShape();\n            vertex(327-30, 180-50);\n            vertex(356-30, 171-50);\n            vertex(322-30, 114-50);\n            vertex(317-30, 137-50);\n            vertex(337-30, 159-50);\n            vertex(327-30, 180-50);\n        endShape(CLOSE);\n    } else { \/\/ cartoon face\n        if (\/\/press on a key to color in the background\n            keyIsPressed == true){\n            stroke(mouseY, mouseX, value1);\n            strokeWeight(40);\n            point(mouseX, mouseY)\n        }\n        strokeWeight(1);\n        \/\/ hair\n            fill(44, 23, value2);\n            noStroke();\n            ellipse(244, 680, 630, 1290);\n        \/\/face and neck \n            strokeWeight(1);\n            fill(235, 171, 127);\n            beginShape();\n                vertex(135, 511);\n                vertex(304, 605);\n                vertex(270, 742);\n                vertex(179, 742);\n            endShape(CLOSE);\n            stroke(174, 115, 75);\n            strokeWeight(3);\n            ellipse(centerOfFaceX, centerOfFaceY, faceWidth, faceHeight); \/\/face \n\n        \/\/left eye     \n            stroke(44, 23, 17);\n            strokeWeight(10);\n            line(143, 311, 174, 295);\n            line(174, 295, 270, 295);\n            strokeWeight(2);\n            stroke(0);\n            fill(\"black\");      \/\/ eyeliner \n            triangle(centerOfEyeLX, centerOfEyeY-25, 143, 329, centerOfEyeLX, centerOfEyeY+25);\n            fill(\"white\");      \/\/eye\n            ellipse(centerOfEyeLX, centerOfEyeY, eyeWidth, eyeHeight);\n            fill(\"black\");      \/\/ left pupil \n            ellipse(constrain(mouseX, centerOfEyeLX-15, centerOfEyeLX+15), constrain(mouseY, centerOfEyeY-8, centerOfEyeY+8), eyeWidth\/4);   \n        \/\/ right eye \n            stroke(44, 23, 17);\n            strokeWeight(10);\n            line(365, 295, 441, 295);\n            line(441, 295, 450, 303);\n            strokeWeight(2);  \n            stroke(0);\n            fill(\"black\");            \/\/ eyeliner \n            triangle(centerOfEyeRX, centerOfEyeY-25, 463, 321, centerOfEyeRX, centerOfEyeY+25); \n            fill(\"white\");            \/\/ eye \n            ellipse(centerOfEyeRX, centerOfEyeY, eyeWidth, eyeHeight);    \n            fill(\"black\");            \/\/right pupil\n            ellipse(constrain(mouseX, centerOfEyeRX-15, centerOfEyeRX+15), constrain(mouseY, centerOfEyeY-8, centerOfEyeY+8), eyeWidth\/4);   \n        \/\/Hair - bangs \n            if(hair &lt;= 1){\n            fill(44, 23, value2);\n            stroke(44, 23, value2);\n            beginShape();\n                curveVertex(327, 124);\n                curveVertex(268, 145);\n                curveVertex(215,158);\n                curveVertex(191, 224);\n                curveVertex(127, 292);\n                curveVertex(137, 331);\n                curveVertex(78, 426);\n                curveVertex(99, 191);\n            endShape(CLOSE);\n            }\n            if(hair &lt;=2 & hair>1){\n            fill(44, 23, value2);\n            stroke(74, 46, value2);\n            beginShape();\n                vertex(278, 136);\n                vertex(390, 155);\n                vertex(463, 282);\n                vertex(71, 292);\n                vertex(175, 150);\n            endShape(CLOSE);\n            }\n            if(hair &lt;=3 & hair>2){\n            fill(44, 23, value2);\n            stroke(44, 23, value2);\n            beginShape();\n                curveVertex(327, 124);\n                curveVertex(268, 145);\n                curveVertex(215,158);\n                curveVertex(191, 224);\n                curveVertex(127, 292);\n                curveVertex(137, 331);\n                curveVertex(78, 426);\n                curveVertex(99, 191);\n            endShape(CLOSE);\n            beginShape();\n                curveVertex(298, 121);\n                curveVertex(298, 121);\n                curveVertex(340, 190);\n                curveVertex(412, 255);\n                curveVertex(455, 308);\n                curveVertex(458, 410);\n                curveVertex(466, 536);\n                curveVertex(486, 325);\n                curveVertex(399, 138);\n            endShape(CLOSE);\n            }\n        \/\/ mouth  \n            if(mouth &lt;=1){\n                fill(196, 99, 99); \n                stroke(137, 41, 41);\n                strokeWeight(10);\n                ellipse(centerOfFaceX+36, centerOfFaceY+133, mouseX\/7, mouseY\/7);\n            }\n            if(mouth &lt;=2 & mouth>1){\n                if(mouseX<width\/2){stroke(102, 31, 31);\n                strokeWeight(5);\n                line(centerOfFaceX+96, centerOfFaceY+133, centerOfFaceX-46, centerOfFaceY+133);\n                }\n                else{\n                    noFill();\n                    stroke(102, 31, 31);\n                    strokeWeight(5);\n                    beginShape();\n                        vertex(centerOfFaceX+36, centerOfFaceY+143);\n                        vertex(centerOfFaceX+6, centerOfFaceY+113);\n                        vertex(centerOfFaceX-26, centerOfFaceY+143);\n                    endShape();\n                    beginShape();\n                        vertex(centerOfFaceX+36, centerOfFaceY+143);\n                        vertex(centerOfFaceX+76, centerOfFaceY+113);\n                        vertex(centerOfFaceX+98, centerOfFaceY+143);\n                    endShape();\n                }\n            }\n            if(mouth&lt;=3 & mouth>2){\n                fill(196, 99, 99);\n                stroke(137, 41, 41);\n                strokeWeight(10);\n                triangle(centerOfFaceX+96, centerOfFaceY+123, centerOfFaceX+26, centerOfFaceY+123, centerOfFaceX+61, centerOfFaceY+123+mouseY\/9)\n            }\n        \/\/ nose \n            strokeWeight(7);\n            stroke(189, 137, 102);\n            noFill();\n            beginShape();\n                vertex(348, 311);\n                vertex(337, 352);\n                vertex(337, 373);\n                vertex(365, 444);\n                vertex(342, 467);\n                vertex(319, 446);\n            endShape();\n            if(hair &lt;= 1){\/\/nose ring changes w\/ hair (gold)\n            strokeWeight(4);\n            stroke(255, 215, 0); \n            noFill() \n            beginShape();\n                vertex(330, 443);\n                vertex(320, 462); \n                vertex(331, 472);\n                vertex(334, 460);\n            endShape();\n            }\n            if(hair &lt;=2 & hair>1){\/\/ nose ring changes w\/ hair (silver)  \n            strokeWeight(4);\n            stroke(192, 192, 192); \n            noFill(); \n            beginShape();\n                vertex(330, 443);\n                vertex(320, 462); \n                vertex(331, 472);\n                vertex(334, 460);\n            endShape();\n            }\n            if(hair &lt;=3 & hair>2){\/\/ nose ring changes w\/ hair (stud)\n            strokeWeight(7)\n            stroke(255, 215, 0)\n            point(330, 443)\n            }\n        }\n} \nfunction mousePressed(){\n    \/\/when you click on the mouse the eye size, hair, haircolor, mouth, and background color changes \n    eyeWidth = random(60, 150);\n    eyeHeight = random(50, 100);\n    hair = random(0, 3);\n    mouth = random(0,3); \n    value1 = random(0, 255);\n    value2 = random(0, 100);\n\n}\n<\/code><\/pre><\/div><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>I started by trying to make the original face a more cartoonish version of my self-portrait from the first week. After that, I started to play around with different variables and changes that I could make with the drawing. My favorite part of the project is being able to color in the background when the &hellip; <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/11\/project-02-13\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Project &#8211; 02&#8221;<\/span><\/a><\/p>\n","protected":false},"author":746,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[97,57,1],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/71692"}],"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\/746"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=71692"}],"version-history":[{"count":4,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/71692\/revisions"}],"predecessor-version":[{"id":71696,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/71692\/revisions\/71696"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=71692"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=71692"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=71692"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}