{"id":603,"date":"2012-11-12T17:06:10","date_gmt":"2012-11-12T17:06:10","guid":{"rendered":"http:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/?p=603"},"modified":"2012-11-12T17:06:10","modified_gmt":"2012-11-12T17:06:10","slug":"drifting-snow","status":"publish","type":"post","link":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/2012\/11\/12\/drifting-snow\/","title":{"rendered":"Drifting Snow"},"content":{"rendered":"<p>This one starts by generating an array of 50 snowflake objects. As each one disappears from the screen (meaning it is past the bottom edge of the screen a distance greater than half its height), its space in the array is given to a new, randomly generated snowflake. Each snowflake has its own fall speed, based on size, for a parallax effect, and its own spin speed. I managed to get each snowflake to spin independently by translating the origin to its center and rotating the origin before drawing it, them immediately undoing the rotation and translation before the next snowflake was drawn. The illusion of three-dimensional movement is created by making each snowflake&#8217;s height change along with a sine function.<br \/>\n<script type=\"application\/processing\">\r\n\/\/Info: http:\/\/processingjs.org\/reference\r\nsnowflake[] Snowflakes = new snowflake[50];\r\nPImage snow1;\r\nPImage snow2;\r\nPImage snow3;\r\nPImage snow4;\r\nPImage snow5;\r\nint squishIndex;\r\nfloat factor;\r\n\r\nvoid setup()\r\n{\r\n  size(600,380);\r\n  smooth();\r\n  float factor = 1;\r\n  snow1 = loadImage(\"http:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-content\/uploads\/2012\/11\/snow1.png\");\r\n  snow2 = loadImage(\"http:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-content\/uploads\/2012\/11\/snow2.png\");\r\n  snow3 = loadImage(\"http:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-content\/uploads\/2012\/11\/snow3.png\");\r\n  snow4 = loadImage(\"http:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-content\/uploads\/2012\/11\/snow4.png\");\r\n  snow5 = loadImage(\"http:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-content\/uploads\/2012\/11\/snow5.png\");\r\n\r\n  for(int i=0;i<=49;i++)\r\n  { \r\n    Snowflakes[i]= new snowflake(); \/\/initialize fifty snowflakes\r\n  }\r\n}\r\n\r\nvoid draw()\r\n{\r\n  background(188,210,238);\r\n  for(int i=0;i<=49;i++)\r\n  {\r\n    factor = Snowflakes[i].moveSnowflake();\r\n    Snowflakes[i].drawSnowflake(factor);\r\n    if(Snowflakes[i].y > height + (Snowflakes[i].sBaseHeight)\/2)\r\n    {\r\n      Snowflakes[i] = new snowflake();\r\n    }\r\n  }\r\n}\r\n\r\nclass snowflake\r\n{\r\n  float x;\r\n  float y;\r\n  float sWidth;       \/\/snowflake's width\r\n  float sBaseHeight;  \/\/snowflake's base height. displayed height\r\n                      \/\/changes with each frame\r\n  float fallSpeed;    \/\/how fast the snowflake falls. proportional\r\n                      \/\/to size for parallax effect\r\n  float rotateSpeed;  \/\/how fast the snowflake spins, degrees per frame\r\n  float squishOffset; \/\/how out of sync the snowflake's drifting is\r\n                      \/\/from the other snowflakes\r\n  PImage sprite;      \/\/the image used\r\n  float totalRot;     \/\/how many degrees in total the picture has turned\r\n  \r\n  snowflake()\r\n  {\r\n    x = random(width);\r\n    y = -1*random(100);\r\n    sWidth = random(100)+20; \/\/20 to 120\r\n    sBaseHeight = sWidth;\r\n    fallSpeed = (sWidth - 20)\/10;\r\n    squishOffset = random(360);\r\n    rotateSpeed = random(5)\/2; \/\/degrees per draw\r\n    totalRot = 0;\r\n    \r\n    float spriteNum = random(5); \/\/one of five predetermined images\r\n\r\n    if (spriteNum<1) {sprite = snow1;}\r\n    else if (spriteNum<2) {sprite = snow2;}\r\n    else if (spriteNum<3) {sprite = snow3;}\r\n    else if (spriteNum<4) {sprite = snow4;}\r\n    else if (spriteNum<5) {sprite = snow5;}\r\n  }\r\n  \r\n  float moveSnowflake()\r\n  {\r\n    float parallax = (sWidth\/90);\r\n    \r\n    x = x+(parallax * .05); \/\/later do something with noise\r\n    y = y+(parallax* .50);\r\n    return sin(radians(squishOffset + frameCount));\r\n  }\r\n  \r\n  void drawSnowflake(float squishFactor)\r\n  { \r\n    translate(x,y);\r\n    rotate(radians(totalRot));\r\n    imageMode(CENTER);\r\n    image (sprite,0,0, sWidth, (sBaseHeight * squishFactor));\r\n    rotate(-1 * radians(totalRot));\r\n    translate(-x,-y);\r\n    totalRot = totalRot + rotateSpeed;\r\n   \r\n  }\r\n}\/\/end Class: Snowflake\r\n\r\n    \r\n  \r\n<\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p>This one starts by generating an array of 50 snowflake objects. As each one disappears from the screen (meaning it is past the bottom edge of the screen a distance greater than half its height), its space in the array &hellip; <a href=\"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/2012\/11\/12\/drifting-snow\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":18,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/posts\/603"}],"collection":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/comments?post=603"}],"version-history":[{"count":2,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/posts\/603\/revisions"}],"predecessor-version":[{"id":605,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/posts\/603\/revisions\/605"}],"wp:attachment":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/media?parent=603"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/categories?post=603"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/IMGD3x00_B12\/wp-json\/wp\/v2\/tags?post=603"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}