coolsoup/src/generators/waveform-generator/README.md

Waveform Generator

A standalone module for generating random procedural waveforms with various interpolation methods and smoothing techniques.

Features

• Multiple Interpolation Types: Linear, exponential, logarithmic, and cubic curves
• Randomness Strategies: Uniform, Gaussian, and smooth distributions
• Variable Resolution: 8-64 control points for different levels of detail
• Smooth Rendering: Anti-aliased curves with bezier interpolation
• Configurable Aesthetics: Line width, colors, and smoothness controls

Quick Start

import { generateRandomWaveform } from './waveform-generator'

// Generate a single random waveform
const waveform = generateRandomWaveform()
document.body.appendChild(waveform.canvas)

// Generate with custom configuration
const customWaveform = generateWaveform({
  splits: 32,
  interpolation: 'cubic',
  randomness: 'smooth',
  lineWidth: 3,
})

API Reference

Main Functions

generateWaveform(config?)

Generate a waveform with optional configuration override.

generateRandomWaveform()

Generate a waveform with randomized parameters for maximum variety.

generateWaveformBatch(count)

Generate multiple random waveforms efficiently.

Configuration

interface WaveformConfig {
  width: number // Canvas width (default: 256)
  height: number // Canvas height (default: 256)
  splits: number // Number of control points (8-64)
  interpolation: InterpolationType // Curve type
  randomness: RandomnessStrategy // Distribution strategy
  lineWidth: number // Stroke width (1-4)
  backgroundColor: string // Background color
  lineColor: string // Line color
  smoothness: number // Curve smoothness (0-1)
}

Interpolation Types

• Linear: Straight lines between points
• Exponential: Accelerating curves (slow → fast)
• Logarithmic: Decelerating curves (fast → slow)
• Cubic: Smooth bezier-like curves

Randomness Strategies

• Uniform: Pure random distribution (maximum variation)
• Gaussian: Bell-curve distribution (center-biased)
• Smooth: Smoothed random with edge tapering

Algorithm

1. Control Point Generation: Create evenly-spaced X coordinates with random Y values
2. Randomness Application: Apply distribution strategy (uniform/gaussian/smooth)
3. Smoothing: Optional smoothing and tension application
4. Interpolation: Generate curve points between control points
5. Rendering: Draw smooth anti-aliased curves to canvas

Project Structure

waveform-generator/
├── core/
│   ├── types.ts           # Interfaces and configuration
│   ├── interpolation.ts   # Curve interpolation functions
│   └── generator.ts       # Control point generation
├── renderer/
│   └── canvas.ts          # Canvas rendering with smooth curves
├── index.ts               # Main exports
└── README.md              # This file

Examples

Basic Waveform

const simple = generateWaveform({
  splits: 16,
  interpolation: 'linear',
})

Smooth Organic Curves

const organic = generateWaveform({
  splits: 24,
  interpolation: 'cubic',
  randomness: 'smooth',
  smoothness: 0.7,
})

Sharp Electronic Waveform

const electronic = generateWaveform({
  splits: 32,
  interpolation: 'exponential',
  randomness: 'uniform',
  lineWidth: 1,
})

The generated waveforms are perfect for audio visualization and spectral synthesis applications.