Published On: Sat, Mar 16th, 2013

New web design tools : Web Audio API

New web design tools : Web Audio API

New web design tools : Web Audio API

You simply declare new objects, add them to the stage, and apply animation to them

  • Web       :  http://netm.ag/webaudio-237
  • Price    :  Free

The new HTML5 <audio> and <video> tags are very useful. Despite formatting issues, they give you the ability to play sound natively, which is great. But for music-making, editing, syncing or anything more advanced, they’re pretty much useless.

So a little while back Google and Mozilla both sat down and came up with low-level audio APIs.

What we’re talking about here is a set of controls that enable you to generate sound from basic waveforms: to build virtual synths, drum machines, and all sorts of wacky instruments.

Not to mention basic sound editing, effects and synchronisation.

Google wins the battle

For a while, there were two solutions but, to cut a long story short, Google won the battle of wills and now Safari and Chrome both support its W3C proposal, with Firefox now also working on an implementation. Drum roll please.
So what does the Web Audio API do? Well, it works a little like the <canvas> tag does for drawing. You generate a context within which audio will be handled. Then you create a sound source and load this into a buffer – it could be that you’re loading samples, or using wavetables to synthesise sound: it doesn’t matter. Then you hook this up to the destination: your speakers.

Node-based

The API uses a node-based system, so if you wanted to add some effects, you just route your sound through an effects module. (For example, a gain module would give you fine control over the volume of a sound source.)

It also provides hooks for you to produce visualisations of your audio, which will no doubt produce some very cool results.

Making all this effective requires split-second timing, so the API uses floating-point values for relative time, to enable you to sync playback accurately. This might be useful when, for example, a game character fires a gun, or bounces off a wall. The possibilities range all the way from 8-bit to 5.1 surround, making this an exciting time for audio.

Rating:

Positive:

  • Low-level audio control
  • Accurate timing Sound generation/ synthesis
  • Sound generation/synthesis

Negative:

  • Currently only available on Safari 6, iOS 6 and Chrome 10+

Verdict : Providing both low-level control and high-level abstraction, the API promises great control and high-level abstraction, the API promises great things for the desktop speakers of tomorrow.