alemangui/web-audio-resources

This is a list of curated resources related to the Web audio API. Browser support for the web audio API can be found here.

Learning and tutorials

• MDN Web api documentation - Mozilla documentation for developing with web audio API.
• Web audio API - An e-book by Boris Smud.
• Noisehack - A Blog about audio programming with plenty of articles about web audio api.
• Web audio gotchas - A small list of tricky web audio gotchas that are much needed to keep sanity.
• Building a virtual synth pad - Tutorial to build a virtual synth pad that will play audio samples and provide a reverb feature.
• Web audio playground - A graphic builder of an audio context graph. Helps visualize the way connections are made between web audio nodes.
• Web audio for games Web audio techniques applied to game development.
• Peaks.js explained - Article on the development of Peaks.js, an audio waveform rendering tool for the browser.
• Guitar tuner tutorial - Create a guitar tuner with web audio and Polymer
• Synthesizing tones with Fourier transforms - Sound generation with oscillators and Fourier transforms.
• Web MIDI API and Web Audio tutorial - Basic tutorial to create a simple synthesizer controlled by MIDI hardware.
• The Web Audio API from Node to the browser - Tutorial on serving audio files from Node/Express and consuming them in the browser.
• Beat detection using Javascript - How to detect beats and tempo using the web audio API.
• Javascript Air episode on Web Audio - An overview at audio programming with JavaScript and an introduction to some tools and frameworks.
• Slack's web audio channel - A friendly slack channel of people interested in web audio.
• JavaScript Systems Music - An article by Tero Parviainen on recreating generative music pieces by Steve Reich and Brian Eno.
• Recreating Legendary 8-bit games music - An article on how to use web audio to generate 8-bit music (a.k.a chiptune).

Libraries

• Howler.js - Web audio library. Falls back to HTML5 Audio.
• Tone.js - Framework for creating interactive music in the browser.
• Wad - Library for manipulating audio with web audio.
• Tuna - Audio effects library.
• Blip - Lightweight web audio wrapper.
• Pizzicato^* - A library that aims to simplify the way you create and manipulate sounds with the Web Audio API.
• Soundio - Soundio is a Graph Object Model for Web Audio processing graphs. It also provides a JSONify-able structure for exporting and importing them.
• Theresa's sound world - Library for manipulating audio built on top of the web audio API.
• Musical - A light library with a sequencing synthesizer that supports ABC notation.
• virtual-audio-graph - Library for declaratively manipulating the Web Audio API.
• gibber.lib.js - Library version of Gibber
• XSound - Web Audio API Library for Synths, Visualization, Effects ... etc

Visualization

• Wavesurfer.js - Waveform audio visualization built on top of Web Audio API and HTML5 Canvas.
• Peaks.js - JavaScript UI component created by the BBC for interacting with waveforms.
• Party mode - An audio visualizer powered by d3.js and the web audio api.
• Audiograph - A visualization of Pilotpriest'S 2016 album and one of the winners of the Dolby Web Challenge.
• Web Audio Inspector - A debugging tool that visualizes the Web Audio API graph of a web page in real time.

Synths

• Websynths - Web synthesizer by Mitch Wells.
• JS Dynamic Audio Synth - A musical keyboard by Keith William Horwood.
• 106.js - Emulation of the classic Roland Juno-106 analog synthesizer.
• Midi synth - Analog synthesizer simulation loosely based on the architecture of a Moog Prodigy synthesizer.
• X Sound - Web Synthesizer by XSound.
• Acid Machine 2 - similar to Propellerhead ReBirth RB-338 (although doesn't claim to be a port)

Fun and interesting projects

• Chrome music lab - Web Audio experiments aimed at making learning music more accessible to everyone.
• Jam with Chrome - A collaborative live music web application.
• Plink - Multiplayer music experience.
• Modulator - An editable graphical node synth.
• sound.io - A live-performance Web Audio tool which allows on-the-fly modification of audio.
• Drums - A 16-step, 8-track, drum sequencer with per-step sample controls.
• Recreating the ring modulator with web audio - An article on coding the device used to create the voices of the Daleks and the Cybermen in Dr. Who.
• Drum machine - Drum machine with several different drumkits.
• Pedalboard - Guitar pedal effects simulation.
• Wave-PD1 - A themerin-like instrument for the browser.
• Wavepot - A live digital signal processor (DSP) editor built with web audio.
• Tonalhub^* - Hear a web audio representation of the last year's commit activity of a given GitHub user and repository.
• Tweet FM - An interesting multimedia experiment combining Tweeter feeds and web audio in real time.
• Mod-synth - A visual synthesizer with several components and presets. It can also be used with a MIDI controller.
• The Rick Astley Remix - Remix Rick Astley's most famous song into different styles.
• Theremin - Another Theremin with delays, feedbacks and scuzz.
• Key-and-pad - A Web Audio synthesizer with a XY Pad to control effects.
• Musical Chord Progression Arpeggiator - An app for creating arpeggios with different progressions and styles.
• D3 synth - A D3 visualization that allows editing a sound loop.
• Gibber - is an audiovisual live coding environment for the browser (github)
• Winamp2-js - A reimplementation of Winamp 2.9 using the Web Audio API. GitHub
• Web audio modem - A project showing how to encode and decode data using the web audio API
• Music mouse - A partial emulation by Tero Parviainen of Laurie Spiegel's "Music Mouse - An Intelligent Instrument".
• AudioNodes - Modular audio production suite with multi-track audio mixing, audio effects, parameter automation, MIDI editing, synthesis, cloud production, and more (download, online version)
• Psyren Audio / Visual Synthesizer - interactively generate psytrance squelches (github)

Other web audio lists and resources

• Chromium Web Audio API Demos - Web audio app list curated by the Chromium project members.
• Web Audio Weekly by Chris Lowis - A weekly newsletter with hints, tips, links and news related to the Web Audio world.
• Audiocrawl - A showcase of web audio projects with the possibility of signing up for a monthly newsletter.
• Awesome Web Audio - A curated list of Web Audio packages and demos.
• Web Audio/MIDI Demo List - A list kept by the W3C audio working group.
• 10 Virtual Instruments on Browser - 10 Virtual Instruments You Can Play In Your Web Browser.
• Output Channel - A blog featuring Web Audio tutorials and demos/reviews.
• Awesome audio visualization - A list focusing on visualization but also including general web audio libraries, projects, videos and influential people to follow.
• Some of the Best Music Pens on CodePen - A list that includes the best audio-related projects in CodePen.

*: Full disclosure: I am the author of these items.

The images used in the header of this file were created by Dale Humphries and Yorlmar Campos from the Noun Project.