Advertisement
UI & Interface Sounds

How to Add Vowel-Like Movement to Voice Blips with Formant Modulation

A practical guide to formant modulation for voice blips, covering the F1 and F2 frequencies that define vowels, the Q values that set the resonance width, and the Web Audio filter chain that morphs a blip between vowel-like shapes.

A voice blip with a pitch envelope has a shape. It rises, falls, or stays flat. The shape signals intent, and the pitch envelope guide covers the specific curves. But a pitch envelope alone still sounds like a single tone that moves. It does not sound like a mouth changing shape.

The mouth changing shape is what formants do. A formant is a resonant peak in the vocal tract's frequency response, and the first two formants — F1 and F2 — are the acoustic features that define which vowel a listener hears. When a voice transitions from one vowel to another, F1 and F2 move to new frequencies, and the ear reads the movement as a mouth changing shape rather than as a pitch sliding.

For a voice blip, formant modulation is the technique that turns a short tone into something that sounds like a syllable. The blip does not need to form a real word. It needs to move between two vowel-like shapes fast enough that the ear reads the movement as articulation rather than as a filter sweep.

This article covers the specific F1 and F2 frequencies for the vowels that work in short blips, the Q values that set the resonance width, and the Web Audio filter chain that morphs between two vowel sets within a 40-millisecond window.

Why does a pitch envelope alone not sound like a vowel?

A pitch envelope changes the fundamental frequency of a sound. The fundamental is the lowest frequency in a periodic waveform, and changing it changes the perceived pitch of the entire sound. A voice blip with a rising pitch sounds like the same vowel being spoken at a higher pitch, not like the mouth moving from “ah” to “ee.”

Formants are independent of the fundamental. F1 and F2 sit at specific frequencies regardless of what pitch the voice is producing. A male voice and a female voice saying “ee” have different fundamentals but similar formant frequencies (scaled slightly by vocal tract length). The formants are what the ear uses to identify the vowel, and the fundamental is what the ear uses to identify the pitch.

Parameter What it changes What the ear hears
Fundamental (F0) The pitch of the voice Higher or lower voice
F1 The first formant peak Openness of the mouth (low F1 = closed, high F1 = open)
F2 The second formant peak Frontness of the tongue (high F2 = front, low F2 = back)

The interaction between F1 and F2 is what defines the vowel. A high F1 with a high F2 is an “ah” sound. A low F1 with a high F2 is an “ee” sound. A low F1 with a low F2 is an “oo” sound. The pitch envelope can move the whole vowel up or down, but it cannot change which vowel the listener hears.

This is why a voice blip with only a pitch envelope sounds like a synthesized tone rather than a character speaking. The ear expects formant movement when it hears a voice-like sound, and the absence of that movement is what makes the blip feel mechanical.

What are the F1 and F2 frequencies for the vowels that work in short blips?

The vowels that work best in a 40- to 60-millisecond blip are the ones whose formant frequencies are far enough apart that a short movement between them is audible. The vowels /i/ (as in “bead”), /ɛ/ (as in “bed”), /ɑ/ (as in “bad”), and /u/ (as in “food”) cover a wide enough formant space that a blip can morph between two of them and be heard as articulation.

The values below are typical for American English male speakers, from the Imperial College London phonetics reference. The exact values vary by speaker, but the relationships between them are consistent across speakers of the same language.

Vowel IPA Example F1 (Hz) F2 (Hz)
“bead” /i/ bead 280 2250
“bed” /ɛ/ bed 550 1770
“bad” /ɑ/ bad 690 1660
“food” /u/ food 310 870
“bird” /ɜ/ bird 480 1250

The vowel /i/ has the lowest F1 and the highest F2, which is why it sounds bright and closed. The vowel /ɑ/ has the highest F1 and a low F2, which is why it sounds open and dark. The vowel /u/ has a low F1 and a low F2, which is why it sounds round and closed. The distance between F1 and F2 is what gives each vowel its character.

For a voice blip, the movement between two vowels is what matters, not the absolute values. A blip that starts at /ɛ/ (F1 550, F2 1770) and moves to /i/ (F1 280, F2 2250) over 40 milliseconds is a blip that sounds like the mouth is closing and the tongue is moving forward. The ear reads this as a transition from an open vowel to a closed one, which is a common shape in speech.

The Animalese comparison covers how Animal Crossing uses vowel-like movement in its dialogue system. The formant values in this article are the specific numbers that make that kind of movement possible in a synthesized blip.

How do you set the Q values for the formant filters?

Each formant is implemented as a band-pass filter or a peaking filter centered on the formant frequency. The Q value determines how narrow the peak is. A high Q produces a sharp, narrow resonance; a low Q produces a broad, gentle peak.

The formant bandwidths in natural speech are typically 50 to 100 Hz for F1, 80 to 120 Hz for F2, and 110 to 170 Hz for F3. The Q value is the center frequency divided by the bandwidth. A 550 Hz formant with a 90 Hz bandwidth has a Q of about 6.1. A 2250 Hz formant with a 110 Hz bandwidth has a Q of about 20.5.

Formant Center frequency Typical bandwidth Q value
F1 (open vowel) 550–690 Hz 90–110 Hz 5–7
F1 (closed vowel) 280–310 Hz 90 Hz 3–4
F2 (front vowel) 1770–2250 Hz 110 Hz 16–20
F2 (back vowel) 870–1250 Hz 110 Hz 8–11

The Q values for a voice blip do not need to be as precise as the values for a speech synthesizer. A blip is 40 to 60 milliseconds long, and the ear does not have time to resolve the exact bandwidth of each formant. The important thing is that the filter is narrow enough to create a perceptible peak and wide enough that the peak is not a single frequency.

A Q of 5 to 10 for F1 and a Q of 10 to 20 for F2 produces a blip that has clear formant structure without sounding like a whistle. A Q that is too high makes the blip sound like a sine wave at the formant frequency; a Q that is too low makes the blip sound like a broadband noise burst with no vowel character.

The FM synthesis guide covers the spectral side of voice blips; the formant filter is an alternative approach that produces a different kind of vowel character. The two can be combined, but for most voice blips, the formant filter alone is sufficient.

How do you implement a formant filter chain in the Web Audio API?

The Web Audio API provides the BiquadFilterNode, which has a type property that can be set to 'bandpass' or 'peaking'. A band-pass filter passes frequencies around its center and attenuates everything else; a peaking filter boosts frequencies around its center without attenuating the rest. For formant synthesis, the band-pass type is the more common choice because it isolates the formant peak and removes the fundamental and other frequencies that would otherwise mask the vowel character.

The implementation chains two band-pass filters in series: one for F1 and one for F2. The output of the first filter feeds the second, and the output of the second feeds the destination. The source can be any harmonically rich oscillator or noise source. For a voice blip, a sawtooth oscillator is the best choice because it contains all harmonics and the formant filters will select the ones that fall within their passbands.

function playFormantBlip({
    f1Start = 550,
    f2Start = 1770,
    f1End = 280,
    f2End = 2250,
    duration = 0.05,
    volume = 0.5
} = {}) {
    const ctx = getAudioContext();
    const now = ctx.currentTime;

    const osc = ctx.createOscillator();
    osc.type = 'sawtooth';
    osc.frequency.value = 200; // low fundamental

    const f1 = ctx.createBiquadFilter();
    f1.type = 'bandpass';
    f1.Q.value = 7;
    f1.frequency.setValueAtTime(f1Start, now);
    f1.frequency.exponentialRampToValueAtTime(
        f1End, now + duration
    );

    const f2 = ctx.createBiquadFilter();
    f2.type = 'bandpass';
    f2.Q.value = 15;
    f2.frequency.setValueAtTime(f2Start, now);
    f2.frequency.exponentialRampToValueAtTime(
        f2End, now + duration
    );

    const gain = ctx.createGain();
    gain.gain.setValueAtTime(0, now);
    gain.gain.linearRampToValueAtTime(volume, now + 0.002);
    gain.gain.exponentialRampToValueAtTime(0.001, now + duration);

    osc.connect(f1);
    f1.connect(f2);
    f2.connect(gain);
    gain.connect(ctx.destination);

    osc.start(now);
    osc.stop(now + duration + 0.01);
}

The exponential ramps on the filter frequencies are what create the vowel movement. A linear ramp would produce a mechanical slide; an exponential ramp produces the non-linear movement that the ear reads as a mouth changing shape. The pitch envelope guide covers the same curve-type principle for pitch; the formant filters use the same ramps on frequency.

The Q values of 7 and 15 are starting points. A Q of 7 for F1 produces a peak that is narrow enough to define the vowel but wide enough that the fundamental is not completely removed. A Q of 15 for F2 produces a sharper peak, which is what makes the frontness of the vowel audible. The band-limited impulse guide covers the filter behavior in more detail; the formant filter is a specific application of the same biquad topology.

The source oscillator's frequency is set to 200 Hz, which is a low fundamental that provides harmonics across the entire formant range. A higher fundamental would leave gaps between harmonics, and the formant filters would have less material to work with. For a voice blip, the fundamental is less important than the formant movement; the ear reads the formants as the vowel and the fundamental as the pitch, and the pitch can be static while the formants move.

How do you morph between two vowels within a 40-millisecond blip?

The morph is a simultaneous ramp of F1 and F2 from the starting vowel's values to the ending vowel's values. The ramp duration should be the blip's full duration, so that the movement completes just as the envelope closes. A movement that finishes before the envelope closes produces a blip that ends on a static vowel; a movement that continues after the envelope closes is wasted.

The most useful vowel pairs for a short blip are the ones where F1 and F2 move in opposite directions. The pair /ɛ/ to /i/ moves F1 down (550 to 280) and F2 up (1770 to 2250), which reads as the mouth closing and the tongue moving forward. The pair /ɑ/ to /u/ moves F1 down (690 to 310) and F2 down (1660 to 870), which reads as the mouth closing and the tongue moving back. The pair /i/ to /ɛ/ moves F1 up (280 to 550) and F2 down (2250 to 1770), which reads as the mouth opening.

Start vowel End vowel F1 movement F2 movement Reads as
/ɛ/ (bed) /i/ (bead) 550 → 280 (down) 1770 → 2250 (up) Mouth closing, tongue fronting
/ɑ/ (bad) /u/ (food) 690 → 310 (down) 1660 → 870 (down) Mouth closing, tongue backing
/i/ (bead) /ɛ/ (bed) 280 → 550 (up) 2250 → 1770 (down) Mouth opening
/u/ (food) /ɑ/ (bad) 310 → 690 (up) 870 → 1660 (up) Mouth opening, tongue fronting

The blip does not need to complete the full movement between two vowels. A partial movement, from /ɛ/ halfway to /i/, is often enough to read as articulation without taking the blip all the way to a recognizable vowel. The partial movement is shorter and less dramatic, which makes it more suitable for frequent dialogue blips.

The movement should be synchronized with the amplitude envelope. The amplitude envelope starts at zero, ramps up over 2 milliseconds, and decays over the remaining duration. The formant movement should start at the same time as the amplitude ramp and finish at the same time as the decay. This synchronization is what makes the vowel movement feel like part of the blip rather than like a filter applied on top.

What does a formant-modulated voice blip sound like in a dialogue system?

The test for a formant-modulated blip is whether it reads as a syllable rather than as a tone. A blip with formant movement sounds like a consonant-vowel transition compressed into a few dozen milliseconds. A blip without formant movement sounds like a beep.

The first test is the vowel test. Play the blip and ask whether it sounds like it contains a vowel. If the answer is yes, the formant filters are doing their job. If the answer is no, the Q values are too high (the filters are too narrow to pass a range of frequencies) or the source oscillator is too simple (a sine wave has no harmonics for the filters to shape).

The second test is the movement test. Play the blip and ask whether the vowel seems to change during the blip. A blip that stays on a single vowel sounds static; a blip that moves between two vowels sounds like articulation. The movement is the difference between a voice blip that sounds like a character speaking and one that sounds like a test tone with a filter on it.

The third test is the context test. Play the blip in a dialogue line and ask whether it blends with the other blips. A formant-modulated blip that is designed in isolation can sound out of place when played alongside blips that use a different synthesis approach. The voice-blip mixing guide covers the consistency requirement; the formant blip should share the same fundamental and envelope character as the rest of the set, even if its vowel movement is unique.

The fourth test is the fatigue test. Play the blip for thirty seconds of continuous dialogue and ask whether it becomes grating. Formant-modulated blips are less fatiguing than pitch-swept blips because the movement is slower and the spectral changes are less extreme. A blip that survives thirty seconds is a blip that will survive a full conversation.

Formant modulation is not a replacement for pitch envelopes. It is an additional dimension that can be combined with pitch movement to produce a richer voice character. A blip that moves both its pitch and its formants sounds more like a voice than a blip that moves only one. The visual novel blip guide covers the per-character frequency separation; formant movement is the dimension that separates characters whose fundamental frequencies are similar but whose vowel shapes are different.

Generate a Reference Blip for Formant Comparison

Open the SfxMaker blip generator and create a blip at 550 Hz with a sawtooth waveform and a 50 ms decay. Use this as the comparison point for the formant-modulated blip: the formant version should have a similar fundamental and envelope, but the vowel movement should make it sound like a syllable rather than a tone. If the formant version sounds like a different pitch, the fundamental is wrong; if it sounds like a different length, the envelope is wrong.

Open Blip Sound Generator →
Advertisement