Wildlife Control
-
We are SO PUMPED to tell you about this thing we made. It’s a brand new kind of music video for Analog or Digital that’s not really a video at all (ever seen a video where your comments appear IN THE VIDEO?). It’s more like a dynamic animation that uses modern web technologies like HTML5, CSS, JavaScript, and the SoundCloud API to throw a party in your browser.
Go check it out right now at http://analogordigital.wildlifectrl.com/
Pro tip: play around with the level of “Analog” and try flipping the video while it’s playing. Also, we’re serious that you can leave a comment at any point and it will appear in the video. Keep it clean. Or not.
So if you’re wondering how this is possible, then 1) you’re a huge nerd, and 2) that is a good thing. What follows is for you.
FOR THE GEEKS:
We were tinkering around with the SoundCloud API late one night several weeks ago and realized we could use the timing events and track comments to make something cool. At the time, we were thinking it would be a quick little animated ASCII thing. After digging in a little more, we decided to go way bigger.
You can think of this video as a scripted visualization. Although the story is linear, certain elements are random, making each viewing unique. The scenes are rendered on a “pixel” grid of HTML divs. Every time we get a playback timing event from SoundCloud, we check if a new sixteenth note has passed, and if so, the JavaScript renders the appropriate sprites on the video frame. This keeps the action precisely timed with the audio. The sprites are JavaScript objects that specify which colors to use and how to arrange them. Since we need to keep things lightweight and efficient, the general strategy is to break the scenes down into reusable pieces and animate them on the fly using math.
To make it a little more interactive, we display the SoundCloud comments right on the video on the same pixel grid. You can connect your SoundCloud or Facebook account and post your own comments and see them on the video while it’s playing. We are very excited that this is possible. Gotta love SoundCloud. And math.
So yeah… this is what happens when drummers write JavaScript.
