{"id":66217,"date":"2021-09-19T15:21:52","date_gmt":"2021-09-19T19:21:52","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/?p=66217"},"modified":"2021-09-19T15:23:51","modified_gmt":"2021-09-19T19:23:51","slug":"project-3-dynamic-drawing-14","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/09\/19\/project-3-dynamic-drawing-14\/","title":{"rendered":"Project 3 – Dynamic Drawing"},"content":{"rendered":"\n

gnmarino-03<\/a>Spacecraft Drawing<\/strong><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">var xCord = 300;\nvar yCord = 225;\nvar intSize = 1;\n\/\/for RBG color values\nvar intRed = 127;\nvar intGreen = 0;\nvar intBlue = 127;\n\nfunction setup() {\n createCanvas(600, 450);\n}\n\nfunction draw() {\n \n background (200);\n\n fill(intRed, intGreen, intBlue);\n\n \/\/ Change Red attribute (RGB) color as mouse moves across screen\n\n intRed = 255 - (mouseX \/ 2.3529);\n\n \/\/ Change Blue attribute (RGB) color as mouse moves across screen\n\n intBlue = (mouseX \/ 2.3529);\n \n \/\/changes size as mouse moves horizontally \n intSize = xCord * .01\n\n\n \/\/if mouse is on left side then spaceship points to the left\n if (width\/2 > mouseX) {\n \/\/draws polygon\n beginShape();\n vertex(xCord, yCord);\n vertex(xCord + (5 * intSize) , yCord - (5 * intSize));\n vertex(xCord + (15 * intSize), yCord - (5 * intSize));\n vertex(xCord + (30 * intSize), yCord - (15 * intSize));\n vertex(xCord + (30 * intSize), yCord);\n endShape(CLOSE);\n\n \/\/if mouse is on right side then spaceship points to the right\n }else {\n beginShape();\n vertex(xCord, yCord);\n vertex(xCord - (5 * intSize) , yCord - (5 * intSize));\n vertex(xCord - (15 * intSize), yCord - (5 * intSize));\n vertex(xCord - (30 * intSize), yCord - (15 * intSize));\n vertex(xCord - (30 * intSize), yCord);\n endShape(CLOSE);\n }\n\n\n yCord = mouseY;\n\n \/\/ Don't let object go off canvas if mouseY coordinate goes off canvas\n if (yCord < 0) {\n yCord = 0;\n }\n\n if (yCord > 450) {\n yCord = 450;\n }\n\n xCord = mouseX;\n\n \/\/ Don't let object go off canvas if mouseX coordinate goes off canvas\n if (xCord < 0) {\n xCord = 0;\n }\n\n if (xCord > 600) {\n xCord = 600;\n }\n\n\n} \n\n\n\n\n\n\n<\/code><\/pre><\/p>\n\n\n\nThis project was difficult because it was hard to keep track of how the math is working and where your coordinates are, especially while trying to rotate and flip objects. <\/p>\n\n\n\nAlso, at first I had a hard time finding an idea that sticks to the parameters and was constricted and always predictable.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" width=\"1024\" height=\"768\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/09\/IMG_EAA9E2D534D7-1-1024x768.jpeg\" alt=\"\" class=\"wp-image-66219\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/09\/IMG_EAA9E2D534D7-1-1024x768.jpeg 1024w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/09\/IMG_EAA9E2D534D7-1-300x225.jpeg 300w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/09\/IMG_EAA9E2D534D7-1-768x576.jpeg 768w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/09\/IMG_EAA9E2D534D7-1-1536x1152.jpeg 1536w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/09\/IMG_EAA9E2D534D7-1-2048x1536.jpeg 2048w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/09\/IMG_EAA9E2D534D7-1-1200x900.jpeg 1200w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\"><\/figure>Here is my starting drawing of trying to create my idea.<\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"gnmarino-03Spacecraft Drawing var xCord = 300; var yCord = 225; var intSize = 1; \/\/for RBG color values var intRed = 127; var intGreen = 0; var intBlue = 127; function setup() { createCanvas(600, 450); } function draw() { background (200); fill(intRed, intGreen, intBlue); \/\/ Change Red attribute (RGB) color as mouse moves across screen … <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/09\/19\/project-3-dynamic-drawing-14\/\" class=\"more-link\">Continue reading “Project 3 – Dynamic Drawing”<\/span><\/a><\/p>\n","protected":false},"author":658,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[100,58],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/66217"}],"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\/658"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/comments?post=66217"}],"version-history":[{"count":2,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/66217\/revisions"}],"predecessor-version":[{"id":66222,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/66217\/revisions\/66222"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/media?parent=66217"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/categories?post=66217"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/tags?post=66217"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}