{"id":928,"date":"2019-09-04T21:00:04","date_gmt":"2019-09-05T01:00:04","guid":{"rendered":"http:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/?p=928"},"modified":"2019-09-04T21:04:14","modified_gmt":"2019-09-05T01:04:14","slug":"colin-ancalmo-interactive-animation","status":"publish","type":"post","link":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/interactive-animation\/cancalmo\/colin-ancalmo-interactive-animation\/","title":{"rendered":"Colin Ancalmo &#8211;  Interactive Animation"},"content":{"rendered":"\n<p>I took a picture of the Alden&#8217;s orchestra room and used it as the base for a instrument-focused interactive animation. Unfortunately the room has been rather unorganized this week, so I went into photoshop to highlight and add instruments to hint the interactive areas of the image. The interactive instruments are the violin, piano, xylophone, tube bells, and drums.  <\/p>\n\n\n\n<p>From there I created basic animations for each instrument. I underestimated the difficult of animating characters (even if they are basically stick figures),  so the animations themselves are rather lack-luster. Instead I tried to play to my strengths and ended up taking a slightly different angle on the interactive part.<\/p>\n\n\n\n<figure class=\"wp-block-embed-youtube wp-block-embed is-type-video is-provider-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"CA_AR3200_InteractiveAnimation-EverydayMysteries_Main\" width=\"1000\" height=\"563\" src=\"https:\/\/www.youtube.com\/embed\/bCfGpO79udw?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n<\/div><figcaption>It&#8217;s never too early for spooks<\/figcaption><\/figure>\n\n\n\n<p>I wrote a short generic spooky tune in FL Studio (a program like Abelton Live), using the same instruments highlighted before, and had their respective instrument parts play when their animations were toggled. Turning on all the animations at once plays the &#8220;full&#8221; tune, though it was fun to experiment with the playback manually.<\/p>\n\n\n\n<p>Below,  I set the interactive objects to be triggered randomly, adding variation with every full tune loop. This wasn&#8217;t really apart of the assignment but I thought it was cool so:<\/p>\n\n\n\n<figure class=\"wp-block-embed-youtube wp-block-embed is-type-video is-provider-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"CA_AR3200_InteractiveAnimation-EverydayMysteries_Extra\" width=\"1000\" height=\"563\" src=\"https:\/\/www.youtube.com\/embed\/bHG5UHbOfTo?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>Max Code: (The &#8220;change&#8221; block is really helpful)<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"925\" src=\"http:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_A3_SpookyOrchestra1.3-1024x925.png\" alt=\"\" class=\"wp-image-930\" srcset=\"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_A3_SpookyOrchestra1.3-1024x925.png 1024w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_A3_SpookyOrchestra1.3-800x722.png 800w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_A3_SpookyOrchestra1.3-768x693.png 768w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_A3_SpookyOrchestra1.3-332x300.png 332w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_A3_SpookyOrchestra1.3.png 1123w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption>Hidden Button triggers<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"715\" height=\"1024\" src=\"http:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/SpookyOrchestraAudioTempo1.3-715x1024.png\" alt=\"\" class=\"wp-image-933\" srcset=\"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/SpookyOrchestraAudioTempo1.3-715x1024.png 715w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/SpookyOrchestraAudioTempo1.3-559x800.png 559w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/SpookyOrchestraAudioTempo1.3-768x1100.png 768w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/SpookyOrchestraAudioTempo1.3-210x300.png 210w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/SpookyOrchestraAudioTempo1.3.png 945w\" sizes=\"auto, (max-width: 715px) 100vw, 715px\" \/><figcaption>Audio \/ Animation syncing<\/figcaption><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>I took a picture of the Alden&#8217;s orchestra room and used it as the base for a instrument-focused interactive animation. Unfortunately the room has been rather unorganized this week, so I went into photoshop to highlight and add instruments to hint the interactive areas of the image. The interactive instruments are the violin, piano, xylophone,&#8230; <\/p>\n<div class=\"link-more\"><a href=\"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/interactive-animation\/cancalmo\/colin-ancalmo-interactive-animation\/\">Read More<\/a><\/div>\n","protected":false},"author":122,"featured_media":936,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"cybocfi_hide_featured_image":"","footnotes":""},"categories":[16],"tags":[],"class_list":["post-928","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-interactive-animation"],"jetpack_featured_media_url":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/Capture.jpg","_links":{"self":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/posts\/928","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/users\/122"}],"replies":[{"embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/comments?post=928"}],"version-history":[{"count":4,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/posts\/928\/revisions"}],"predecessor-version":[{"id":944,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/posts\/928\/revisions\/944"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/media\/936"}],"wp:attachment":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/media?parent=928"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/categories?post=928"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/tags?post=928"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}