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.

13 thoughts on “Putting guitar pedals in a web page

    1. 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.

      1. 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.

      2. 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?

    1. 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.

  1. 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.

      1. Regarding Jonny Greenwood – agreed, this is entirely true, whether he is on his knees “playing” his pedals, or blasting his tele straight into an amp without any FX…..

    1. Actually, it’s an early implementation of a standard. Firefox is working on implementing de WebAudio API, which Pedalboard.js builds upon.

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