Books

• Web Audio API by Boris Smus

Libraries Visualization

• Muser - Using machine learning to enhance music visualization in the browser.

Libraries Visualization

• Cava (⭐5.7k) - A cross-platform terminal visualizer.

Libraries Audio

• standardized-audio-context (⭐767) - A cross-browser implementation of the AudioContext which aims to closely follow the standard.

• web-audio-beat-detector (⭐647) - A beat detection utility which is using the Web Audio API.

• meyda (⭐1.6k) - Audio feature extraction for JavaScript.

Experiments

• p5.js Audio Visualizer - A powerful, beat- and amplitude-responsive audio visualizer created with p5.sound (⭐905), on an HTML5 Canvas by Amanda Yeh.

Experiments

• YouTube Musical Spectrum (⭐189) - A browser extension that offers audio visualization on your YouTube page with nice musical notes.

Experiments

• audioMotion - High-resolution real-time audio spectrum analyzer and full-featured music player written in JavaScript. Includes binaries for Windows, Linux and macOS.

Libraries Visualization

• audioMotion-analyzer - High-resolution real-time audio spectrum analyzer JS module with no dependencies.

Experiments

• Audible Visuals - Collection of visualizers derived from the Archimedean spiral by Sonia Boller.

• Just Dance - A 3D Audio Visualization made with BabylonJS & 2D Perlin Noise.

Libraries Audio

• audio (⭐232) - Generic Go package designed to define a common interface to analyze and/or process audio data

• wav (⭐376) - Battle tested Wav decoder/encoder

Tutorials

• Visualizing sound in Go with SDL

Downloads

• How to Make Electronic Music Freebies

Libraries Audio

• Aubio - C library for realtime audio labeling with bindings for Python and PD, support for ofx and Vamp.

Experiments

• React Player - A complete Audio Visualisation player with ReactJS.

Libraries Visualization

• Slang (⭐1.2k) - An audio programming language built in JS

Experiments

• Audio Visualizer (⭐42) - An interesting web audio visualizer built with Pixi.js.

Downloads

• Soundwhich

Libraries Visualization

• Circular Audio Wave (⭐278) - A JS library for audio visualization in circular wave using Web Audio API and ECharts

Libraries Visualization

• wavebell (⭐51) - A javascript voice recorder with realtime waveform, using web microphone

People to Follow

• Aaron Koblin - Artist, designer, programmer, and entrepreneur specializing in data and digital technologies.

Tutorials

• Recreating legendary 8-bit games music with Web Audio API

Tutorials

• Creative Audio Visualizers

Experiments

• Weekly Music Visualizations Weekly music visualization experiments built with Three.js and p5.js by Suraya Shivji.

Experiments

• Andantino Listen some notes and try to find same notes on the keyboard.

• ShowCQTBar - Audio spectrum visualization with musical scale.

Libraries Visualization

• Vuo — A realtime visual programming language for interactive media.

Libraries Visualization

• wavesurfer.js - A customizable audio waveform visualization, built on top of Web Audio API and HTML5 Canvas

Experiments

• Finding Love - fully interactive, Virtual Reality story that transforms emotions into art.

Experiments

• Vissonance A collection of audio visualizers built in THREE.js.

Experiments

• Moire - A Web Audio / WebGL visualisation.

Experiments

• ClubberToy Several shadertoys, rewired with clubber, bundled as a vj app.

Experiments on Codepen

• Clubberize yin yang example - An example using the clubberize helper to easily integrate clubber.js in javascript apps.

Libraries Visualization

• Clubber.js (⭐372) - Application of music theory in audio reactive visualizations.

People to Follow

• Yannis Gravezas - A creative coder with several projects featured in chrome experiments, fwa and elsewhere.

Experiments

• Tangled - Audio-visual release by Berlin based netlabel Yarn Audio, visuals made in cables. Drag to rotate, scroll to zoom.

Videos

• Paul Adenot: Elements of Dance Music - JSConf.Asia 2015

• 8-bit Music Theory

Experiments

• Musical Interactions - Some experimental ideas for playful musical interactions.

Libraries Audio

• waveform-data - Audio Waveform Data Manipulation API – resample, offset and segment waveform data in JavaScript.

• audiowaveform (⭐2.1k) - C++ program to generate waveform data and render waveform images from audio files.

Libraries Visualization

• Peaks.js - Modular client-side JavaScript component designed for the display of and interaction with audio waveform material in the browser.

Experiments

• Popcorn - Little audio-reactive sketch by Hugh Kennedy.

Experiments

• VR Ondes Martenot (⭐6) - A playable rendition of the Ondes Martenot in Virtual Reality.

Experiments

• DJi - Clean music visualizer from SoundCloud or self uploaded.

Libraries Audio

• Octavian (⭐179) - Utilities for reasoning about musical notes, frequencies, and intervals

Tutorials

• Javascript Systems Music - Learning Web Audio by Recreating The Works of Steve Reich and Brian Eno

Experiments

• PartyMode - An experimental music visualizer using d3.js and the web audio api.

People to Follow

• Mat Preziotte - Absurd music visualizations and generative art.

Libraries Audio

• audio-render (⭐44) - A pass-through audio stream, providing structure for rendering stream audio data.

Experiments

• Mmorph - An adventure into new ways of delivering interactive music in the browser and beyond.

• Loop Waveform Visualizer - WebGL Visualizer for Screw Base by Beytah.

Experiments on Codepen

• P5 Audio Tests 33 - Audio visualization using p5.js 3D elements and Soundcloud API

• P5 Audio Tests 27 - Audio visualization using p5.js 3D elements and Soundcloud API

• CircleLineNERDDISCO - Audio visualization with amazing analyser by Tim Pietrusky.

Experiments

• Touchpianist - play a piano and look all animations along the screen.

Experiments

• Scribble Audio - Draw loops of sound with this web synthesizer.

Experiments

• Audiograph - Amazing audio visualization made by Matt DesLauriers.

Downloads

• Motion Sound

Experiments

• Chrome Music Lab - Play with simple experiments and explore how music works.

• Glowsynth - just amazing! - Play with your mouse, Qwerty keyboad, or MIDI keyboard and watch as the lights dance to your music.

Libraries Visualization

• Processing - An open source programming language and integrated development environment built for the electronic arts, new media art, and visual design communities.

Experiments

• TRIF - GIF-based online radio visualization using webaudio API and raw CSS

Experiments

• Adventure Machine - Campaign for Madeon's "Adventure" album.

• BBNG - WebGL Visualizer for "Confessions" (feat. Leland Whitty) by BADBADNOTGOOD.

• DENNIS - An interactive and audio responsive music video for "Dennis" by popcorn_10's.

• George & Jonathan III - Campaign for George & Jonathan's "III" album.

• Lantern - WebGL Visualizer for "Lantern" by SBTRKT.

• Nero - WebGL Visualizer for "In The Way" by Nero.

• Pareidolia - WebGL Visualizer for "Szerencsétlen" by Venetian Snares.

• Yume - Campaign for Helios' "Yume" album.

• Word Problems - WebGL Visualizer for "Word Problems" by Harmonic 313.

• Glitch - An algorithmic synthesizer to make music from math.

• 105 Birthday Clara Rockmore - A Doodle for the Birthday of Clara Rockmore.

• Moogfest Substrate - Experimental site to Moogfest.

Experiments on Codepen

• Soundcloud Vinyl Search - An amazing experiment creating a realistic Vinyl player using DrawSVG and GSAP by Chris Gannon.

• Gooey Effect Audio - Upload your mp3 and visualize the song with this crazy effect by Jeremy Karlsson.

• Storytelling with Html5 + CSS3 - A great example of how to use music to create a Storytelling by Rachel Nabors.

• Step sequencer - Create music with this sequencer by Joe Harry.

Libraries Audio

• Beeplay.js - Write a song In JavaScript.

Libraries Visualization

• The Force (⭐287) - Live coded shader editing with audio input.

• Hylogen (⭐486) - Purely functional language embedded in Haskell for expressive live coding of fragment shaders (with audio input).

People to Follow

• Joshua Davis - An American designer, technologist, author and artist in new media.

• Robert Hodgin - A creative coder living in Brooklyn. Co-creator of the Cinder C++.

• Seb Lee-Delisle - An award-winning digital artist and speaker.

• Raven Kwok - A visual artist, animator and creative programmer.

• Jason Sigal - Creative Coder in residence at NYU's and creator of web audio library for p5.js.

• Shawn Lawson - An experiential media artist creating the computational sublime.

• Matt DesLauriers - Creative coder at Jam 3.

• Patrick Heng - Creative front-end developer. Studied at Hetic and Gobelins and works at Grouek.

Experiments

• Fluctus - Experimental 3D Audio Visualizer by Jordan Machado.

• Lines - Visualising Joy Division album cover as a music spectrum by Silvio Paganini.

• Silk - 3D Audio Visualizer by Matt DesLauriers.

• Wave - 3D Audio Visualizer by Matt DesLauriers.

• Binaural - Experiment using Binaural and Reverb audio effects by Matt DesLauriers.

• Fireworks with WebGL - Sound driven fireworks by Ondřej Žára.

• Scrollsound - Scrolling as a method of interaction with audio on the web by Ehsan Ziya.

• Experiment #8 - Music Experiment by Bruno Imbrizi.

• Draw and Music - Campaign for Rugs new album by Sam Greens.

• 3D Grid - Audio visualizer built with HTML5 web audio API by rickycodes.

Experiments on Codepen

• SVG Animated Drum Kit - Play an amazing Drum made with SVG and realistic sounds by @iamjoshellis.

• SVG Animated Guitar - Play an amazing Guitar made with SVG and realistic sounds by @iamjoshellis.

• Audio Visualizer - Abstract Audio Visualizer using Three.js by Francesco Trillini

• Awesome Audio Player - Radial Audio Player constructed by lines of frequency and amplitude by Alex Permyakov

• Wireframes - Wireframe WebGL Animation with Three.js by Patrick Heng

• CSS Audio Visualizer - Using audio frequency data from a hidden video to apply CSS scaling by Neil McCallion.

• WebGL Soundcloud Visualizer using Three.js - ThreeJS/WebGL Soundcloud player/visualizer based on HTML5 AudioContext API by Luigi Mannoni.

• Oscilator - Testing the oscillator node from HTML5 audio API by Anej Gorkič.

• Cubes Audio Visualizer - 10th contribution for codevember 2015 by Patrick Heng.

People to Follow

• Chris Wilson - Open Web Guy, formerly of Microsoft and now working as a Developer Advocate at Google.

Experiments

• obsidian - 3D Audio Visualization made by the creator of Three.js.

Experiments

• Luis Henrique Bizarro Portfolio - Portfolio with experiments using Three.JS and GSLS.

• Splice - A realtime interactive music visualizer using time-code data from Splice's upcoming visualizer API.

• Typatone - Make music while you write.

• Music Cube - A Chrome Experiment that combines the Roland TR-808 Drum Machine with the Rubik's Cube.

• Music Game - ECHO - A challenging musical puzzle game.

• Patatap - A portable animation and sound kit.

• Plink - Awesome Multiplayer Game - A multiplayer music experience.

• Soundcloud Visualizer - A Canvas and Web Audio Experiment.

• CSS Visualizer - Music Visualizers that are made entirely using DOM elements and CSS3.

• Kandinski Experiment - Music Visualizations inspired in Kandinsky.

• Visual Music Trailer - Live audio visual performance ideas.

Libraries Audio

• web-audio-analyser (⭐215) - A thin wrapper around the Web Audio API that takes an element and gives you its waveform/frequency data in return.

• web-audio-player (⭐244) - A cross-browser Web Audio player.

• web-media-playback (⭐8) - Retrieve playback and buffering information about audio or video playing in the browser.

• Pizzicato.js - Simplify the way you create and manipulate sounds via the Web Audio API.

• ThreeAudio.js (⭐538) - Helps you create music visualizations in Three.js or tQuery.

• MIDI.js (⭐3.9k) - Making life easy to create a MIDI-app on the web.

• Beep.js (⭐1.4k) - A JavaScript toolkit for building browser-based synthesizers.

• p5.sound (⭐905) - Brings the Processing approach to Web Audio and p5.js.

• Audiolet - A JavaScript library for real-time audio synthesis and composition.

• coffee-collider - A language for real time audio synthesis and algorithmic composition in HTML5.

Libraries Visualization

• p5.js - A JavaScript library for creating graphic and interactive experiences, based on the core principles of Processing.

• Pixi.js (⭐46k) - A fast lightweight 2D library that works across all devices. The Pixi renderer allows everyone to enjoy the power of hardware acceleration without prior knowledge of WebGL.

• sketch.js - Let's you get straight to the fun parts of creative coding, without ever having to worry about shims or boilerplate code.

• three.js - Three.js is a library that makes WebGL easy to use.

• Two.js - A two-dimensional drawing API geared towards modern web browsers. It is renderer agnostic enabling the same API to draw in multiple contexts: SVG, Canvas, and WebGL.

• BabylonJS - A complete JavaScript framework for building 3D games with HTML5, WebGL and Web Audio.

• Web Audio Extension (⭐192) - A Chrome extension to play with Web Audio.

• Cinder - A community-developed, free and open source library for professional-quality creative coding in C++.

• HYPE_processing - Collection of Processing classes that performs heavy lifting tasks while using a minimal amount of code writing.

Tutorials

• Kadenze - Courses about Sound and Creative Process

Videos

• Mathieu 'p01' Henri: Making Realtime Audio-Visuals - JSConf.Asia 2015

Downloads

• Beeple's resource (inspirational C4D "open source" files)

• Freesound

• Audio Jungle

• Six Bit Deep

• Samplephonics - Free Stuff

• Wave Alchemy

• Audio Animals

• Bed Room Producers Blog

• Free Music Archive

• Music Radar

Tutorials

• MDN - Basic concepts behind Web Audio API

• Understanding AudioParams: Precision control of web audio nodes

• Making An Interactive Music Video With WebGL

• Exploring the web audio api with d3

• Getting Started with Web Audio API

• 14 essential JavaScript audio libraries for web developers

• Fun with Web Audio API

• The Audio Processing Dog House

• Web Audio School

• Audio visualisation with the web audio api

• Make Your Browser Dance

• Audio Visualization with Web Audio and Three.js

• Applying Web Audio API with the HTML5 Canvas Element - Part I

• Applying Web Audio API with the HTML5 Canvas Element - Part II

• Real-time analysis of streaming audio data with Web Audio API

• Syncing CSS Animations with HTML5 Audio

Videos

• Matt McKegg: I Play The JavaScript - JSConf.Asia 2015

• Chris Lowis: A Brief History of Synthesis with the Web Audio API

• Introducing the Web Audio API

• CorkDev.IO - HTML 5 Web Audio API

• Steve Kinney: Building a musical instrument with the Web Audio API | JSConf US 2015

• Making the Web Rock: The Web Audio API

• Jordan Santell: Signal Processing with the Web Audio API - JSConf2014

• Making waves using the Web Audio API

• Stuart Memo: JavaScript is the new Punk Rock

• Jan Krutisch: JavaScript Patterns For Contemporary Dance Music -- JSConf EU 2013

• Charlie Roberts: Gibbering at Algoraves - JS in Live Audiovisual Performances - JSConf.Asia 2014

• Lauren McCarthy: Learning while making p5js

• Interactive Music with Tone.js

• Web Audio API vs Native: Closing the Gap

• BRAID: A Web Audio Instrument Builder with Embedded Code Blocks

• Web Audio Tools

• HTML5DevConf: Jordan Santell, "Browser Dance Party: Visualizing Audio with the Web Audio API"

• Praveen Kumar - MIDI.js