Tag: web audio

domain ping machine in Web Audio

A ‘mini’ version of the Google domain ping synthesizer from the internet-sensors collection (Using the Mashape API). This one runs in Web Audio, using the Web Audio Playground with OSC.

Looks like a card game. Anyway it sounds cool. Doesn’t have the panning of the original, but it has an organic sound due to portamento in frequency changes, and more ‘beating’. Here’s a short excerpt.

Another example of Max controlling WAP http://reactivemusic.net/?p=6193



folder is: WebAudio/osctest/


  • wapOSCserver-ping.rb
  • wapPingTest.maxpat
  • WAP patch: – ping2 (5 osc’s -> 5 gains, -> 1 master gain) – ping2.json
  • Web Page: WebAudio/index.html


update: you can run an online version of WAP Web client at http://zerokidz.com/wap/index.html – If you load this page, skip to step 3.

1. run the node webserver in WebAudio

node nodeserver.js

(it will run on localhost port 8081 – for example

2. In Chrome web browser, run:

3. From a terminal window, go to the osctest/ folder and start the server by typing:


4. Load the Max patch:


5. In Chrome, click the OSC button – the ruby server should open a socket connection

6. Also in Chrome, load the patch: ping2 (note that there is a json copy of this patch ping2.json that can be pasted in, if it doesn’t show up in the menu)

6.5 In WAP, Click the square buttons on the 5 Oscillators to start them playing. You should hear sounds at this point.

7. Now back in Max patch – click green toggle to start polling and you probably want to increase the polling rate to about 50 ms instead of 1000 ms

  • If it doesn’t seem like there is much action in the patch, try adjusting the FREQ_MULT and GAIN_MULT inside the ruby script.
  • You will probably also want to open the developer javascript console in Chrome to see what is going on.

web-audio scriptProcessing

update: here’s how to produce a sine wave: http://reactivemusic.net/?p=6574

General consensus: scriptProcessing is not robust enough to process multiple signal chains.

Other links


Web Audio Playground Max, Osc, and WebSockets

updated 5/17/2014


This fork adds the following features to Chris Wilson’s Web Audio Playground:

  • basic patch load/save capability
  • clipboard copy/paste to get patches in and out of browser
  • OSC control of all parameters using web sockets and a ruby server.

Try it out at: http:zerokidz.com/wap/index.html

For optimum results try Chrome on Mac OS. But it does work in other browsers.

Patch file format is JSON. Patches are reloaded by firing gesture events which created them.


Source code: https://github.com/tkzic/WebAudio


sub-folder: osctest

Instructions for Osc, Websockets Max/MSP example

Note: You can either run a local web server, using nodeserver.js and index.html – in the WebAudio folder – or use the online version of WAP as described here.

1.  Load WAP in a Google Chrome browser using the following URL: http:zerokidz.com/wap/index.html

2. In WAP, load a patch called: delay-thing.

Note: If the patch doesn’t exist you can paste it in by opening the file osctest/delay-thing.json in a text editor and copying the text. Then click paste in WAP and paste in the text. Then make sure to save it in WAP by typing in the name “delay-thing” and clicking the save-as: button

3. In a terminal window, go to the osctest/ folder and start the server by typing:

ruby ./wapOSCserver.rb

4. In WAP, Press the OSC button – the ruby server should acknowledge with the message: “WebSocket connection open”

5. Open the Max patch: wapOSCtester.maxpat

6. In WAP press the play button on the Oscillator module (you should hear sounds)

7. In the Max patch drag the slider on the left to control the oscillator pitch. You should hear the sound change and see the sliders move in WAP.

Notes on Web Sockets connection:

The html side of the connection is done in js/socketsOSC.js

look at the function: connectOSC() – which gets triggered by the OSC button in index.html

Incoming messages from Max (via Ruby server) are parsed in parseOSCMessage() which figures out how to set appropriate values for the audio objects in the DOM.

There are currently no acknowledgement or error messages being returned (at least I don’t remember doing this)

The web audio API

by Chris Wilson

Slides: http://webaudio-io2012.appspot.com/#1