Site Overlay

Homework2 – Sound

Bouncing Marmot

Try DEMO HERE | Collaborator – Roi Ye

Story Behind

This assignment I collaborates with Roi to make a sound-related work. We discussed for a while and we both agreed to make something funny. When she shared some interesting videos with me, it occurred to both of us a funny video that we’ve all seen: the screaming marmot.

We loved the funny screaming sound of marmot. So we decided to make something with the sound. How to make the marmot scream? We thought that it would be interesting to let marmots bounce with each other and scream. So the effect would be like this.

We split the work. Roi was responsible for the visual design, the sound. I was in charge of realizing the bouncing effect.

I wrote the bouncing ball script, and modified to allow audio to play once two marmots hit with each other. It turned out that the audio wouldn’t play again till it finished the last play. So I used the cloneNode(true) to play the cloned audio file instead of the original one. After doing this, I found that since the bouncing effect would keep for a while, the ahhhhhh audio would keep playing multiple times in a short period of time. That was not the effect we wanted. So I added a freezing time in which period you cannot play the audio once more.

After making the sound, I added the images of marmots drawn by Roi to the canvas and set its animation. The final demo looked like this.

Leave a Reply

Your email address will not be published. Required fields are marked *

css.php