{"id":68254,"date":"2021-10-30T18:43:07","date_gmt":"2021-10-30T22:43:07","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/?p=68254"},"modified":"2021-11-05T11:45:19","modified_gmt":"2021-11-05T15:45:19","slug":"project-9","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/10\/30\/project-9\/","title":{"rendered":"Project 9"},"content":{"rendered":"\n

sketch<\/a><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">var img;\n\nfunction preload() {\n img = loadImage(\"https:\/\/i.imgur.com\/mbg1U1D.jpg\");\n}\n\nfunction setup() {\n img.resize(img.width\/7, img.height\/7);\n createCanvas(img.width, img.height);\n smallPoint = 4;\n largePoint = 10;\n \/\/imageMode(CENTER);\n noStroke();\n img.loadPixels();\n textAlign(CENTER);\n text(\"CLICK TO CHANGE COLOR\",width \/ 2,height \/ 2)\n\n}\n\nfunction draw() {\n \/\/fill with heart\n let pointillize = map(mouseX, 0, width, smallPoint, largePoint);\n let x = floor(random(img.width));\n let y = floor(random(img.height));\n let pix = img.get(x, y);\n fill(pix, 10);\n heart(x, y, pointillize, pointillize);\n var cols = img.get(mouseX, mouseY);\n\n \/\/fun text fills image according to mouse\n fill(cols);\n textStyle(BOLD);\n textSize(20);\n text(\"YA\", mouseX, mouseY);\n}\n\nfunction heart(x, y, size) {\n \/\/custom shape\n beginShape();\n vertex(x, y);\n bezierVertex(x - size \/ 2, y - size \/ 2, x - size, y + size \/ 3, x, y + size);\n bezierVertex(x + size, y + size \/ 3, x + size \/ 2, y - size \/ 2, x, y);\n endShape(CLOSE);\n}\n\nfunction mousePressed() {\n \/\/background color changes\n background(color(random(255), random(255), random(255)));\n}<\/code><\/pre><\/p>\n\n\n\n<p>Once I figured out how to make this project more creative, it was more fun to create. The text that follows the mouse to fill in the image was fun to play around with.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"654\" height=\"876\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-30-at-6.45.03-PM.png\" alt=\"\" class=\"wp-image-68258\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-30-at-6.45.03-PM.png 654w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-30-at-6.45.03-PM-224x300.png 224w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\"><\/figure><figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"656\" height=\"866\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-30-at-6.45.26-PM.png\" alt=\"\" class=\"wp-image-68259\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-30-at-6.45.26-PM.png 656w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-30-at-6.45.26-PM-227x300.png 227w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\"><\/figure><figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"652\" height=\"874\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-30-at-6.46.45-PM.png\" alt=\"\" class=\"wp-image-68260\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-30-at-6.46.45-PM.png 652w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-30-at-6.46.45-PM-224x300.png 224w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\"><\/figure><p><\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>Once I figured out how to make this project more creative, it was more fun to create. The text that follows the mouse to fill in the image was fun to play around with.<\/p>\n","protected":false},"author":653,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[111,58],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/68254"}],"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\/653"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/comments?post=68254"}],"version-history":[{"count":3,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/68254\/revisions"}],"predecessor-version":[{"id":68262,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/68254\/revisions\/68262"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/media?parent=68254"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/categories?post=68254"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/tags?post=68254"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}