Original post date: January 3, 2026

About this post

This post goes through the process of converting an input file (a .wav file) to wavetables, and finally playing them back.

I used some older code I had lying around (for example the wavetable interpolation and WebAudio playback logic). With AI-assisted coding (the sequencer was built mostly from prompts), I could get most of the interactive pieces working quickly.

Overall, it has become noticeably easier to prototype something like this compared to just a few years ago.

Wavetable synthesis

MusicAcousticsProgramming

Steps

  1. Load a WAV file
  2. Visualize the waveform
  3. Compute YIN / CMNDF heatmap
  4. Pick fundamental + harmonic tracks
  5. Slice into wavetables
  6. Smooth + play back
  7. Presets + sequencer

You can try playing around with the steps, or you can instantly try an example where I'm saying "Kai Saksela" by pre-filling it with some example data .

Step 1

Load a WAV file

Step 2

Visualize the waveform

Waveform

Load a WAV file to see its waveform.

Step 3

Compute YIN / CMNDF heatmap

Potential fundamentals / CMND

YIN window: 0 samples · hop: 0 samples

Load a WAV file to visualize the YIN window.

Cursor slice

Hover the heatmap to update

No slice selected.

This is the YIN cumulative mean normalized difference (CMND) function over time. Lower CMND (more periodic) is shown as yellow; higher CMND is blue.

Step 4

Pick fundamental + harmonic tracks

Chosen fundamental

YIN window: 0 samples

Load a WAV file to see YIN valley tracks.

First local strong minima are selected. Then the fundamentals expand left/right over time following local "valleys" and merge when they connect. Tracks stop when the valley is no longer clear. Longer and less varying tracks are preferred.

Step 5

Slice into wavetables

Wavetables

Load a WAV file to build wavetables.

Each segment’s FFT values are taken at harmonics of the segment's fundamental, then a 2048-sample one-period wavetable is synthesized from the harmonic magnitudes and phases.

Step 6

Smooth + play back

Wavetable player

Audio playback is available in the browser.

Playback uses a shared AudioContext and an AudioWorklet for real-time playback.

Step 7

Presets + sequencer

Step 7

Presets + sequencer

Sequencer playback is available in the browser.

Playback uses an AudioWorklet with 5-voice polyphony at 120 BPM.