Three synchronized views of the same audio signal: time domain, frequency domain, and spectrogram. Click any spectrum bar to audition that frequency.
Window
How it works
The FFT (Fast Fourier Transform) converts a time-domain signal into its frequency components. The waveform shows amplitude over time; the spectrum shows amplitude over frequency at a single moment; the spectrogram shows how the spectrum evolves over time — frequency on Y, time on X, amplitude as color.
Section 3
Waveform Sculpture Studio
A 2-second waveform extruded into 3D space. Drag to rotate. Three extrusion geometries reveal how time can become spatial form.
Depth
Waveform as sculpture
Time becomes space. The same data, a different dimension. When a waveform is extruded, revolved, or helixed through three-dimensional space, we perceive the temporal structure as a spatial object. Sculptors like Anish Kapoor and architects like Zaha Hadid have used sound waveforms as generative forms.
Section 4
Synchresis Lab
Michel Chion's discovery: any synchronized sound and image feel connected. Mix any animation with any sound and rate the result.
Animation
Sound
Chion's Synchresis
Michel Chion coined "synchresis" — a portmanteau of synchronism and synthesis — to describe the spontaneous welding of sound to image when they occur simultaneously, regardless of any logical connection. Try pairing a cymbal crash with the door opening, then with the bouncing ball. Both feel "right."
Section 5
Audio-Reactive Shader Lab
Five Canvas2D simulations model what GLSL shader uniforms do. Real-time audio values drive visual parameters as floating-point uniforms.
u_speed
u_scale
u_intensity
u_color
GLSL Uniforms
In real GPU shaders, uniforms are global variables passed from the CPU each frame. A live performer routes audio analysis values (bass energy, spectral centroid, RMS amplitude) into shader uniforms to make visuals react in real time. This lab shows the same principle using Canvas2D arithmetic.
Section 6
Spectrum Painting
Paint directly on the spectrogram canvas. Each row is a frequency, each column a moment in time. Press Play Canvas to hear what you've drawn.
BrushOpacity
Aphex Twin & Spectrogram Art
Richard D. James (Aphex Twin) embedded a self-portrait in the spectrogram of "Windowlicker" (1999) using a technique where pixel brightness at a given frequency-time coordinate produces sound at that frequency. Drawing on a spectrogram is composing in the frequency domain — you sculpt the harmonic structure of sound visually.
Section 7
AV Composition Timeline
A 60-second AV score. Add blocks to each lane to define audio textures, visual scenes, and parameter mappings. Then play the composition.
Audio
Visual
Mapping
Click lane to add · Right-click block to delete
AV Performance Structure
Live AV performers structure sets like a score: audio textures, visual behaviors, and parameter mappings change on cue. This timeline models that paradigm — each lane is a separate dimension of expression that can evolve independently, creating counterpoint between sound, image, and their relationship.
Section 8
The Oscilloscope Artist
X-Y Lissajous figures created by two oscillators. Adjust frequency ratios and phase to sculpt complex figures. A tradition dating back to Jules Antoine Lissajous (1857).
X Freq440 Hz
Y Freq440 Hz
Phase0°
PersistenceSymmetry
RotationColor Mode
Circle 1:1 · 0°
Figure-8 1:2 · 0°
Trefoil 1:3 · 90°
Star 3:4 · 45°
Pentagram 2:5 · 90°
Lemniscate 1:2 · 45°
Butterfly 2:3 · 45°
Pentagon 1:5 · 90°
Hypocycloid 3:4 · 0°
Spiral 1:1.01 drift
Noise Field random
Clover 3:2 · 90°
Section 9
Visual Music History
From Bainbridge Bishop's color organ (1877) to AI-generated AV synthesis — the 150-year arc of audiovisual art. Click a node to expand.
Section 10
Key Artists
Eight practitioners who defined the audiovisual art form across different eras and approaches.
Section 11
Glossary
Twenty terms from the vocabulary of audiovisual performance, sound studies, and signal processing.