WebGL and Web Audio API demo roundup

Ilmari Heikkinen

Here's a look at some cool WebGL and Web Audio API demos that I've seen over the past couple weeks.

EVE Online ship viewer is a great-looking online ship viewer app built with WebGL. Very nice way to showcase the artwork in the game universe.

Web Audio API samples page has several compelling examples on how to do audio processing using it. WebGL City is one of the demos linked from the samples page. It's a small demo of a helicopter flying around a night cityscape. The helicopter (disable music by pressing 'm', enable helicopter sound by pressing 'n') uses Web Audio APIs spatial audio features to pan the helicopter audio from one speaker to the other.

Some enterprising soul implemented a snake game using nothing but a WebGL fragment shader on the GLSL Sandbox. I'm flabbergasted.

The Big Bang may look like any other WebGL particle animation, but the particle simulation is actually run on the GPU. The simulator is a fragment shader that reads the previous particle positions from a texture and writes the new particle positions into a FBO texture.

Blocky Earth takes Google Earth data and MineCrafts it. It communicates differences in height well. For example, I was looking at Australia and the Antarctic ice sheet, and you can see how the continental ice is several kilometers thick.

The Midem Music Machine is a fun music demo by Mr.doob and Paul Lamere. It's a sort of a ball-driven music box with balls bouncing off bits 'n' bops. CreativeJS has a good writeup on it, check it out.

Continuing on the computer music visualization theme, I recently ran across this page about bytebeat, a form of music generated by minimalistic code formula. The page links to one cool WebGL visualization of the music. Gregg Tavares took to the idea and built a bytebeat sandbox for making and sharing your own bytebeat tunes directly from the browser.