Web Audio Synthesizer

Tanguy – User's Manual

(A Beginner's Guide to Making Beautiful Sounds in Your Bedroom)


TANGUY creates sounds in real time from data input through the user interface ("the panel"). Skillful synthesizer programming can yield a wide variety of sounds including percussive metallic banging, electronic beeps, bizarre effects, emulations of acoustic instruments, and warm "analog" tones. This guide will teach you the basics of synthesizer programming and explain TANGUY's peculiarities.

System Requirements

TANGUY sounds best in Google Chrome, Opera, or Apple Safari. Firefox has some known issues with frequency modulation that prevent Oscillator Two from making sound at all. TANGUY works on iOS with Chrome (on iPhone 5 and later) and Safari (on iPhone 6 or later). It works on Android devices running Google Chrome (and even some default Android browsers).

TANGUY can be played by a MIDI keyboard in Chrome. You must enable this in Chrome's hidden settings: chrome://flags/#enable-web-midi and then restart Chrome with your MIDI device connected. Currently, only the keyboard and pitch bend are supported. I'm working on mod wheel and aftertouch.


Choosing a Preset

The 100+ presets included in TANGUY will give you a quick impression of its capabilities. Click on any part of the field that contains the text INITIALIZE to open the list of presets. Select any preset to load it or click outside of the list to cancel. Some presets have VCA Gain greater than 0, and will begin making sound automatically. One way to discover the purpose of each control is to work backwards from any preset to the INITIALIZE state.

You can cycle through the available presets using keyboard shortcuts backwards using < (or ,) and forward by pressing > (or .). The cycling always stops at position zero because it is useful to have a way to get back to INITIALIZE quickly.

Playing the Keyboard

TANGUY is a monosynth: only one note can be played from the keyboard at a time. Click the keys with your mouse or play TANGUY using your QWERTY keyboard. The home row represents the white keys, and the black keys are mapped to the corresponding keys in the row above.

The Octave Shift allows a player to quickly shift the range of the keyboard up or down using the buttons -1 and +1 buttons or the keyboard shortcuts: Shift Octave Down: - (or z) and Shift Octave Up = (or x).

The Pitch slider offers real time performance opportunities for bending the pitch. Move the slider to shift the pitch of all tracked oscillators simultaneously. Release to allow the pitch to snap back to its original value. Pitch bend and snapping do not work in Firefox.

Dynamically change the amount of the LFO's effects by using the Mod. slider. If Mod. is set to 0, the LFO will have no effect. Since the Mod. wheel determines the amount of the LFO, it is considered part of the preset.

Programming Sounds


Synthesizers use oscillators as primary sound sources. In the same way that acoustic instruments use vibrating strings or membranes to produce pitched sounds, a synthesizer uses an oscillator. The coarse tuning is usually measured in feet (apparently to appease organists). Each doubling of the length of footage lowers the pitch one octave. TANGUY's oscillators can be coarse tuned using the buttons labeled 32', 16', 8', and 4'.

Oscillator Two has additional controls for Detune and Fine. Use Detune to raise or lower Oscillator Two's pitch in steps (up or down an entire octave). Fine tuning allows you to tune Oscillator Two up and down in subtle ways that will affect the beating of TANGUY's oscillators against each other. This can range from a slow phasing effect to a dissonant warbling.

It is also possible to disable keyboard tracking for each oscillator independently. This is useful for creating unpitched sound effects, setting a static rate of modulation, or using one oscillator to drone on the root note while you play notes in that key on the tracked oscillator.

Oscillators also contribute to the timbre of the sound. Most synthesizers offer a few basic waveforms: sawtooth, square, triangle, and sine. Sawtooth and square waves are rich in harmonics. Triangles are slightly more harmonically interesting than sine waves (which are pure tones mostly suitable as a modulation source or for 1950s laboratory sounds).

TANGUY's oscillators are capable of complex timbres. Oscillator one can blend all the waveforms together. The sine wave is present within each wave form, so its inclusion here allows the user to emphasize the fundamental frequency as desired. Oscillator Two has waveshaping provided by the Shaping slider. Add a subtle edge or gritty distortion to its waveform.

FM AMT. controls the amount of Frequency Modulation each oscillator receives from the other. Oscillator One is frequency modulated by Oscillator Two's currently selected waveform. Oscillator Two is frequency modulated only by the Sine wave output. This allows fine grained control of cross-modulation (when both oscillators are modulating each other's frequency).


Noise is useful for adding a slightly imperfect tone to the sound in subtle amounts, for wind/ocean sounds, and for percussive effects. TANGUY's White noise is an even "static" sound. All other Noise types are approximated with bad mathematical guess work. Unfortunately, these types of noise do not reflect the character of their color naming, but are useful as varieties of digital noise. I consider these unconvincing approximations to be the weakest aspect of TANGUY.

External Input

TANGUY can process external input through its filter, amp, and delay section. In order to do this, you must grant it access to your microphone when you are prompted. The last presets included in TANGUY demonstrate a variety of effects for processing live vocals or instruments. In many cases, it will be best to increase VCA Gain so that you can hear your input without needing to play TANGUY's keyboard to open the amp.


The mixer allows the user to control the relative volume of the possible sound sources. These are exponential so that nice smooth blending can be achieved by playing the mixer controls in real time (if desired).


The output from the mixer goes into the filter where it is modified further. A filter controls the brightness or darkness of a sound by subtracting frequencies (and optionally emphasizing frequencies at the cutoff point). Filters are interesting to play with in real time for their characteristic whirling, gurgling sound and a variety of other effects. Cutoff determines where in the frequency spectrum to attenuate frequencies. Res. (for resonance, but sometimes called Q, Peak, or Emphasis) determines the amount of emphasis to give to frequencies at the cutoff point.

Env. Amt. can be adjusted positively or negatively from its initial point (0 in the INITIALIZE patch) to determine the depth and direction of the filter envelope's shape. This will be explained in greater detail further on.

KBD. is the amount of keyboard tracking. This increases the cutoff more as higher notes are played on the keyboard. It's most useful and noticeable when the filter is in Low Pass mode.

TANGUY has a multimode filter that functions as four different filter types and bypass. LP sets TANGUY to Low Pass mode. Frequencies below the cutoff point will be removed. BP means Band Pass mode. A band of frequencies is allowed to pass through unattenuated. HP is High Pass mode. Frequencies below the cutoff point will be attenuated. Notch is kind of an opposite of Band Pass mode: frequencies within the band will be scooped out. Turning the filter mode to Off will bypass the filter entirely. It is useful for quickly testing if the filter settings are removing all the sound or creating the brightest possible sound. Notice the effect of turning off the filter on the INITIALIZE preset.

Envelope Generators

TANGUY has a fairly traditional envelope generator configuration: one envelope generator for the filter and one for the amplifier. Envelope generators determine the rate of change over time. For the purposes of understanding, it is probably simplest to demonstrate this with the VCA Envelope Generator.

On a typical synthesizer, a key pressed down sends a signal to the envelopes that begins the process of shaping a sound parameter over time. For this example, I will use the VCA (Voltage Controlled Amplifier—or simply volume).

The first stage of an envelope generator is the Attack. If this is set to 0, the parameter controlled by the envelope will begin at its maximum amount. A long Attack setting in the VCA will slowly fade in until the maximum point is reached.

Once the maximum point is reached, the envelope reduces the parameter to the Sustain level at a rate determined by Decay. If Sustain is set to maximum, Decay will have no effect.When the Sustain level is reached, it will remain constant until the key is released.

The final stage is the Release. This is the rate that determines how slowly the parameter controlled by the envelope generator returns to its starting point. For the VCA, this is VCA Gain. For the Filter Envelope, it's the level determined by Cutoff.

The filter envelope can be inverted. Everything is opposite in that case and it becomes difficult to explain how it works. For the best chance at figuring it out, try setting the filter mode to HP and a high (or even maximum) Cutoff.

VCA Gain is useful for playing the synthesizer constantly at a low volume (good for droning sounds), creating sustained special effects, and opening the amp to allow external input through.


An LFO is a Low Frequency Oscillator. Instead of following the pitch of the keys, LFOs are typically too slow to be perceived as pitch. LFO frequency ranges are often less than 1Hz to ~20Hz. Any modulation faster than 20Hz is considered audio rate, but the effect is more pronounced at higher frequencies. Since LFOs are mostly too low to hear, they are routed to other parameters of the sound to modulate them over time. TANGUY's LFO can individually affect the Pitch, Filter, and Amplifier simultaneously. In the INITIALIZE preset, no modulation is provided by default.

The shape of the LFO determines the effect of the modulation. For example, Sine waves will make smooth changes and Square waves will instantly flip between two values. The Ramp wave is an inversion of the Saw wave, so it will have opposite effects.

Rate is the frequency of modulation. TANGUY provides a very wide range of LFO operation, so sticking to the lower third might be ideal for getting used to the effects of an LFO.

The overall amount of modulation is determined by the Mod. slider to the left of the keyboard. If this is set to 0, the LFO will have no effect. Synth players often use mod wheels for real time control over the depth of the LFO, so TANGUY provides this possibility.


TANGUY has a cascading delay effect controlled by two parameters. Echoes can be created up to two seconds long with Rate at its maximum value. Reverb effects can be achieved by setting Rate to a minimum amount and Amount to approximately halfway. With Rate at its minimum value, Amount creates a sort of overdriving distortion effect.


Poramento is the slurring of one note into another. TANGUY comes with two types: Exp. for exponential (classic glide) and Lin. for linear (a Roland TB-303-esque constant rate slide). The effect of the Amount slider is set appropriately for the chosen type of portamento: exponential has a greater maximum amount.


If TANGUY is not producing sound, check filter cutoff, filter mode, mixer levels, and amp envelope settings. It's likely that the output from the mixer is being totally filtered out, or that the amp is never opening.

Planned Improvements

I'm working on much better support in Firefox. There are problems with the envelopes, FM feedback, and too small click targets on buttons.

I want to fix the responsive versions for Android devices to avoid the high C key from dangling onto the next row (without causing problems on iOS).

The Sass still needs cleaning up, and there are probably performance enhancements to made to jQuery selectors and event bindings.

Copyright © 2014–2015 Luke Teaford.