{"id":68458,"date":"2021-10-31T22:29:46","date_gmt":"2021-11-01T02:29:46","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/?p=68458"},"modified":"2021-10-31T22:31:32","modified_gmt":"2021-11-01T02:31:32","slug":"generative-portrait","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/10\/31\/generative-portrait\/","title":{"rendered":"Generative Portrait"},"content":{"rendered":"\n

sketch<\/a>Download<\/a><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\"> \/\/Yanina Shavialena\n \/\/Section B\n\n\/\/My portrait\nvar image;\n\/\/Places I've been\/Want to go to\nvar words = ['Belarus','USA','Bulgaria','Poland','Spain','France','South Korea'];\n\/\/The state of mouse pressed\nlet pressedState = false;\n\n\/\/This function loads the image\nfunction preload() {\n var imagelink= \"https:\/\/i.imgur.com\/CQ38vbw.jpg\";\n image = loadImage(imagelink);\n}\n \n\/\/This function created canvas and makes sure the picture is in dimensions of the canvas\nfunction setup() {\n createCanvas(480, 480);\n image.resize(480, 480); \n background(0);\n image.loadPixels();\n frameRate(10000000);\n}\n \nfunction draw() {\n \/\/random x and y positions and get the color from that x and y from my portrait\n var x = random(width);\n var y = random(height);\n var c = image.get(x, y);\n\n if( pressedState == false){\n \/\/random start controlling point\n var x1 = x + random(-25,25);\n var y1 = y + random(-25,25);\n \/\/random final point\n var x3 = x + random(-15,15);\n var y3 = y + random(-15,15);\n \/\/random final controlling point\n var x4 = x3 + random(-25,25);\n var y4 = y3 + random(-25,25);\n\n stroke(color(c));\n curve(x1, y1, x, y, x3, y3, x4, y4);\n\n \/\/hearts at the beginning and final point\n heart(x,y,5,c);\n heart(x3,y3,5,c);\n }\n\n \/\/puts words at random points\n else{\n noStroke();\n fill(c);\n textSize(random(10));\n text(random(words),x,y)\n }\n}\n\n\/\/when mouse is pressed, mouseState is updated and the background is reset\nfunction mousePressed(){\n if(pressedState == false) {\n pressedState = true;\n }\n else {\n pressedState = false;\n }\n background(0);\n}\n\n\/\/creates hearts to use for the ends of the lines\nfunction heart(x, y, size, color) {\n fill(color);\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}<\/code><\/pre><\/p>\n\n\n\n<p>I really enjoyed this project because I could finally implement the idea of pixels and creativity. It was hard to come up with something at first but then I thought about what could describe me in my portrait so I decided to use an emoji of a heart because I think love is one of the strongest feelings on Earth and after the click of a mouse multiple countries would pop up randomly to make up an image: one of the countries is where I was born, one of the countries is where I live right now, then the remaining countries are where I visited or where I want to visit. <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"986\" height=\"984\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.56.48-PM.png\" alt=\"\" class=\"wp-image-68462\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.56.48-PM.png 986w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.56.48-PM-300x300.png 300w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.56.48-PM-150x150.png 150w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.56.48-PM-768x766.png 768w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\"><\/figure><figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"980\" height=\"986\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-10.05.28-PM.png\" alt=\"\" class=\"wp-image-68463\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-10.05.28-PM.png 980w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-10.05.28-PM-298x300.png 298w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-10.05.28-PM-150x150.png 150w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-10.05.28-PM-768x773.png 768w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\"><\/figure><figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"988\" height=\"984\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.59.37-PM.png\" alt=\"\" class=\"wp-image-68464\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.59.37-PM.png 988w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.59.37-PM-300x300.png 300w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.59.37-PM-150x150.png 150w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-31-at-9.59.37-PM-768x765.png 768w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\"><\/figure><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>sketchDownload \/\/Yanina Shavialena \/\/Section B \/\/My portrait var image; \/\/Places I’ve been\/Want to go to var words = [‘Belarus’,’USA’,’Bulgaria’,’Poland’,’Spain’,’France’,’South Korea’]; \/\/The state of mouse pressed let pressedState = false; \/\/This function loads the image function preload() { var imagelink= “https:\/\/i.imgur.com\/CQ38vbw.jpg”; image = loadImage(imagelink); } \/\/This function created canvas and makes sure the picture is in … <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/10\/31\/generative-portrait\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> “Generative Portrait”<\/span><\/a><\/p>\n","protected":false},"author":670,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[111,56],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/68458"}],"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\/670"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/comments?post=68458"}],"version-history":[{"count":3,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/68458\/revisions"}],"predecessor-version":[{"id":68467,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/68458\/revisions\/68467"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/media?parent=68458"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/categories?post=68458"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/tags?post=68458"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}