Browse blog posts tagged “Web Audio API”.
In part eight, we’ll be adding a detune feature to the synthesizer. This will enable the user to make the oscillators slightly out of tune with each other which can add a cool dimension to the sound. This tutorial is part eight in a series that will show you how to create a virtual synthesizer […]
In part seven, we’ll be adding an another oscillator to the synthesizer. We’ll end up with two, but you can use this logic to add as many oscillators as you want. Having multiple oscillators creates a lot of sonic potential for the instrument. This tutorial is part seven in a series that will show you how […]
In part six, we'll be adding an amplitude envelope with a graphic visualizer and FL studio style knobs. This envelope will allow us to define attack, hold, decay, sustain, and release.
In part five we’ll restructure the gain staging in our synthesizer to prevent clipping using the Web Audio API’s DynamicsCompressorNode and GainNode . This will touch on some of the basics of dynamics processing. In the last post, we gave the user the ability to play multiple notes at once with the computer keyboard. However, […]
This tutorial is part two in a series that will show you how to create a virtual synthesizer using JavaScript and the Web Audio API. In part two, we’ll be adding an on-screen keyboard to the synthesizer. Click here to clone or download the working code examples from the GitHub repository. Click here to view […]
This tutorial is part one in a series that will show you how to create a virtual synthesizer using JavaScript and the Web Audio API. Click here to clone or download the working code examples from the GitHub repository. Click here to view the finished product that uses the concepts and code discussed in this […]
This series of tutorials that will show you how to create a mobile compatible, virtual synthesizer with JavaScript and the Web Audio API. There are working code examples for each part in the series. Click here download or clone them from the GitHub repository. Here are the technologies we’ll be using: JavaScriptHTML 5SCSS & CSSBootstrap […]
This tutorial will show you how to write an AudioBuffer from the Web Audio API to a WAV audio file. You can find the project on GitHub here. If you’re not sure how to get an AudioBuffer from an audio file, check out my previous blog post about how to process an uploaded file with […]
The Web Audio API was created to give developers more control over the audio that plays in browsers. This tutorial will show you how to use the Web Audio API to process audio files uploaded by users in their browser. We will be using a Compressor Node in this tutorial, but you can use one […]