Putting guitar pedals in a web page

Only half of playing guitar – according to a few musician friends of mine – is moving your fingers up and down a fretboard and banging out some chords. The other half is the artistry of mastering your tone, usually through amp settings and stomp boxes.

Effects pedals – little boxes of electronics that go between the guitar and amp – are able to amplify and distort a guitar’s output, add reverb and delay, and even filter the tone via a wha or envelope pedal. These pedals can be simulated in software, but we can’t believe that they can now be emulated completely in JavaScript.

Pedalboard.js is a project put together by [dashersw], and aims to put a slew of pedals ‘in the cloud’ and turn editing and effects board as easy as building a web page.

The project is built around Webkit’s W3C audio API, allowing this virtual pedal board to work in Chrome, Safari, and other Webkit-enabled browsers. Pedals are programmed as nodes, each configurable to have and input, output, or analyzer that is able to modify the gain, wave shape, or filter of anything received by the line in on your computer.

Thee is a small demo of Pedalboard.js available here with a pre-recorded guitar track feeding into a few stomp boxes. It’s a pretty cool idea if you’d like to play around with a few guitar effect, but we can’t wait to see this bit of JavaScript implemented by effects pedal manufacturers allowing us to try before we buy.


  1. Mark Swope says:

    Nice. However, can someone tell me what “Convo” is?

    • krylenko says:

      Presumably it’s short for convolution, which has become a hot technique in music production.

      It’s basically signal analysis 101 – you fire a starter pistol (generate an impulse) in, say, a church (the responding system), record the results and edit out the initial pistol report, then convolve the recorded reverb with your input.

      Voila, your guitarist is now playing in the Sistine Chapel. (And of course, all sorts of more creative uses are available as well.)

      End users don’t have to do all that work, you just get an effects box or audio sequencer with convolution reverb built in.

      It’s less common in guitar pedals, but that’s changing as DSP gets cheaper and cheaper. No info here on what the “convo” is actually adding though.

      • dashersw says:

        Thank you! A great explanation :)

        The convo pedal should have been named “cabinet sim”. It simulates the reverberations of an old speaker cabinet. Launch the demo in Safari for the best audio experience, Chrome has problems with the convo pedal.

      • krylenko says:

        Cabinet sim makes sense, thanks. I haven’t kept up with guitar tech – is convolution the standard for that now? I think it used to be mostly EQ and a bit of overdrive.

        Also, the writeup says Flash has 50 ms latency and the native versions will reduce that to zero. Presumably by “zero” you mean 2-3 ms, right? Whatever’s inherent to the soundcard and drivers?

  2. Rick says:

    It’s a cool idea, and I hope it goes somewhere. But as it stands, it sounds like shit.

    • dashersw says:

      It’s a library demo to give an idea about the opportunuties :) and it’s up to the community to develop great sounding pedals!

      By the way, try Safari on Mac for the best results.

  3. Bill Gander says:

    http://www.audiotool.com/ I have sent this into the tipline several times. Blows this out of the water. Even has a little monome and 303/808/909. Enjoy.

  4. Joe Bonasses says:

    Ha ha…..

    “Only half of playing guitar is moving your fingers up and down a fretboard and banging out some chords” – said the guy who really can’t play, but spends a lot of time and money trying to master his tone through amp settings and stomp boxes.

  5. draeath says:

    Doesn’t work on firefox.

    Should I assume you’re doing something crazy and standards-breaking?

  6. yazstone says:

    Effects are cool and important. But they can become a crutch. Good post, though.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s


Get every new post delivered to your Inbox.

Join 97,838 other followers