Updated

curve

Three oscillators, drawn as a glowing 3D oscilloscope figure.

curve: a glowing green 3D wireframe curve on black, beside a panel of live waveforms and oscillator sliders

What it is

curve treats sound as geometry. Three oscillators, one per axis, are read back as waveforms and plotted against each other, which draws a Lissajous-style figure in 3D that glows, trails and bends as you retune them. Frequencies in simple ratios, like the default 1:2:3, lock into a stable shape; nudge one off and the figure starts to drift and turn.

The oscillators never reach your speakers; they exist only to shape the picture. Retune them with the sliders, with the mouse, or with the knobs of a MIDI controller. You can also mix your microphone into any of the three axes, or let its level turn the line's color.

How it works

  • Each axis is a sine oscillator (220, 440 and 660 Hz by default) summed with its own LFO, feeding a gain node and an analyser.
  • Every frame, the three analysers' time-domain samples become (x, y, z) points, smoothed with a moving average and a Catmull-Rom curve.
  • Recent curves stay on screen as fading trails, and three.js bloom and afterimage passes add the glow.
  • The microphone, only when switched on, runs through an input gain into a three-way mixer, one send per axis. Its level can also rotate the hue, and each line keeps the color it was drawn with, so the trail shows the level over time.
  • Web MIDI control-change messages map to oscillator and LFO frequencies through a sigmoid curve, so knobs feel even across the range. The CC numbers can be remapped, and controllers plugged in later are picked up.
  • Pointer mode sweeps the frequencies as the cursor or a finger moves: the horizontal position sets X, the vertical sets Z and Y sits between them, while bloom and trail length follow along.
  • The Tweakpane panel shows each axis's waveform live, in the line's color, plus an FPS graph. Copy Preset Link stores the current settings in a ?preset= URL, so a shape can be shared or revisited.

Built with

  • three.js
  • Web Audio
  • Web MIDI
  • Tweakpane
  • Rollup

Started