I try to build a pattern that fakes depth through gradients in brightness. The important part is to write a function for the arrows so I can make nested loops with them and array the arrows throughout the canvas.<\/p>\n\n\n\n
<\/a><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/\/Jason Jiang\n\/\/Section E\n\n\/\/Setting variables \n\n\/\/Creating Sky\nfunction setup() {\n createCanvas(600, 500);\n background(255);\n colorMode(HSB);\n }\n \n\n\nfunction draw() {\n \/\/draw rows of arrows\n for(col = 0; col < 10; col++){\n for(row = 0; row < 32; row++){\n push()\n \/\/Changing size of arrows\n var scale = 0.25 * (col+3)\n var l = 20\n translate(2*scale*l*row, 2*40*(col))\n rotate(radians(180))\n Arrow(0, 0, 20, 20, 250-col*6, 10*(col+1), scale);\n pop()\n }\n }\n noLoop()\n}\n\n \/\/Arrow gradient function\nfunction Arrow(x, y, l, step, H, S, scale){\n strokeWeight(5);\n push()\n translate(x, y)\n for (i = 0; i<step; i++){\n stroke(H, S, 5*i);\n line(0, 5*i, scale*l, l+5*i)\n line(0, 5*i, -scale*l, l+5*i)\n }\n pop()\n}<\/code><\/pre><\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>I try to build a pattern that fakes depth through gradients in brightness. The important part is to write a function for the arrows so I can make nested loops with them and array the arrows throughout the canvas. \/\/Jason Jiang \/\/Section E \/\/Setting variables \/\/Creating Sky function setup() { createCanvas(600, 500); background(255); colorMode(HSB); } … <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/29\/wallpaper-art\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> “Wallpaper art”<\/span><\/a><\/p>\n","protected":false},"author":723,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[104,121],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73241"}],"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\/723"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=73241"}],"version-history":[{"count":7,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73241\/revisions"}],"predecessor-version":[{"id":73812,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73241\/revisions\/73812"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=73241"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=73241"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=73241"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}