The Legendary Tools of the BBC Radiophonic Workshop Recreated with Web Audio API

The BBC set out to honor the early pioneers by using the latest web technology

  The Wobbulator, a modulated sine-wave oscillator
The BBC is bringing the iconic sounds and tools created by the legendary Radiophonic Workshop back to life using the latest technology and quite a few hacks, just like the original team did.
2 photosVIEW ALL 

The BBC is bringing the iconic sounds and tools created by the legendary Radiophonic Workshop back to life using the latest technology and quite a few hacks, just like the original team did.

The catch is that instead of hooking up oscillators to tape machines, the new project links up the Web Audio API to other standard web tech to recreate everything in the browser.

The results are impressive if only because of how easy it is to recreate something that only the most inventive minds of half a century ago could do, in a browser using modern but basic web technology.

In fact, the developers had to limit themselves for the recreations to stay fateful, Web Audio API provides a lot more powerful tools than anything at the disposal of the Radiophonic Workshop back then.

The BBC Research and Development department put together a website and four classic machines for you to play with, the Wobbulator, the Ring Modulator, a gunfire effects generator and a trio of tape loops.

Each of these was used to create much of the sounds that would accompany radio shows and early TV shows by the BBC, including the voice of the Dalek and The Cybermen from Dr. Who.

The site explains how the original effects were created, so it serves as a cool history lesson for any audio tech fan, but also provides the source code for the recreations.

The team relied extensively on Web Audio API for the sound processing. This means that, for now, the site will only work in Chrome, other browsers haven't adopted the draft specifications just yet.

For the UI, they relied on common jQuery and backbone.js. You can check out all the code for yourself to discover how it was all put together. The explanations alongside the code are great if you're just starting out with Web Audio API.

Photo Gallery (2 Images)

Gallery Image
01
Gallery Image
02

Comments