{"id":1290,"date":"2019-09-23T13:43:17","date_gmt":"2019-09-23T17:43:17","guid":{"rendered":"http:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/?p=1290"},"modified":"2019-09-23T16:38:38","modified_gmt":"2019-09-23T20:38:38","slug":"colin-ancalmo-sound-animation","status":"publish","type":"post","link":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/sound-controlled-animation\/cancalmo\/colin-ancalmo-sound-animation\/","title":{"rendered":"Colin Ancalmo &#8211; Sound Animation"},"content":{"rendered":"\n<p>I tried creating an audio visualizer for my sound-based animation. My idea was to create some sort of sheet or surface and have the sound deform that surface.<\/p>\n\n\n\n<p>With the help of jit.multiple and a tutorial of manipulating shapes via jit.multiple (<a href=\"https:\/\/www.youtube.com\/watch?v=BLV2rA1MtEI&amp;feature=youtu.be&amp;t=926\">link here<\/a>), I got a plane of square shapes that moved in a sin formation (that&#8217;s what I used from the tutorial). From there, I made all the squares very low poly to the point that they were 2D. Control wise, I made it such that the overall duplication spacing and sin transforming period\/amplitude could be controlled together from outside.<\/p>\n\n\n\n<ul class=\"wp-block-gallery columns-3 is-cropped wp-block-gallery-1 is-layout-flex wp-block-gallery-is-layout-flex\"><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"986\" height=\"942\" src=\"http:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress2.jpg\" alt=\"\" data-id=\"1291\" class=\"wp-image-1291\" srcset=\"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress2.jpg 986w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress2-800x764.jpg 800w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress2-768x734.jpg 768w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress2-314x300.jpg 314w\" sizes=\"auto, (max-width: 986px) 100vw, 986px\" \/><figcaption>Less Low-end<\/figcaption><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"1003\" src=\"http:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress3-1024x1003.jpg\" alt=\"\" data-id=\"1292\" data-link=\"http:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/?attachment_id=1292\" class=\"wp-image-1292\" srcset=\"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress3-1024x1003.jpg 1024w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress3-800x784.jpg 800w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress3-768x752.jpg 768w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress3-306x300.jpg 306w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress3.jpg 1081w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption>More Low-end<\/figcaption><\/figure><\/li><li class=\"blocks-gallery-item\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"983\" height=\"337\" src=\"http:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress1.jpg\" alt=\"\" data-id=\"1293\" data-link=\"http:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/?attachment_id=1293\" class=\"wp-image-1293\" srcset=\"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress1.jpg 983w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress1-800x274.jpg 800w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress1-768x263.jpg 768w, https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress1-600x206.jpg 600w\" sizes=\"auto, (max-width: 983px) 100vw, 983px\" \/><figcaption>Camera usually at top view, scene is 3D<\/figcaption><\/figure><\/li><\/ul>\n\n\n\n<p>The sound: I put song tracks through low-pass and high-pass filters to get two routes of control from the low and high frequencies. So Bass would trigger on one while high-hats would trigger on the other. The low-pass triggered the duplicate&#8217;s spacing \/ size and amplitude of the sin wave. The high-pass controls the color changing background and the shape of the 2D squares (lot of struggle to get that working, but I think it made a cool effect).<\/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_A6-SoundPlane-SoundAnimation\" width=\"1000\" height=\"563\" src=\"https:\/\/www.youtube.com\/embed\/DiKfnq93TFg?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>The songs I used to test were 1) <a href=\"https:\/\/www.youtube.com\/watch?v=wngfhydvZpk\">It&#8217;s Your Move by Diana Ross<\/a>, 2) <a href=\"https:\/\/soundcloud.com\/gu_kun\/earth-wind-fire-september-gu-kun-remix\">Earth, Wind &amp; Fire &#8211; September (gu-kun remix)<\/a>, and 3) <a href=\"https:\/\/soundcloud.com\/next-to-blue\/1-800-friends\">Next To Blue &#8211; 1-800-friends<\/a>. Each song I had &#8220;presents&#8221; for the frequency sensitivity since they were different volumes. Next To Blue&#8217;s song worked the best as it had more distinct low and high instruments. The full version of that song is visualized below!<\/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_A6-SoundPlane-SoundAnimation_(NextToBlue-1-800-friends)\" width=\"1000\" height=\"563\" src=\"https:\/\/www.youtube.com\/embed\/0CK_O1S6Eag?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>I tried creating an audio visualizer for my sound-based animation. My idea was to create some sort of sheet or surface and have the sound deform that surface. With the help of jit.multiple and a tutorial of manipulating shapes via jit.multiple (link here), I got a plane of square shapes that moved in a sin&#8230; <\/p>\n<div class=\"link-more\"><a href=\"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/sound-controlled-animation\/cancalmo\/colin-ancalmo-sound-animation\/\">Read More<\/a><\/div>\n","protected":false},"author":122,"featured_media":1291,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"cybocfi_hide_featured_image":"","footnotes":""},"categories":[23],"tags":[],"class_list":["post-1290","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-sound-controlled-animation"],"jetpack_featured_media_url":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-content\/uploads\/sites\/10\/2019\/09\/CA_Progress2.jpg","_links":{"self":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/posts\/1290","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=1290"}],"version-history":[{"count":3,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/posts\/1290\/revisions"}],"predecessor-version":[{"id":1302,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/posts\/1290\/revisions\/1302"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/media\/1291"}],"wp:attachment":[{"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/media?parent=1290"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/categories?post=1290"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.joshuarosenstock.com\/teaching\/imgd3200-a19\/wp-json\/wp\/v2\/tags?post=1290"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}