尚未偵測到更新。GitHub 發布版本後會顯示在這裡。
依最近已完成的 8 小時觀測回合間的 GitHub 星號增量排序
Rebuild reference videos as editable AI motion graphics for product demos and launch videos. Download MotionClone for Windows or explore the early-access online studio.
翻譯準備中
個人 GitHub 帳號下公開儲存庫的擁有者可以登入並驗證所有權，自行管理介紹，無需管理員核准。
登入並產生驗證檔案，在 30 分鐘內將其提交至此儲存庫的預設分支。其他分支或分叉儲存庫中的檔案無效。然後在下方檢查檔案，即可無需管理員核准直接管理專案。請保留檔案以維持管理權限。
如需登入，將前往登入頁面。登入後請回到此處，再次點擊所選的驗證按鈕。
在專案資料夾中執行 /nomorevibe verify，即可驗證所有權並自行管理介紹。
一分鐘完成驗證正在載入完整 README。 以下為已儲存的摘錄。
Interactive browser-based music visualizer with real-time frequency analysis. Built with TypeScript, p5.js, and Tone.js.
Created by Tao Ong with Claude Code.檢視完整 README ↗Interactive browser-based music visualizer with real-time frequency analysis. Built with TypeScript, p5.js, and Tone.js.
Created by Tao Ong with Claude Code.
npm install
npm run dev
Open http://localhost:3000. Upload a track or use the built-in sample.
A "friendly Hydra" visual instrument lives at /instrument.html (run npm run dev, then open http://localhost:3000/instrument.html). Chain 8 candy-colored blocks (sources → transforms → fx), patch Kick/Bass/Hats onto any knob, map a DJ controller over Web MIDI, and perform from the macro deck with palette scenes and an XY pad. Chain, patches, MIDI bindings, and palette persist in localStorage. Code is additive under src/instrument/ and does not touch the main app.
| Key | Mode | Description |
|---|---|---|
1 | Circle | Rotating spike circle driven by frequency bands |
2 | Spectrum | Horizontal bar chart of amplitudes |
3 | Tunnel | Octave-based concentric rings with glow effect |
4 | Balls | Physics-based bouncing balls with kick boost |
5 | Lasers | Concert laser light show with beat-synced beams |
6 | Text | Beat-synced text in 7 cycling visual patterns |
7 | Highway | Audio-reactive highway drive; perspective road with beat-synced lane markings and headlight flares; freq bands drive scenery and road color; Three.js WebGL overlay |
8 | Liquid Metal | Molten chrome icosphere; Three.js PBR with IBL environment; amplitude deforms mesh vertices; GlitchPass fires on transients |
N | Neon Grid | Three.js synthwave terrain with audio-driven height displacement and bloom |
G | Image Grid | 16×16 mosaic of 3D tiles viewed from above; column height driven by frequency band; beat → radiating lift-wave; upload an image to see it sliced across the tiles |
U | Sculpture | 8 flat panels in a circle showing image strips; beat-synced camera orbit with audio-reactive tilt, glow, and spacing |
B | Binary | Matrix-style cascading binary/ASCII characters; columns mapped to frequency bands with beat-synced wave ripple |
W | Ripple Tank | Physics-inspired wave interference; 7 freq-band point-sources emit circular waves with beat-triggered shockwaves |
Y | Cymatics | Chladni plate simulation; particles drift toward nodal lines of standing wave modes driven by frequency bands; beats scatter particles |
J | Strange Attractor | Lorenz attractor chaos theory; particles trace butterfly-shaped 3D paths; audio warps system parameters; beats jolt the attractor |
Cycle through visualizations with the arrow keys, or pick one from the sidebar dropdown.
| Key | Action |
|---|---|
Space | Play / Pause |
← / → | Previous / next visualization |
↑ / ↓ | Volume up / down |
M | Mute / Unmute |
F | Toggle fullscreen |
S | Toggle sidebar |
R | Randomize settings |
I | Toggle image upload / remove |
H | Return to home screen |
? | Show shortcuts help |
Esc | Close overlays |
ios/)The web app is wrapped as a native iOS app via Capacitor, bundle ID com.taoong.musicvisualizer. No visualization code changes — Capacitor loads the same production build (dist/) inside a WKWebView, so rendering performance is identical to the mobile web version.
npm run cap:sync # tsc + vite build, then copy dist/ into ios/App/App/public and sync plugins
npm run cap:open:ios # open the native project in Xcode
From Xcode, select a simulator or device and hit Run. Swift Package Manager resolves Capacitor's native dependencies automatically on first build (no CocoaPods needed). Re-run npm run cap:sync after any web app change to pick it up in the native shell.
Microphone access (for the Microphone analysis mode) requires the NSMicrophoneUsageDescription entry already set in ios/App/App/Info.plist. Web MIDI is not available in iOS WKWebView, so the MIDI mapping overlay is a no-op there.
├── index.html # Main HTML with splash, sidebar, playback bar
├── style.css # All styles
├── src/
│ ├── main.ts # p5 sketch entry, render loop, audio pipeline
│ ├── state/store.ts # Centralized state (EventEmitter singleton)
│ ├── audio/ # Engine, FFT, processing, BPM detection (client-side)
│ ├── visualizations/ # One file per viz mode + shared helpers
│ ├── midi/ # MIDI manager (Web MIDI API, CC routing) + overlay UI
│ ├── ui/ # Controller, splash, playback, sliders, keyboard
│ ├── types/ # TypeScript interfaces + global type stubs
│ ├── utils/ # Constants, errors, formatting
│ └── assets/
│ ├── sample-source.mp3 # Built-in sample track (source of truth)
│ └── sampleAudio.ts # Generated base64 embed of the above (gitignored)
└── CLAUDE.md # Architecture reference for AI-assisted development
| Command | Description |
|---|---|
npm run dev | Start Vite dev server (port 3000) |
npm run build | Type-check + production build to dist/ |
npm run preview | Preview production build |
npm run lint | Run ESLint |
npm run lint:fix | Fix ESLint errors |
npm run format | Format code with Prettier |
npm run test | Run Vitest tests |
npm run test:watch | Run Vitest in watch mode |
npm run typecheck | Type-check without emitting |
npm run cap:sync | Build the web app and sync it into the iOS native project |
npm run cap:open:ios | Open the iOS project in Xcode |
ISC
E| Waterfall |
| 3D scrolling spectrogram: stacked ribbons of recent spectra receding into the distance; newest snapshot in front, older ones fade back with perspective and haze |
Z | Monolith | Tall faceted crystal obelisk; cinematic camera choreography (orbit, crash-zoom, Hitchcock dolly, snap-cut, top-down / worm's-eye, barrel rolls) all locked to the beat |
. | Stained Glass | Voronoi tessellation lit as a jewel-tone stained glass window; cells glow amethyst→ruby across 7 frequency bands; lead lines between panes; beat fires a warm flash and optionally shatters the mosaic |
, | Blobs | Audio-reactive metaball field; 7 biomorphic orbs (one per freq band) drift via Perlin noise and fuse organically when amplitudes rise; beat bursts them outward |
/ | Gray-Scott | Gray-Scott reaction-diffusion chemical simulation; Turing patterns (spots, stripes, mazes) driven by feed/kill parameters; sub-bass seeds activator, beats inject central pulse and rotate hue palette |
~ | Growth | Differential growth simulation; 7 closed curves grow by node insertion, fold like coral and brain sulci via spatial-hash repulsion; amplitude drives glow and growth speed |
@ | Pixel Sort | Glitch-art column pixel sorting inspired by Kim Asendorf's "Mountain Tour"; synthetic plasma field (7 freq-band hue zones) sorted by luminance; bass lowers sort threshold; beats inject a sort surge |
# | Echoes | Polar slit-scan temporal mandala; each audio frame stored as an annular ring; rings radiate outward (newest innermost, oldest outermost); Twist morphs from concentric mandala to tight spiral; beat shifts 7-band hue palette |
$ | Physarum | Slime-mold agent-network simulation (Jeff Jones algorithm, Zach Lieberman 2025); agents sense pheromone trails and steer toward highest concentration; emergent self-organising mycelial web; beat scatters agents + hue jump; bass drives deposit rate; dominant band colours hue |
% | Op-Art | Audio-reactive Op-Art grid inspired by Victor Vasarely's "Vega-Nor" series (1969); NxN circles modulated by 7 per-band sinusoidal standing waves at increasing spatial frequencies plus a central Vasarely dome illusion; beat fires an expanding radial shockwave; Color slider morphs from black/white monochrome to full chromatic HSB |
^ | Geodesic | Up to 5 nested icosahedral wireframe shells rotating independently (each driven by a different audio frequency band); overlapping neon wireframes create iridescent crystalline interference patterns; 3-pass glow per edge; vertex node dots; beat fires angular impulses; inspired by teamLab's "Bubble Universe" (2024) |
& | Ribbons | N sinuous silk-ribbon strands float horizontally across the canvas, each driven by a frequency band; amplitude scales oscillation height; iridescent canvas-gradient glow (3 passes: outer halo, mid body, bright core) shimmers along each strand; beat fires a traveling snap wave; inspired by teamLab "Light Sculpture – Flow" (2024) |
* | Infinity Net | Dense hex-offset grid of semicircular arcs inspired by Yayoi Kusama's "Infinity Net" paintings (1958–ongoing); 7 concentric radial zones map to frequency bands (sub-bass at centre → brilliance at edge); amplitude pulses arc size; beat fires an expanding ripple ring; Palette slider morphs from Kusama's iconic white-on-black monochrome to full chromatic per-band colour |
_ | Zen Garden | Karesansui (枯山水) dry-rock-garden: rake lines flow across a warm sandy canvas, curving around stone formations; 7 frequency bands each govern a horizontal zone of the garden (sub-bass=deep rolling waves, brilliance=fine ripples); beat triggers a sudden re-raking phase-jump event; inspired by the Ryōan-ji temple garden in Kyoto (c. 1500) and Tokujin Yoshioka's sand installations |
! | Arabesque | 7 arabesque petals traced via John Whitney Sr.'s differential motion formula (r[k] = R· |
| | Murmuration | Boid flocking simulation; thousands of birds exhibit emergent separation/alignment/cohesion; each bird colored by velocity direction producing electric rainbow swirls; persistent trail buffer; beat triggers predator-event scatter + hue jump; inspired by Universal Everything "Future Self" (2012) |
+ | Facets | Jittered triangular mesh spanning the full canvas; each facet's hue maps to one of 7 frequency bands (amethyst→sapphire→aquamarine→emerald→topaz→amber→ruby, left to right); two orbiting virtual light sources sweep caustic highlights across the surface; Perlin noise continuously undulates vertices; audio amplitude brightens each band's facets from dark jewel-tone to blazing; beat bursts all vertices radially outward and flashes the surface blue-white; inspired by Quayola "Strata" series (2010–) |
> | Epicycles | Fourier series harmonic visualizer; 7 nested spinning circles (one per frequency band) trace an evolving Lissajous curve; bass drives the outermost arm, brilliance makes fine interior spirals; beat fires a hue jump; inspired by 19th-century harmonograph machines |
< | Halftone | Three CMY dot-screens at 15°/45°/75° composited via MULTIPLY blend on white, replicating offset-press colour mixing (C+M→indigo, M+Y→scarlet, C+Y→olive); each dot's radius is driven by the frequency band whose horizontal screen-zone it falls in, so bass swells the left of the canvas and treble sparkles the right; beat fires an expanding ring-pulse of swollen dots from canvas centre; inspired by Roy Lichtenstein "Drowning Girl" (MoMA, 1963) and the Ben-Day dot printing process |
Q | Circuit | PCB-trace neon routing; N nodes scatter across the canvas connected by smooth L-shaped bezier traces colored by frequency band (violet→magenta, left→right); signal pulses animate along traces; beat fires a cascade burst from random nodes and shifts the hue palette; inspired by Joshua Davis "Praystation" generative circuit-board design system (2001–2003) |
G | Caustics | Underwater light caustic patterns; 7 sinusoidal wave layers (one per frequency band) travel at evenly distributed angles and spatial scales; constructive interference focuses light into bright focal clusters that shift and shimmer with the music; power-law sharpening produces razor-thin caustic lines on a deep-navy background; radial vignette adds pool-depth atmosphere; beat fires a brightness surge and hue shift; inspired by Jason Bruges Studio light-dome installations and Izabela Pluta "Like folds in water (caustic network)" (2024) |
n | Knot | Torus knot T(2, q) rendered as 3 interleaved neon strands in pure p5.js 2D perspective (no Three.js); q oscillates between trefoil (3) and septafoil (7) as a beat-locked ease-out animation — every Nth beat (Beat Frequency slider, 1–8) flips q's direction of travel so the knot snap-then-settles into a new shape on each beat; strands colored by frequency register — sub+bass drives violet, mid drives teal, highs drive amber — with a 60° hue gradient along each strand; 3-pass phosphor glow; beat fires angular impulse + hue shift; bass amplitude inflates the torus; inspired by George W. Hart's topological mathematical sculpture at the Bridges Conference on Mathematical Art |
p | Penrose | Aperiodic rhombus tiling generated by recursively deflating a "sun" of 10 golden triangles via the Robinson-triangle substitution behind Penrose's P3 tiling; the whole lattice rotates slowly like a living mandala; 7 concentric radial zones map distance-from-centre to frequency bands (sub-bass at the core → brilliance at the rim), driving each tile's hue and brightness; beat fires an outward "deflation wave" that flashes tiles brighter and shifts the palette; Density slider sweeps recursion depth from a few bold radiating wedges to a fine lace-like lattice of thousands of tiny rhombi; inspired by the 2023 discovery of "the hat" and "the spectre" — the first true aperiodic monotiles (David Smith, Craig Kaplan, Joseph Myers, Chaim Goodman-Strauss) — and the renewed fascination it sparked with Roger Penrose's pioneering 1974 never-repeating tilings |
l | Fractal Flame | Audio-reactive iterated-function-system "chaos game"; a single point repeatedly jumps between 7 affine transforms (one per frequency band), each blending a rotation/scale/translation map with a nonlinear "variation" (sinusoidal, swirl, spherical, horseshoe, polar); thousands of jumps per frame accumulate into a luminous density+hue buffer rendered with exponential log-density tone mapping for an organic, glowing-nebula look; loud bands dominate the chaos game's transform-selection weight and inflate their lobe's geometry, while transient punches flare it brighter; beats trigger small random mutations of the transform "genes" so the attractor's shape continuously, organically reshapes itself with the music; inspired by Scott Draves' Fractal Flame algorithm (1992) and his Electric Sheep collaborative screensaver (1999–), which evolves flames via a genetic algorithm — https://en.wikipedia.org/wiki/Fractal_flame |
k | Disorders | Minimalist ink-on-dark lattice of straight strokes inspired by Vera Molnár's "(Des)Ordres" (1974) and "Interruptions" (1968–69) — the pioneering computer artist celebrated since her 2023 death as the "grandmother of generative art," who began both series with a dense grid of identical parallel lines, then algorithmically rotated them into "disorder" and erased sections as "interruptions"; the grid starts perfectly aligned along one shared diagonal; 7 vertical zones map to frequency bands (sub-bass at far-left, brilliance at far-right) and each band's amplitude rotates its zone's strokes toward their own fixed random angle; beats fire expanding circular "interruption" waves that erase and reseed a ring of strokes as they sweep across the lattice — https://www.artsy.net/article/artsy-editorial-vera-molnar-mother-computer-art-pioneered-future-abstraction |
q | Black Wave | Layered translucent wave silhouettes with parallax depth, inspired by teamLab's immersive "Black Waves" installation (2016–) — a continuous wave of black ink rendered in real time, its form shaped by the physics of fluid and the artists watching it — https://www.teamlab.art/w/black_waves/ — and Katsushika Hokusai's "The Great Wave off Kanagawa" (c. 1831); 7 frequency bands drive nested wave layers receding from a crashing sub-bass front wave to distant brilliance-band swells near the horizon; a ukiyo-e "bokashi" gradient sky shifts from indigo ai-zuri to vermillion Red Fuji; dry-brush ink strokes streak along each crest and foam particles spray where the front wave breaks on beats; sliders: Density (ink-stroke and foam richness), Swell (wave amplitude, calm rolling swells → towering waves), Hue (sumi-e monochrome → indigo ai-zuri → vermillion Red Fuji) |
t | Origami | A grid of parallelogram facets folds into a Miura-ori herringbone pleat — alternating peak and valley vertices rise and fall along each column's fold depth, warping the whole sheet like a single piece of creased cloth; 7 columnar zones map sub-bass (left) through brilliance (right) to the 7 frequency bands, louder bands folding their zone deeper; per-facet normal/light shading against the live height field gives each pleat sharp foil-like highlights and shadows; beats fire a diagonal "fold wave" that ripples once across the sheet, briefly deepening every pleat as it passes; inspired by Issey Miyake's "132 5." origami-based clothing line (Reality Lab, with computer scientist Jun Mitani's crease-pattern software, launched 2010) — https://www.dezeen.com/2010/10/05/132-5-by-issey-miyake/ — sliders: Fold (base pleat depth, nearly flat → dramatic accordion folds), Grid (tessellation density 6–24 columns), Wave (speed and reach of the beat-triggered fold wave) |
x | Light Field | A drifting 3D lattice of luminous orbs hangs in space, each point gently swaying on its own Perlin-noise current; 7 frequency bands each send a plane wave of brightness rippling through the lattice along its own 3D direction and spatial frequency, so different bands light up different slices of the field at once; a slowly orbiting, tilted camera projects the lattice to the screen with perspective scaling, and every beat fires an expanding spherical shell of brightness that sweeps outward through the points; 3-pass additive glow gives each orb a soft halo, coloured deep-ocean blue → cyan → violet/magenta by whichever band dominates it; inspired by Squidsoup's "Submergence" / "Ocean of Light" suspended-LED installations, immersive fields of thousands of points of light that drift and pulse overhead — https://www.squidsoup.org/portfolio/submergence-2/ — https://www.thisiscolossal.com/2013/01/submergence-an-immersive-field-of-8064-suspended-lights-by-squidsoup/ — sliders: Grid (lattice density, a few floating points → a dense starfield), Flow (wave speed, drift turbulence, and camera orbit speed), Glow (halo brightness around each point) |
d | Brush | Generative action painting inspired by Joan Mitchell's "La Grande Vallée" series (1983-84) — a suite of 21 monumental canvases of swirling, gestural brushwork in vibrant blues, greens, and yellows — https://www.wikiart.org/en/joan-mitchell/la-grande-vallee-xiv-for-a-little-while-1983; autonomous bezier-curve brush strokes spawn on beats and audio energy, each curving through Perlin noise; 7 frequency bands map to a warm-to-cool hue palette (amber bass → violet brilliance); each stroke animates tip-to-tail with 3-pass neon glow (wide outer halo, mid glow, bright core) and tapered thickness; beats shift the hue palette and spawn bold gestural marks from the dominant band; transients trigger spontaneous strokes; amplitude scatters fine paint-splatter particles; offscreen trail buffer with configurable fade creates layered abstract paintings that build up and dissolve with the music; mobile guard: 120 max strokes, 24 points per curve; sliders: Strokes (spawning rate, sparse → dense flurry), Weight (brush thickness, fine lines → bold sweeps), Trail (paint persistence, ephemeral → lasting painting) |
a | Aurora | Flowing luminous curtains of light inspired by Refik Anadol's "Infinity Room" data sculpture at Dataland (Los Angeles, 2026) — https://dataland.art/blog/infinity-room; multiple layered ribbons of light sweep across the canvas like aurora borealis or flowing data streams; each of 7 layers corresponds to a frequency band, driving brightness, vertical oscillation amplitude, and color; Perlin noise creates organic undulation; beat triggers a luminous surge and hue shift; offscreen trail buffer with additive blending creates ghostly persistence; mobile guard: half-resolution trail buffer, wider pixel step; sliders: Flow (curtain animation speed and turbulence), Layers (number of curtain layers 3–12), Glow (luminous halo intensity on each curtain edge) |
c | Glitch | Analog/VHS glitch art inspired by Nam June Paik's pioneering video art, specifically his magnetic CRT distortions in "Global Groove" (1973) — https://www.eai.org/titles/global-groove — and "Magnet TV" (1965), where audio and magnetic fields warped television signals into expressive, living abstractions; also draws from the contemporary glitch-art movement (Rosa Menkman, Phillip Stearns); 7 vertical color bars (one per frequency band) form a base signal reminiscent of SMPTE test patterns; bass frequencies bend scanlines horizontally, mid-range splits RGB channels into chromatic aberration fringes, treble injects analog static grain; beats trigger dramatic tracking-loss bars (bright horizontal distortion bands) and displaced rectangular block artifacts; CRT scanline overlay dims alternating rows; offscreen pixel buffer at ⅓ res (⅕ mobile) with two-pass rendering (base image generation then distortion); sliders: Distort (horizontal scanline displacement intensity), Split (RGB chromatic aberration channel separation), Noise (analog static grain density) |
} | Warp | Cosmic hyperspace starfield inspired by Ryoji Ikeda's "data.tron" (2007) — https://www.ryojiikeda.com/project/datamatics/ — monumental immersive installations that transform raw data into cascading points of light, creating the sensation of accelerating through information space; stars zoom outward from canvas center with 3D→2D perspective projection; each star is colored by its frequency band (violet→blue→teal→green→yellow→orange→magenta); overall amplitude drives warp speed; beats trigger burst acceleration and shift the hue palette; trail buffer with configurable fade creates persistent light streaks; close stars gain a glow halo; mobile guard (600 vs 1200 stars); sliders: Speed (base warp velocity), Density (star count), Trail (streak persistence) |
u | Vortex | Audio-reactive spiral galaxy inspired by Olafur Eliasson's "Your Rainbow Panorama" (2011, ARoS Aarhus Kunstmuseum) — https://olafureliasson.net/artwork/your-rainbow-panorama-2011/ — a circular rainbow-glass walkway crowning the museum roof, translating the chromatic rotational structure into a digital spiral. N logarithmic spiral arms emanate from the canvas centre, each mapped to a frequency band (cycling if arms > 7); amplitude drives arm brightness and width; 3-pass additive glow rendering (outer halo + mid + bright core); beat detection fires a rotation impulse and shifts the hue palette; an offscreen trail buffer accumulates layered mandala-like patterns over time; a centre glow pulses with overall amplitude; mobile guard reduces points per arm; sliders: Arms (spiral arm count 2–12), Twist (spiral tightness — loose open arms to tight winding coils), Speed (base rotation rate) |
] | Lumia | Flowing translucent color forms with additive blending inspired by Thomas Wilfred's "Lumia" light art and his Clavilux color organ (1920s-30s) — https://americanart.si.edu/exhibitions/lumia — Wilfred coined the term "Lumia" for the eighth fine art: pure light, shaped and set in motion, projected through reflectors and stained-glass disks. Multiple large, soft luminous shapes drift across the canvas via Perlin noise; each of 7 frequency bands drives one or more forms; forms are translucent and blend additively where they overlap, creating rich secondary colours as in Wilfred's projections; amplitude scales form size and brightness; beats trigger expansion pulses and shift the hue palette; multi-stop radial gradients with inner iridescent glow layer give each form depth; offscreen trail buffer at ½ res (mobile); sliders: Forms (luminous shape count 4–14), Drift (movement speed/turbulence), Glow (brightness/trail persistence) |
% | Wood Mirror | Audio-reactive mechanical-pixel relief inspired by Daniel Rozin's "Wooden Mirror" (1999) and his ongoing series of kinetic mechanical mirrors — https://www.bitforms.art/artist/daniel-rozin — a grid of motor-tilted, non-reflective wooden pixels that catch a single light source and reassemble a live image purely through shading; no pixel is ever lit directly, only angled toward or away from the light. A grid of wooden tiles holds a relief height per cell; 7 frequency bands drive the target relief of their column zone via Gaussian weighting (sub-bass on the left, brilliance on the right); Perlin noise adds organic per-tile drift; each tile's surface normal is derived from the height gradient to its neighbors and lit by one fixed light source, exactly like Rozin's motorized panels; beats send a circular wave of motion across the grid, as if a hand had passed in front of the piece; sliders: Density (grid resolution — coarse pixels to fine mosaic), Depth (relief amplitude — flat sheen to dramatic light and shadow), Speed (motor response speed — slow settle to fast snap) |
: | Noctiluca | Bioluminescent sea sparkle cascade inspired by Studio DRIFT's "Franchise Freedom" (2017) — 300 drones tracing bioluminescent organism patterns — and the real Noctiluca scintillans "blue fire" ocean phenomenon; 1800 particles (700 mobile) drift through a Perlin noise current field; beat-triggered circular shockwaves propagate outward from canvas edges, illuminating each particle as the wavefront passes in a cascade of blue-green light; 7 frequency bands drive distinct hues from deep indigo (sub-bass) through blue, cyan, teal, seafoam, and chartreuse (brilliance); additive "lighter" blending with a per-frame translucent dark overlay creates organic bioluminescent afterglow trails; sliders: Drift (Perlin current speed — still water to fast swirling), Bloom (glow halo radius and trail persistence — sharp pinpoints to diffuse halos), Wake (wave brightness and cascade intensity — subtle shimmer to dramatic blue-fire cascade) |
T | Tesseract | Rotating 4D hypercube (tesseract) wireframe inspired by Tony Robbin's "Fourfield: Computers, Art and the 4th Dimension" (1992) — https://www.tonyrobbin.net/fourfield.htm — and Henry Segerman's mathematical 4D visualization art — https://henryseg.github.io/; the tesseract's 16 vertices and 32 edges are rotated in 4D space and projected to 2D via double perspective division; the 6 independent rotation planes (XY, XZ, XW, YZ, YW, ZW) are each driven by a different audio frequency band, causing the inner cube to "pass through" the outer cube in ways impossible in 3D space — a phenomenon unique to 4D rotation; up to 5 nested tesseracts rotate with phase offsets and a rainbow-hue palette (violet inner → blue → teal → lime → magenta outer); 3-pass additive neon glow per edge and vertex node dots; beats fire alternating-direction angular impulses; sliders: Layers (1–5 nested tesseracts), Spin (base rotation speed across all 4D planes), Glow (phosphor neon halo intensity) |
V | Super Forms | Seven concentric Gielis superformula curves nest at canvas centre, one per frequency band — sub-bass anchors the outermost ring, brilliance the innermost; the superformula r(θ) = ( |
Q | Corridor | Infinite data-mirror tunnel — N receding rectangular rings form a first-person corridor perspective with a bright vanishing-point glow at its centre; genomic and binary characters (ATCG + 01) scroll along the ceiling and floor strips of each ring, with 7 horizontal column-zones mapped to frequency bands (sub-bass=violet left → brilliance=magenta right) so each band illuminates its section of the data stream; near rings scroll faster than far ones (parallax) giving the sense of infinite depth; neon pillar lines connect adjacent rings implying mirror walls; beat fires a "step-forward" zoom burst that pushes all rings outward simultaneously, plus a white flash and hue-palette shift; inspired by Ryoji Ikeda's "the critical paths" (2024, Estonian National Museum, Tartu, European Capital of Culture, https://vimeo.com/1035453913) — a 25-metre corridor installation where ceiling LED screens cascade 100,000 Estonian DNA profiles while mirror walls extend the data to infinite depth; sliders: Speed (data scroll rate — 0 = static, 1.5 = fast streaming), Depth (ring count 4–16, from shallow to deep tunnel), Palette (0 = Ikeda monochrome white, 1 = full band rainbow colours) |
g | Glyphs | Scattered field of 100–500 autonomous typographic glyphs — Greek letters (α β γ …), math symbols (∂ ∑ ∫ ∞ …), numerals, and Latin capitals — drifting across the canvas via independent Perlin-noise currents; each glyph's horizontal screen position maps it to one of 7 frequency bands so it takes on that band's rainbow hue (violet=sub-bass left → red=brilliance right); amplitude drives glyph size, brightness, and angular spin; on every beat all glyphs scatter outward from the canvas centre, ~40 % randomly swap their character, and the global hue palette shifts; canvas shadowBlur glow radiates from each character; inspired by Ksawery Kirklewski's "Symphony in Acid" (2022, generative audio-reactive typography for Max Cooper, built in browser-based creative code, https://maxcooper.net/symphony-in-acid) — where Wittgenstein's Tractatus text fragments explode, scatter, and reassemble as individual typographic particles in sync with the music; sliders: Density (glyph count — sparse field to packed canvas), Scale (base character size and amplitude reactivity), Drift (Perlin-noise drift speed — nearly still to turbulent motion) |
P | Prism | Thin-film iridescent light field; a Perlin-noise field of soap-film thickness values drives optical thin-film interference coloring via a 512-entry spectral LUT — the path-length difference 2·n·t at each pixel determines which visible wavelengths constructively interfere, producing the characteristic Newton's-rings soap-bubble color sequence (dark → silver → gold → magenta → blue → green → yellow → red → ...); 7 freq bands impose standing thickness waves at increasing spatial frequencies so sub-bass creates large slow color blobs while brilliance adds high-frequency shimmer; beats fire a radial thickness shockwave and shift the palette phase by ~47°; ¼-res pixel buffer (⅛ mobile); inspired by Tokujin Yoshioka "Rainbow Church" (500 000 Swarovski crystal prisms, Design Miami 2010, https://www.tokujin.com/work/rainbow) and Fabian Oefner's "Iridient" soap-bubble photography series (2012); sliders: Film (base film thickness — 0 = thin/monochrome, 1 = full spectral cycling), Flow (Perlin drift speed + grain density), Shimmer (iridescence brightness and saturation) |
W | Tapestry | Audio-reactive cloth simulation rendered as a shimmering mosaic of metallic tiles; a 30×26 grid of spring-connected particles (18×16 mobile) hangs pinned along its top edge and falls under configurable gravity via Verlet integration with structural, shear, and bend constraints; each of the 7 frequency bands oscillates the cloth in the depth axis at its own spatial and temporal frequency so sub-bass rolls the whole surface while brilliance shimmers the fine weave; beat fires a wide z-axis impulse wave that billows the cloth outward, then nudges the hue palette +42°; per-triangle Phong shading (two pre-normalised virtual lights — upper-left-front and upper-right-front) gives every facet a distinct metallic glint; iridescence is simulated by offsetting hue proportional to (1 − nz)·shimmer so tiles facing away from the viewer catch a different color than forward-facing ones; a warm copper/gold/bronze hue palette (BAND_HUES = [22, 43, 32, 8, 290, 182, 215]) maps sub-bass (left) through brilliance (right) across the cloth's columns, directly inspired by the zoning in El Anatsui's "Bleeding Takari II" (2007, MoMA, https://www.moma.org/collection/works/116286) — thousands of hand-linked aluminium bottle-caps and copper wire draped like cloth, each facet catching gallery light differently to produce a shimmering mosaic; sliders: Drape (gravity strength — 0 = cloth levitates and wafts, 1 = heavy canvas that sags), Ripple (audio-force amplitude — how forcefully each band disturbs the cloth's depth), Shimmer (metallic iridescence and specular highlight brightness) |
D | Veil | N luminous filament threads drift through the canvas, collectively forming emergent sculptural shapes that exist only through their combined behaviour — no individual thread carries the form, only the whole reveals it. 7 frequency-band vortex attractors orbit slowly at heptagon positions, each spinning in alternating CW/CCW directions; at high amplitude threads crystallise into braided vortex formations, at silence they diffuse into free Perlin-noise smoke. Additive-blend segments are rendered to a ½-res offscreen trail canvas with configurable fade. Beat fires a global hue shift and temporary crystallisation surge. Violet→blue→teal→green→lime→orange→magenta palette per band. Inspired by teamLab "Light Sculpture – Flow" (teamLab Borderless, Azabudai Hills, Tokyo, 2024, https://www.teamlab.art/w/lightsculpture-flow/), in which countless light streams collectively form a sculptural entity that exists only through flow. Sliders: Threads (filament count — 0 = sparse, 1 = dense), Order (crystallisation vs. smoke drift — 0 = pure Perlin smoke, 1 = tight vortex forms), Trail (persistence — 0 = short ghostly trace, 1 = long luminous history) |
E | Cobweb | Audio-reactive spider-web visualization; N radial spokes emanate from a central anchor point and M concentric rings thread between them to form a luminous geometric web; 7 frequency bands each govern one ring-zone (sub-bass at the centre → brilliance at the outer rim), driving ring brightness, colour, and strand vibration; all intersection points between spokes and rings carry dew-drop nodes — glowing circles whose size and brightness scale with band amplitude, giving the web a bejewelled quality; on every beat an expanding radial pulse wave sweeps outward through the web, flashing each ring as it crosses, and the hue palette shifts by ~47°; 3-pass Catmull-Rom glow per strand (wide halo + mid + bright core); mobile guard reduces spoke/ring count for performance; inspired by Tomas Saraceno's "In Orbit" (2013, Kunstsammlung Nordrhein-Westfalen, Düsseldorf, https://tomassaraceno.com/projects/in-orbit/), a suspended spider-web installation 25 m above the ground where visitors could walk on the nets — geometry, tension, and light interact to reveal the structure; sliders: Density (0 = sparse 8-spoke web, 1 = dense 24-spoke web), Dew (intersection node glow — 0 = threads only, 1 = bright jewelled nodes), Tension (strand vibration amplitude driven by audio — 0 = rigid, 1 = wild oscillation) |
L | Frost | Audio-reactive ice-crystal dendritic growth; N-fold crystallographic symmetry (3–12 configurable folds) grows fractal branch tips outward from nucleation centres; 7 freq bands steer tip extension speed; tips fork at 60° angles (or fold-appropriate) when audio spikes, producing multi-generation dendritic trees; accumulated segments persist on a trail buffer (slow-fading frost on cold glass); beat fires satellite crystal nucleation or full thaw-and-refreeze; 3-pass glow (outer halo + mid bloom + crisp ice-white core); inspired by Alexey Kljatov's macro snowflake photography (https://chaoticmind75.blogspot.com/) and Tokujin Yoshioka "VENUS – Crystal Nature" (2022, Kyushu National Museum); sliders: Symmetry (fold count 3–12 — dramatically changes geometry from triangular to exotic high-symmetry), Growth (branch density/speed — sparse slow needles → rapid dense frost), Glow (bloom halo + trail persistence — crisp lines → luminous lingering ice) |
M | Boogie Woogie | Audio-reactive Mondrian city-grid; canvas divided into a frequency-band-mapped grid of coloured city blocks (coarse Mondrian squares → fine Manhattan street grid); 7 freq bands (sub-bass=left → brilliance=right) drive saturation and brightness of scattered coloured blocks in the classic Mondrian primary palette (red, yellow, blue) on a warm white background; golden streets (thick grid lines) carry small coloured "boogies" — squares that race outward from the canvas centre on every beat like taxis flying away from Times Square; Palette slider morphs from warm primary-colour oil-on-canvas to a dark neon riff on the same structure; inspired by Piet Mondrian "Broadway Boogie Woogie" (1942-43, MoMA, https://www.moma.org/collection/works/78682), which Mondrian painted under the influence of NYC jazz and the grid of numbered avenues; sliders: Grid (0 = coarse 6-division blocks, 1 = fine 20-division Manhattan grid), Pulse (beat-burst strength — few boogies → full grid of racing squares), Palette (0 = classic Mondrian warm light, 1 = dark neon) |
N | Patchwork | Full-canvas grid of quilt blocks, each displaying one of five classic patchwork patterns (Log Cabin concentric squares, Half-Square Triangle, Pinwheel, Four-Patch, Rail Fence); 7 vertical column zones map sub-bass (left) through brilliance (right) to block brightness and hue; transients flash blocks bright white; every detected beat fires an expanding circular ring that shuffles block patterns outward from the canvas centre like a seam spreading across fabric; Palette slider morphs from warm folk-quilt reds and golds to cool graphic teals and indigo; Motion slider adds breathing, rotation, and stripe-shift animation to patterns; inspired by Emily Xie "Interwoven" (2023, LACMA x Cactoid Labs, https://verse.works/series/interwoven-by-emily-xie); sliders: Grid (cell density — large fabric squares to fine patchwork), Palette (warm folk quilt → cool graphic), Motion (static → animated patterns) |
G | Risograph | Layered screen-print aesthetic; 7 ink layers (one per freq band) of bold flat-color geometric shapes (circles, ellipses, rounded rectangles, pills) rendered with additive blending so overlapping layers compound into vivid secondary hues and luminous whites; Perlin-noise field drifts shapes across the canvas; beat fires mis-registration offsets so layers briefly shift out of alignment, revealing the stacked color strata beneath — the characteristic imperfection of screen printing; shapes scale with band amplitude, slowly rotate, and drift; mobile: max 2 shapes per layer; inspired by Corita Kent "Handle with Care" (1967, https://coritakent.org/) serigraphy prints and the Risograph printing revival in independent art and zine culture (2010s–2020s); sliders: Shapes (shapes per ink layer 1–4 — sparse bold forms → dense overlapping geometry), Shift (mis-registration distance on beats — 0 = perfect alignment, 1 = wild strata reveal), Bloom (glow halo intensity — 0 = sharp flat ink, 1 = luminous neon bleed) |
R | Radiolaria | Ernst Haeckel "Kunstformen der Natur" (1904) inspired viz; N-fold radial symmetry with nested silica shells, two counter-rotating spoke sets forming a shifting diamond lattice, long bioluminescent spines at the outermost rim; 6 freq bands drive shell radii (sub-bass=warm amber core → presence=violet rim); brilliance drives spine length and vibration; beat fires hue palette shift + expansion ring; warm amber → teal → violet bioluminescent palette; sliders: Symmetry (6–24 fold radial symmetry), Shells (2–6 concentric ring count), Glow (phosphor bloom intensity + trail persistence) |
F | Lens Flare | Audio-reactive anamorphic lens flare field; 7 chromatic light sources (one per freq band) drift slowly in a ring; each emits a central bloom glow, four-point diffraction spikes, a horizontal anamorphic streak, and ghost bokeh circles along the flare axis through canvas centre; sources blend additively so simultaneous peaks produce near-white convergence — the "chromatic sculpture" is colour in ordered space with no material boundary; beat fires hue palette shift + brightness flash; violet→blue→cyan→green→yellow→orange→red per band; inspired by teamLab "Chromatic Existence" (2026, Light Sculpture – Flow, teamLab Borderless Azabudai Hills Tokyo); sliders: Streak (anamorphic streak length — 0 = no streaks, 1 = full-width cinema streaks), Ghosts (ghost bokeh intensity — 0 = none, 1 = vivid ghost circles along flare axis), Bloom (central glow radius — 0 = tight bright point, 1 = large diffuse cloud) |
O | Stitch | Audio-reactive cross-stitch embroidery grid; 7 freq-band column zones (sub-bass violet left → brilliance magenta right) activate X-shaped thread marks on a dark Aida-cloth canvas; per-cell Float32Array brightness state drives amplitude-proportional stitch probability, decays over time at a configurable rate; beat fires an expanding radial wave of fresh stitches from canvas centre like a needle jumping across fabric; subtle grid-hole guides at cell corners reinforce the fabric weave texture; phosphor bloom glow per stitch; mobile guard (larger cells, reduced activation density); inspired by Giorgia Lupi & Stefanie Posavec "Dear Data" (2016, MoMA permanent collection, https://www.dear-data.com/) — a year-long hand-illustrated data postcard exchange using embroidery-like visual language; sliders: Grid (stitch cell size 8–40 px — dense fine needlework → sparse bold cross-stitch), Trail (thread persistence — fast fade to permanent tapestry), Glow (phosphor bloom halo — sharp thread → vivid neon glow) |
X | Magnetosphere | Gravity-well particle orbit system; 7 frequency-band attractor nodes arrange on a slowly rotating heptagon ring, each pulling swarms of charged particles into fluid orbital compositions; attractor gravity scales with band amplitude — a pounding kick creates tight spiral orbits while silence releases particles into free drift; luminous comet trail buffer with configurable persistence; beats scatter all attractors radially outward then ease them home, triggering a blooming explosion-and-collapse; 3-pass attractor glow halos per node; mobile guard (700 vs 2200 particles); inspired by Robert Hodgin "Magnetosphere" (2007, Apple iTunes 8 default visualizer, https://roberthodgin.com/project/magnetosphere); sliders: Particles (swarm density — sparse wisps → dense comet cloud), Gravity (attractor pull — free drift → tight vortex orbits), Trail (comet tail persistence — instant fade → long luminous streaks) |
S | Substrate | Crystalline growth lines; cardinal-direction tips grow across a dark canvas and spawn perpendicular branches when they expire, creating emergent city-block / mineral-crystal formations; 7 freq bands drive growth in horizontal zones (sub-bass=left → brilliance=right) so each part of the frequency spectrum lights up its own column of crystals; beat fires a radial burst of new seeds from canvas centre + palette shift; gentle Perlin-noise jitter keeps lines organic; neon glow on tip markers; persistent trail buffer; mobile guard (120 vs 350 max tips); inspired by Jared Tarbell "Substrate" (2003, http://www.complexification.net/gallery/machines/substrate/); sliders: Density (branching rate and tip population — sparse isolated threads → dense crystalline web), Speed (growth velocity and line length — slow fine segments → fast long streaks), Glow (neon bloom brightness and trail persistence — sharp dark lines → vivid neon with long trails) |
Z | Ferrofluid | Audio-reactive magnetic liquid spike field; hexagonally-packed grid of Rosensweig instability spikes rendered via stacked-ellipse depth illusion giving 3-D volume without WebGL; 7 freq bands drive spike height across horizontal zones (sub-bass=left → brilliance=right); Perlin-noise drift gives each spike organic independence; iridescent thin-film sheen colours tips from dark monochrome to vivid rainbow; beat fires an expanding radial pressure wave that boosts all spikes it crosses + hue palette shift; 3-pass additive tip glow; inspired by Sachiko Kodama "Protrude, Flow" (2001, SIGGRAPH Art Gallery, https://www.sachikokodama.com/); sliders: Density (hex grid spacing — coarse few tall spikes → fine many small), Height (amplitude sensitivity and max spike extension), Iridescence (monochrome ferrofluid → vivid rainbow shimmer) |
` | Cataract | Op-art wave bands; N horizontal sinusoidal boundary curves divide the canvas into alternating dark/light filled bands; a fixed per-curve phase offset creates the "cataract" waterfall optical-flow illusion (the whole canvas appears to cascade); 7 frequency zones (left=bass → right=brilliance) drive local wave amplitude so the spectrum is spatially painted — bass bends the left-side curves, brilliance the right; beat fires a half-cycle phase-flip that reverses apparent flow direction + hue shift in chromatic mode; Palette slider morphs from Riley's monochrome to full chromatic band-hue gradients; inspired by Bridget Riley "Cataract 3" (1967, British Council Collection, https://artuk.org/discover/artworks/cataract-3-219038); sliders: Lines (band count 5–40 — bold stripes → fine ripples), Wave (amplitude flat→deeply curved), Palette (Riley monochrome→full chromatic) |
( | Tracery | Audio-reactive Gothic rose window; 7 concentric rings of stained-glass arc panels (one per freq band, inner sub-bass → outer brilliance) subdivided into N×(ring+1) panels that glow in a violet→amber palette driven by band amplitude; dark "lead-line" stone tracery dividers between panels; beat fires a radial white flash + hue palette shift; window rotates slowly; inspired by Notre-Dame de Paris west rose window (c. 1220 CE) and Joan Vila-Grau's Sagrada Família stained glass (2010, https://www.sagradafamilia.org/en/decorative-arts); sliders: Petals (N-fold radial divisions 4–12), Glow (bloom intensity), Spin (rotation rate) |
I | Homage | N×N grid of Josef Albers-style nested-square colour studies; each composition is 3–9 flat concentric squares in Albers' signature "bottom-heavy" offset — inner squares sit lower than centre rather than perfectly centred; nesting levels map evenly across the 7 freq bands (outer = sub-bass, inner = brilliance) so each band lights up its own layer with saturation and brightness; beats snap the whole palette ladder outward one step so colours pulse through the layered field; per-tile phase offsets keep the mosaic from flashing in lock-step and let the grid read as a living, breathing colour study; Palette slider morphs between warm Albers "Solar" (deep espresso brown → burnt sienna → terracotta → ochre → cream → ivory) and cool "Ascension" (midnight navy → slate → teal → seafoam → lavender → pearl mauve) 9-stop palettes; inspired by Josef Albers "Homage to the Square" series (1949–1976, Solomon R. Guggenheim Museum), notably "Homage to the Square: Apparition" (1959, https://www.guggenheim.org/artwork/106) and his teaching text "Interaction of Color" (1963, Yale University Press); sliders: Grid (composition tiling 1×1 to 4×4 — single meditative study → mosaic of colour experiments; capped at 3×3 on mobile), Nesting (3–9 squares per composition — simple concentric study → deep layered chromatic ladder), Palette (warm Solar → cool Ascension) |
_ | Protractor | N fans of concentric arcs share the canvas centre, each sweeping a configurable angular sector; 7 spectral hues (violet→blue→teal→green→yellow→orange→red) colour successive rings — one per frequency band — so bass pulses in the innermost arcs while brilliance lights the outer edges; band amplitude drives arc glow and stroke weight creating a breathing rainbow compass-rose; the pattern slowly rotates with beat-driven angular impulses and hue palette shifts; 2-pass additive neon glow; trail buffer; mobile guard; inspired by Frank Stella "Protractor" series (1967–69, MoMA, https://www.moma.org/artists/5641); sliders: Fans (2–8 arc fan groups — pair of half-circles → dense compass rose), Rings (4–24 concentric arcs per fan — sparse → dense rainbow banding), Spread (angular sweep — narrow wedge → nearly full circle) |
+ | Phyllotaxis | Golden-angle seed packing lattice where N seeds are placed at successive multiples of the golden angle (≈137.508°), producing the canonical Fibonacci spiral arrangement found in sunflower heads, pinecones, and pineapple scales; 7 radial zones map frequency bands (sub-bass at core → brilliance at rim) to seed colour and glow; band amplitude drives seed size; the whole lattice slowly rotates — at the right speed, Fibonacci spiral arms emerge and dissolve like John Edmark's strobe-lit Blooms sculptures; beat fires a radial scatter burst then seeds ease home; 3-pass additive glow per seed; mobile guard; inspired by John Edmark's kinetic "Blooms" sculptures (2014, https://www.instructables.com/Blooms-Fibonacci-Zoetrope-Sculptures/); sliders: Seeds (60–900 — sparse dot field to dense sunflower lattice), Spin (rotation rate — static to fast, reveals Fibonacci spiral arms), Bloom (amplitude sensitivity — subtle pulse to dramatic blooming) |
) | Aether | Domain-warped noise field creating organic cosmic nebulae; double-pass domain warping (Inigo Quilez's technique) bends coordinate space before sampling, producing swirling tendrils and whorls impossible with simple wave superposition; 7 frequency bands each occupy a distinct hue zone in the warped field (sub-bass=violet → brilliance=red), with band amplitudes driving local brightness so the nebula breathes with the music; quiet passages settle into deep monochromes while loud moments produce vivid luminous clouds; beats fire a hue palette jump and brightness surge; ¼-res pixel buffer (⅛ mobile); inspired by Refik Anadol's "Unsupervised" (MoMA NYC, 2022–23, https://www.moma.org/calendar/exhibitions/5535) — large-scale data sculptures that turn 200 years of MoMA's collection into a living dream; sliders: Turbulence (warp complexity — smooth gradient clouds → complex swirling tendrils), Flow (animation speed — near-static drift → fast-churning), Palette (colour saturation — monochrome nebula → full chromatic neon) |
{ | Chromatic | Holographic diffraction grating visualization; 7 grating layers (one per freq band) at evenly distributed angles produce pure ROYGBIV rainbow stripe patterns; additive superposition creates holographic iridescence — vivid compound colors where bands intersect, like a real diffraction grating on holographic foil; each band's grating slowly rotates and drifts with audio; beat fires a hue palette jump + grating phase shuffle; ¼-res pixel buffer (⅛ mobile); inspired by Felipe Pantone's "Chromadynamism" series (2016–present, https://www.felipepantone.com/chromadynamica) — kinetic op-art combining full-spectrum gradients, geometric precision, and neon intensity to evoke light refracting through holographic material; sliders: Density (stripe count — 0 = sparse wide rainbow bands → 1 = fine holographic mesh), Spin (grating rotation speed — 0 = near-static → 1 = fast orbit), Shimmer (brightness and iridescence intensity) |
' | Particle Life | 7 particle species (one per freq band) interact through an asymmetric 7×7 attraction/repulsion force matrix; emergent self-organisation produces "organisms" — clusters, orbits, spirals, chains — that mutate as beats shuffle the force rules; each species' pull scales with its band's amplitude; toroidal wrap-around world; spatial-hash for O(N) neighbor queries; additive-glow trail buffer; beat fires radial scatter + hue shift; mobile guard; inspired by Jeffrey Ventrella's "Clusters" artificial life simulation (1994–2022, https://ventrella.com/Clusters/); sliders: Population (particle count — sparse orbiting blobs → dense heaving swarm), Force (interaction strength — gentle drift → violent snap), Range (interaction radius — tight local clusters → long-range global order) |
" | Tableau | 7 ensembles of coloured ellipses (one per freq band) arranged in precise geometric formations — ring, arc, line, diamond — that morph on beats; amplitude scales formation radius and ellipse size; 3-pass glow gives each ellipse a glass-bead specular highlight; ensembles float with gentle sinusoidal drift and alternate CW/CCW rotation; inspired by Oskar Fischinger "An Optical Poem" (1938, https://www.oskarfischinger.org); sliders: Count (shapes per ensemble 3–24), Morph (formation-shift speed), Flow (drift/oscillation speed) |
| — | Rorschach | Audio-reactive bilateral ink blot; ink accumulates on a cream-paper background with perfect left-right symmetry around a central fold line; 7 frequency bands spawn drops at increasing distances from the fold (sub-bass near center → brilliance at edges); amplitude drives drop density and size; beat fires a dramatic central pour; inspired by Andy Warhol's "Rorschach" series (1984–1986, The Broad / MoMA, https://www.thebroad.org/art/andy-warhol/rorschach); sliders: Drip (ink flow rate + drop size), Spread (ink feathering/bleed radius), Palette (monochrome black on cream → full chromatic) |
| — | Pollock | Audio-reactive drip-painting action painting; 7 paint streams (one per freq band) drip from drifting source points at the top of the canvas; amplitude drives flow rate and stroke weight; Perlin noise adds lateral wobble; beat fires dramatic horizontal flings with micro-droplet trails; persistent trail buffer accumulates the painting; Palette morphs from Pollock earth tones (slow accumulation) to vivid neon (fast fading); inspired by Jackson Pollock "No. 5, 1948" and "Blue Poles" (Number 11, 1952, National Gallery of Australia, https://nga.gov.au/international/catalogue/detail.cfm?irn=29615); sliders: Viscosity (paint consistency), Chaos (gesture turbulence), Palette (earth tones → neon / accumulation → fade) |
| — | Julia | Julia set escape-time fractal visualization; 7 curated complex-plane c parameters (seahorse spirals, dragon wings, cauliflower, Siegel disk, dendrite needle forest…) cycle on every beat with smooth ease-in-out morph transitions; smooth escape-time coloring (Iñigo Quílez formula) creates continuous gradient bands; bass nudges c.real, presence nudges c.imag for audio-reactive shape distortion; ⅕-res pixel buffer (⅛ mobile); inspired by Julius Horsthuis' fractal cinema and VJ performance work (https://www.juliushorsthuis.com/); sliders: Detail (iteration depth), Zoom (1× → 12×), Morph (audio warp strength) |
| — | Langton's Ant | 7 cellular-automaton ants (one per frequency band) walk a shared grid following Langton's deterministic rule — white cell: turn right, flip, step; black cell: turn left, flip, step — producing emergent "highway" patterns after ~10,000 steps; band amplitude drives step count per frame; Chaos slider introduces random-walk noise to break the highway and produce organic drift; beats scatter all ants to new positions; 3-pass glow on each step-mark; offscreen trail buffer with configurable fade; mobile guard (larger cells); inspired by Casey Reas' "Process" generative-art series (2004, https://reas.com/texts/) and Christopher Langton's "Computation at the Edge of Chaos" (1990); sliders: Speed (step rate — slow trickle → fast highway construction), Chaos (0=pure Langton rule → 1=random walk), Trail (mark persistence) |
| F4 | Anemone | 7 groups of sinuous bioluminescent tentacles radiate from canvas centre, one group per audio frequency band; each tentacle is a Perlin-noise-steered segment chain rendered as smooth quadratic bezier curves with 3-pass neon glow (outer halo, mid, crisp core); band amplitude drives extension length and brightness; beat fires a radial burst elongating all arms simultaneously + hue palette shift; additive blending creates vivid bioluminescent appearance; semi-transparent trail overlay accumulates layered glows; mobile guard (fewer segments); inspired by Refik Anadol "Machine Hallucinations — Nature Dreams" (2026, KÖNIG GALERIE, Berlin, https://refikanadol.com/works/machine-hallucinations-nature-dreams/); sliders: Arms (tentacles per group 2–10), Wave (undulation speed and wander amplitude), Glow (bloom halo size and trail persistence) |
| F5 | Meander | 7 Catmull-Rom spline paths drift slowly via Perlin noise, one per frequency band; each frame thousands of transparent dots spray perpendicular to each path with a Gaussian scatter radius scaled by band amplitude — quiet passages leave razor hairlines, loud passages swell into diffuse luminous clouds; dots accumulate additively on an offscreen trail buffer building a richly-layered chalk-pastel painting that shifts and breathes with the music; beat fires a hue-palette jump and a brief scatter burst; soft bloom pass overlaid; mobile guard (fewer particles); inspired by Inconvergent / Anders Hoff "Sand" series (2016–2020, https://inconvergent.net/generative/sand-spline/); sliders: Scatter (perpendicular cloud width 0=hairline→1=diffuse), Density (particles per frame), Flow (path drift speed) |
| — | Aggregation | Audio-reactive diffusion-limited colony growth; 7 colonies seeded at heptagon positions on a coarse grid (one per frequency band) compete to claim adjacent unclaimed cells — louder bands expand faster, quieter bands cede ground; probabilistic frontier-based DLA algorithm uses packed typed arrays with O(1) swap-remove compaction; persistent offscreen trail buffer accumulates all past claims; translucent age-fade overlay dims old growth each frame; beat fires brightness flash + hue palette shift; when canvas is ≥ 75% filled the image slowly dissolves and restarts from fresh seeds; 3-pass glow (wide soft halo, medium halo, crisp core); inspired by Andy Lomas "Aggregation" series (2005–ongoing, https://andylomas.com/aggregation.html) — computer sculptures of coral, crystal, and dendritic forms grown by DLA-based particle accretion; sliders: Growth (colony expansion rate — slow creep → aggressive surge), Decay (age-fade speed — long glow → rapid dimming), Glow (bloom halo radius/brightness) |
| F7 | Hopf Fibers | Audio-reactive Hopf bundle visualization; renders the principal fiber bundle π: S³ → S² (Heinz Hopf, 1931) via stereographic projection; 7 latitude rings of fibers (one per frequency band) project from S³ to R³ then perspective-project to 2-D — sub-bass drives tight inner tori, brilliance the outermost large arcs; every great circle on S³ links every other exactly once, so the interlocking is topologically indestructible; band amplitude drives neon brightness and stroke weight; slow continuous rotation reveals the topology; 3-pass additive glow; offscreen trail buffer with configurable persistence; beat fires angular impulse + hue palette shift; mobile guard (capped fiber count); inspired by Niles Johnson "Hopf Fibration" animation (2012, https://nilesjohnson.net/hopf.html); sliders: Fibers (fibers per band ring 8–48), Spin (rotation speed), Glow (bloom brightness and trail persistence) |
| F8 | Reticulae | Audio-reactive triangulated wire mesh inspired by Gego (Gertrude Goldschmidt) "Reticulárea" (1969–1982, Guggenheim); roughly-regular grid of nodes jittered from their lattice positions and connected by triangulated edges; 7 horizontal frequency zones (sub-bass=left → brilliance=right) colour each wire segment violet→blue→teal→green→yellow→orange→magenta; band amplitude drives neon glow and stroke weight; Perlin noise + spring-damper physics animate each node with organic oscillation driven by its band's energy; beat fires a radial impulse from canvas centre that ripples outward through the lattice; 3-pass glow (outer halo, mid bloom, metallic core); glowing node dots at wire intersections when amplitude is high; mobile guard (smaller grid); sliders: Density (grid resolution — coarse open mesh → fine tight weave), Vibration (node oscillation amplitude), Glow (neon bloom intensity) |
| F9 | Solid Light | Volumetric light-cone installation inspired by Anthony McCall's "Solid Light" (Tate Modern, 2024); 2–6 particle-cloud cones hang from a virtual ceiling in a darkened 3D space, each driven by one frequency band; near-monochrome warm/cool white palette (no rainbow) — beams alternate warm incandescent (3200 K) and cool daylight (7000 K) tones; additive particle blending creates soft volumetric scattering like a real haze-filled gallery; camera drifts slowly through the installation space at eye level, sometimes passing through beams; beat fires a brief brightness flash; Three.js WebGL overlay; mobile guard (reduced particle count, fewer beams); sliders: Beams (cone count 2–6, structural), Haze (particle density), Drift (camera movement speed) |
| F10 | Crystal Universe | Thousands of luminous light particles drift in a cylindrical 3D volume; first-person camera slowly flies through them — inspired by teamLab "Crystal Universe" (2015–ongoing, https://www.teamlab.art/w/crystaluniverse/); 7 frequency bands control particle brightness in concentric radial zones (sub-bass at core → brilliance at edge); warm amber → pure white → cool blue-white palette without per-band rainbow; beats fire a forward camera surge; additive-blend Three.js Points with custom vertex/fragment GLSL shaders; mobile guard (1400 vs 4000 particles, lower pixel ratio); sliders: Glow (point size and halo brightness), Flow (drift turbulence and travel speed), Drift (camera path 0=straight tunnel flight → 1=wide spiraling sweep) |
| F11 | Skyspace | Minimalist plaster architectural interior viewed from within; a single circular aperture in the ceiling glows with continuously shifting sky-colored light; matte walls breathe with music via a PointLight driven by amplitude; sky color temperature drifts from cool moonlight blue → warm sunrise amber; camera drifts with gentle handheld motion; beats trigger brightness surge; no neon, no rainbow palette — inspired by James Turrell "Breathing Light" (LACMA, 2013) and his Skyspace aperture-room series (1974–present); sliders: Aperture (ceiling opening radius — structural), Warmth (color temperature 0=moonlight → 1=amber), Drift (camera movement speed) |
| F12 | Torus Knot | First-person fly-through of a (p,q) torus-knot tube; camera rides the centreline on an infinite loop; 7 freq bands drive radial star-shaped corrugations along successive arc sections so bass swells one end and brilliance undulates the other; warm amber key light floats ahead of camera, cool steel fill trails behind; dark basalt-like walls with procedural micro-texture; beat fires brief FOV punch + warm light flare; no rainbow palette, no neon glow; Three.js WebGL overlay with ACESFilmic tone-mapping; mobile guard (reduced segment counts, pixel ratio 1.0); inspired by Carlo Séquin's mathematical torus-knot sculptures at the Bridges Conference on Mathematics and Arts (2015–2024, https://people.eecs.berkeley.edu/~sequin/SCULPTS/KNOTS/index.html); sliders: Form (torus-knot topology (2,3)→(2,5)→(3,5)→(3,7) — structural), Bore (tube cross-section radius — structural), Speed (camera flight velocity) |
| F1 | Cloister | Field of tall warm-stone columns on a dark polished floor; single warm directional sidelight rakes across the colonnade casting long shadows; 7 frequency bands drive column heights (sub-bass=leftmost, brilliance=rightmost); camera orbits at human height; ACESFilmic tone-mapping, no rainbow palette, no neon glow; desktop shadow mapping for dramatic floor shadows; mobile guard (no shadows, reduced pixel ratio); inspired by Peter Zumthor's Therme Vals thermal baths (1996, https://www.zumthor.com/therme-vals); sliders: Formation (column depth 1–4 rows — structural), Height (amplitude sensitivity), Orbit (camera speed) |
| ] | Melt | Seven biomorphic forms drift in a darkened void, merging and separating with the music; pure GLSL SDF raymarching on a fullscreen quad — no Three.js geometry, all form born inside fragment shader equations; polynomial smooth-min blending fuses all 7 spheres continuously; warm Caravaggio-style sidelight with soft shadows and ambient occlusion; pale alabaster/ivory material with subsurface warmth driven by audio energy; beat pulse expands all forms; camera orbits slowly off-axis; restrained monochromatic palette (warm cream, amber, cool rim light — no rainbow); mobile guard (reduced pixel ratio); inspired by Anish Kapoor's "Svayambh" (2007) and Louise Bourgeois's organic latex sculptures; sliders: Merge (smin k — structural: distinct spheres → deeply fused mass), Drift (orbit/animation speed), Warmth (inner subsurface glow from audio energy) |
| — | Shard | 7 irregular crystalline glass polyhedra cluster in deep-space darkness, one per frequency band; each shard built from a ConvexGeometry hull of seeded random points (Facets slider changes geometry from angular few-face shards to intricate multi-face crystals); MeshPhysicalMaterial with transmission for genuine glass refraction; warm key + cool fill + rim directional lights; no neon glow, no rainbow — pale ice-blue palette; shard scale driven by band amplitude; beat fires radial scatter burst that eases home; camera orbits with gentle vertical oscillation; inspired by Tokujin Yoshioka "Venus – Crystal Nature" (2022) and Roger Hiorns "Seizure" (2008); sliders: Facets (crystal geometry complexity — structural), Scatter (orbital radius), Clarity (frosted opaque → clear glass transmission) |
| F14 | Stelae | N×N field of matte-concrete rectangular monoliths viewed first-person at human height; InstancedMesh with per-column heights driven by 7 freq-band Gaussian zones (sub-bass=left → brilliance=right); slow Lissajous camera path winds through narrow gaps; dramatic directional sidelight, PCFSoftShadowMap desktop shadows, ACESFilmic tone-mapping; no rainbow palette, no neon glow; beat fires a brief light flash and camera shake; inspired by Peter Eisenman's "Memorial to the Murdered Jews of Europe" (Berlin, 2005); sliders: Grid (column density 4–16 per side — structural), Height (amplitude sensitivity), Warmth (light temperature: cool overcast → warm golden hour) |
| F15 | Orrery | Mechanical armillary sphere — 2–7 inclined metallic torus rings with orbiting node spheres, each ring driven by one frequency band; golden-angle tilt distribution fans rings across all orientations; warm key + cool rim + ambient lighting; MeshStandardMaterial with ACESFilmic tone mapping; band amplitude drives orbital speed and node emissive glow; beat fires a key-light flash; camera slowly orbits the whole structure; no rainbow palette, no neon glow — warm brass-to-verdigris material palette; inspired by Conrad Shawcross "Slow Arc Inside a Cube" (2009) and the historical armillary sphere instrument tradition (George Adams, c. 1760, Science Museum London); sliders: Rings (2–7 orbital planes — structural), Patina (0=bright brass → 1=aged verdigris), Tempo (orbital speed) |
| F16 | Kinetic | Calder-style hanging mobile sculpture in 3D gallery space; 2–7 horizontal arms at staggered heights, each pointing in a unique horizontal direction, driven by one frequency band via spring-damper pendulum physics; colored discs (Calder primary palette: vermillion, cadmium yellow, cobalt blue, near-black, off-white, orange, leaf green) hang from rod endpoints on thin wires; the whole assembly slowly rotates; camera drifts gently at gallery height; warm key light + cool fill, ACESFilmic tone mapping, no bloom, no rainbow; inspired by Alexander Calder "Red Mobile" (1956) and "Snow Flurry" (1948, MoMA); sliders: Arms (2–7 arm count — structural), Sway (audio tilt amplitude), Drift (rotation speed) |
| 4 | Braid | 3–7 helical fiber strands wound around a central vertical axis; each strand is a CylinderGeometry deformed into a helix via custom vertex shader (ShaderMaterial); warm earth-tone palette (linen, terracotta, ochre, indigo, sage, crimson — no rainbow); Blinn-Phong lighting with warm amber key + cool fill; strand tube radius driven per-band by frequency amplitude; camera slowly orbits with gentle altitude drift; beat fires key-light flash; ACESFilmic tone mapping; mobile guard (reduced geometry, pixel ratio 1.0); inspired by Sheila Hicks "Escalade Beyond Chromatic Lands" (2016–17, 57th Venice Biennale); sliders: Strands (3–7 count — structural), Twist (loose fibers → tight coil), Tension (audio reactivity), Orbit (camera speed) |
| F17 | Vessels | 7 lathe-turned glass vessels in a gentle arc, each filled with audio-reactive liquid that rises with its frequency band's amplitude; real glass-transmission material on desktop (MeshPhysicalMaterial with transmission/ior) and simplified transparent on mobile; warm amber → cool ice liquid palette per band — no rainbow glow, no neon; warm gallery SpotLight key + cool ambient fill; camera performs a slow sinusoidal sweep across the arc at human height with gentle vertical bob; beat fires a key-light flash; ACESFilmic tone mapping; LatheGeometry vessel profile (apothecary flask silhouette); mobile guard (simplified material, lower pixel ratio, fewer geometry segments); inspired by Roni Horn "Vatnasafn / Library of Water" (2007, Stykkishólmur, Iceland); sliders: Fill (base liquid level + amplitude sensitivity — structural), Clarity (frosted opaque → crystal clear glass), Orbit (camera drift speed) |
| F18 | Massless Suns | 20–40 large volumetric light spheres and shadow-void anti-spheres drift in a darkened void; warm amber/gold near-monochrome palette; each sphere maps to a frequency band driving brightness; beat-triggered ripple chain reaction between neighbouring suns; UnrealBloomPass halos; SubtractiveBlending dark anti-suns carve void patches; custom Gaussian-falloff billboard GLSL; camera sinusoidal orbit with handheld drift; inspired by teamLab "Massless Suns and Dark Suns" (2025, https://www.teamlab.art/w/masslesssuns/); sliders: Suns (count 8–36 — structural), Void (dark anti-sun fraction — structural), Drift (camera + sphere speed), Glow (bloom strength) |
| — | Gossamer | 4–21 translucent soap-film membrane planes distributed evenly in 3D space via Fibonacci sphere; custom ShaderMaterial with thin-film iridescence GLSL — Fresnel angle drives RGB rainbow shift via cos(phase+0°/120°/240°); each plane independently responds to its assigned frequency band (amplitude → vertex displacement ripple wave); milk-glass white palette at normal incidence with vivid rainbow iridescence at grazing angles (no per-band color mapping); planes tumble slowly on independent 3D rotation axes; UnrealBloomPass subtle edge glow (desktop only); directional key + fill lighting; beat fires camera orbital snap and brightness surge; ACESFilmic tone mapping; mobile guard (capped plane count at 7); inspired by Tomas Saraceno "On Air" (Palais de Tokyo, Paris, 2018, https://tomassaraceno.com/projects/on-air/); sliders: Density (plane count 4–21 — structural), Flutter (audio displacement amplitude 0=still→1=rippling), Iridescence (thin-film vividness 0=white glass→1=vivid soap-bubble) |
| F20 | Dome | Camera orbits inside a luminous geodesic icosahedral sphere; 7 azimuthal sectors of triangular faces each respond to one frequency band; custom ShaderMaterial with per-face emissive driven by audio; restrained warm-amber → cool-sapphire palette controlled by a single Palette slider (no rainbow house style); thin structural edge lines trace the geodesic lattice even when panels are dark; beat fires full-dome warm-white brightness flash and FOV pulse; UnrealBloomPass (desktop only); mobile guard (subdivision detail=1, no bloom); inspired by Olafur Eliasson "The Sky" (2022) and R. Buckminster Fuller's Biosphere (Montréal, 1967, https://www.biosphere.ca/); sliders: Density (geodesic subdivision level 1/2/3 — structural), Palette (warm amber → cool sapphire), Glow (emissive intensity + bloom strength) |
| F21 | Torque | Richard Serra "Torqued Ellipses" — curved Corten-steel walls, interior camera path, warm sidelight |
| F22 | Tomography | SDF-based volumetric scan; N GLSL slice planes cut through a morphing implicit surface (sphere→torus→figure-8); orbital camera with beat velocity impulse; cold-blue → phosphor-green → warm-amber palette; UnrealBloomPass + chromatic aberration; sliders: Density (structural), Shape (structural), Glow, Palette |
| F23 | Gyroid | First-person fly-through of Alan Schoen's gyroid triply-periodic minimal surface; GLSL raymarching; 7 audio bands warp the surface equation; thin-film iridescence; warm white on near-black palette; sliders: Scale (structural), Warp, Film |
| F24 | Descent | First-person descent into a Mandelbox IFS fractal; GLSL raymarching through infinite box-folded crystal lattice; bass drives fold geometry, mid drives scale; warm key + cool fill lighting; near-monochrome pale-blue on deep indigo-black; sliders: Depth (structural), Warp, Speed |
| — | Drift | Ping-pong FBO feedback texture mapped onto a 3D torus; freq bands inject warm-amber (bass) → cool blue-white (treble) streaks into the feedback loop; UV scroll creates orbiting color wash on the surface; vertex displacement from feedback brightness corrugates the mesh; UnrealBloomPass desktop; sliders: Form (tube radius — structural), Decay, Warp |
| — | Heliograph | 7 matte-to-mirror aluminium relief panels arc in a semicircle; each panel's vertices are displaced in Z by 5-octave FBM noise driven by its frequency band amplitude; finite-difference normals give correct Blinn-Phong specular on the displaced surface; 3-point studio lighting (warm key + cool fill + rim); beat fires a transient brightness flash; camera sweeps sinusoidally in front of the arc; UnrealBloomPass + ACESFilmic tone mapping; mobile guard (16 vs 32 subdivisions, pixel ratio 1.0); inspired by Anish Kapoor's "Cloud Gate" and Richard Serra's steel plate installations; sliders: Spread (arc span 28°–144° — structural), Polish (matte→mirror — structural), Depth (audio displacement amplitude) |
| F9 | Grid Warp | Live mesh grid bends space itself; nodes ease continuously toward a target built from Perlin drift plus a per-band pull (sub-bass=left → brilliance=right); beats add a decaying radial pressure wave instead of snapping; no image = glowing cyan/white wireframe lattice; with an uploaded image, the image warps through the mesh via per-triangle affine texture mapping; sliders: Density (grid resolution — structural), Warp, Flow |
| F28 | Specter | Audio-reactive spherical harmonics sculpture; icosahedral mesh deformed by 7 real spherical harmonic modes (one per freq band), each weighted by a Complexity slider — low Complexity yields smooth ellipsoids, high Complexity produces angular star-burst polyhedra; warm amber key light + cool fill, flat facet shading via GLSL dFdx/dFdy normals; camera follows elliptical latitude orbit for continuous three-axis rotation; UnrealBloomPass; restrained near-monochrome palette (warm ivory, amber emissive, cool fill rim — no rainbow); mobile guard (detail=3 vs 4); sliders: Complexity (harmonic weighting 0=smooth sphere→1=spiky starburst — structural), Displacement (audio deformation amplitude), Glow (bloom + emissive pickup) |
| F29 | Flux | 3D vector field visualization; N³ burnished-metal needle instances fill a cubic lattice and orient themselves along a continuously evolving audio-driven field equation; sub-bass drives global field rotation, higher bands introduce turbulence — quiet passages align needles in near-parallel sheets while loud passages twist the lattice into swirling disorder; amber conical tips accent each needle's direction; warm key / cool fill two-point studio lighting; ACESFilmic tone mapping; camera orbits slowly on an elliptical path; no rainbow, no neon; mobile guard (smaller grid, lower pixel ratio); inspired by Ryoji Ikeda "datamatics" (2006–2010) and Julius von Bismarck field-density installations; sliders: Grid (needles per axis 3–10 — structural), Spread (lattice half-size), Turbulence (audio twist amplitude 0=laminar→1=chaotic) |
| F30 | Oscillograph | 3D Lissajous curve field rendered into a ping-pong phosphor FBO; 7 parametric curves (one per freq band) trace [a,b,c]-ratio Lissajous paths in perspective 3D space with additive blending, accumulating into glowing oscilloscope phosphor trails; warmth-gradient palette (amber sub-bass → neutral mid → cool blue-white brilliance — no rainbow); CHOP-style continuous easing of phase drift and beat-flash decay; EffectComposer UnrealBloomPass on desktop; beat fires camera-angle impulse + flash; mobile guard (half-res FBO, 256 vs 512 points/curve); inspired by Jerobeam Fenderson & Hansi Raber "n-spheres" oscilloscope music (2024, https://oscilloscopemusic.com/); sliders: Complexity (Lissajous ratio tier 1–5 — structural), Trace (phosphor persistence), Scale (audio amplitude sensitivity) |
| F31 | Strata | GLSL sphere-traced alien terrain; single fullscreen quad + ShaderMaterial; 7 freq bands drive distinct geological layer heights at octave-spaced spatial frequencies (sub-bass=large rolling hills, brilliance=fine crystal facets); warm amber directional sidelight + soft shadow march; exponential depth fog into deep-indigo void; camera orbits steadily at configurable altitude, looking down at the landscape; beat fires a brief ground-heave transient; restrained geological palette (dark basalt → rust iron → warm ochre → pale limestone, no rainbow); mobile guard (0.6 dpr, 90 vs 150 ray-march steps); inspired by "Elevated" (Rgba & TBC, Breakpoint 2009, https://www.pouet.net/prod.php?which=52938) and VJ terrain aesthetics in live electronic music performance; sliders: Terrain (spatial zoom — structural: 0=close-up canyons, 1=wide panorama), Warp (domain-warp chaos), Altitude (camera height) |
| F32 | Sonambient | Dense grid of thin metallic rods in a darkened space; each rod continuously oscillates by tilting from its base — 7 radial frequency zones (sub-bass=slow wide sway at centre, brilliance=rapid fine tremor at rim) driven as CHOP-style continuous signals; two-point studio lighting (warm amber key + cold steel fill) on physical MeshStandardMaterial chrome with no emissive glow; InstancedMesh with per-frame matrix updates; beat fires an outward ring-wave that briefly amplifies each rod as the wavefront passes; camera orbits at ground level revealing the field in perspective; mobile guard (8–14 vs 10–20 rods per side); inspired by Harry Bertoia "Sonambient" sculptures (1960s–70s, Chinati Foundation permanent collection, Marfa TX, https://www.bertoia.org/sonambient.html) and TouchDesigner instanced-cylinder audio-reactive community patches; sliders: Density (grid size — structural), Resonance (tilt amplitude), Patina (surface roughness 0=mirror chrome → 1=brushed matte) |
| F36 | Reeds | N thin acrylic rods arranged in a golden-angle phyllotaxis field; 7 radial freq zones drive emissive brightness; custom ShaderMaterial vertex shader bends rod tips proportional to each zone's audio amplitude — rods sway like reeds in wind; Vantage slider shifts camera from inside-the-field eye-level (revealing parallax depth) to overhead (revealing the sunflower phyllotaxis geometry); near-monochrome warm amber/cream palette (no per-band rainbow); UnrealBloomPass halos neighbouring rods when bands are loud; mobile guard (180 vs 380 rods); inspired by UVA "Momentum" (2016, large-scale installation of individually-addressable vertical light rods, https://uva.co.uk/works/momentum); sliders: Vantage (camera elevation 0=inside forest→1=overhead — structural), Glow (bloom+emissive brightness), Flow (sway/bend amplitude+orbit speed) |
| F38 | Filaments | Hanging resin strand curtain; N TubeGeometry strands descend from a virtual ceiling into a warm-charcoal void; 7 freq bands each drive a group of strands' lateral sway — bass strands sweep in slow deep arcs, brilliance strands shimmer in fast fine tremors; MeshPhysicalMaterial with transmission and attenuation gives an amber-glass resin look that transitions to clear crystal via the Clarity slider; warm tungsten SpotLight key light from one side + cool blue rim fill from the other; beat fires a downward-travelling displacement wave that propagates from ceiling to floor; camera orbits at human eye-level revealing parallax depth through the curtain; ACESFilmic tone mapping; subtle UnrealBloomPass on desktop; mobile guard (30 vs 60 strands, pixel ratio 1); inspired by Yasuaki Onishi "Reverse of Volume" (2009–present, https://www.yasuaki-onishi.com/works/reverse-of-volume/) — suspended hot-glue and thread installations that crystallise the invisible air volume of a space; sliders: Density (strand count sparse curtain→dense forest — structural), Clarity (frosted amber resin → clear glass transmission — material character), Sway (audio displacement amplitude) |
| F39 | Stringer | A field of luminous vertical strings fills a dark architectural void; each string vibrates as a standing wave whose harmonic count and amplitude respond continuously to one of 7 frequency bands — sub-bass produces slow 2-loop oscillations, brilliance drives rapid 8-loop fine tremors; single merged BufferGeometry + custom ShaderMaterial (one draw call); camera weaves through the string field at human height on a slow sinusoidal path so strings become an inhabited interior space; near-monochrome warm-white / cool-silver palette, no rainbow, no radial pulses; warm-white emissive varies per vertex with wave amplitude; UnrealBloomPass; beat fires a brief brightness surge; mobile guard (10–60 strings, 16 vertical segments vs 20–200 / 28 desktop); inspired by Paul Friedlander's chromastrobic spinning-string sculptures (1983–ongoing, https://paulfriedlander.com/Light_Sculpture.html) — a single rope spun at 600 rpm under rapidly colour-cycling light becomes a three-dimensional luminous form whose shape encodes frequency; sliders: Strings (structural: 20–200 desktop, changes geometry), Resonance (vibration amplitude sensitivity), Glow (bloom strength + emissive brightness) |
| F41 | Dispersion | 7 concentric rotating rings of octagonal glass prism columns; each ring maps to one audio frequency band (sub-bass innermost → brilliance outermost) and rotates CW/CCW alternately at continuously amplitude-driven speed — no beat-snap, beat transients add a decaying rotational kick; MeshPhysicalMaterial with iridescence (iridescenceIOR 1.9, thickness 80–500 nm) creates prismatic shimmer as prisms turn under a warm overhead SpotLight + cool fill DirectionalLight; camera orbits the barrel exterior at mid-height with gentle altitude oscillation; subtle UnrealBloomPass on desktop; mobile guard (reduced prism counts per ring, pixel ratio 1); inspired by UVA "Column" (2013, https://uva.co.uk/works/column) kinetic light installation; sliders: Rings (2–7 concentric rings — structural), Spin (audio sensitivity for rotation speed), Clarity (frosted opaque → clear iridescent glass) |
| F42 | Foam | 3D Voronoi cellular foam via GLSL raymarching; soap-bubble cell-wall SDF (d₂−d₁ Worley metric) lit with warm amber (bass) ↔ cool steel-blue (treble) palette; 7 freq bands add standing-wave SDF modulations at golden-angle-distributed axes so foam breathes continuously with the music; slow tilted camera orbit; beat fires a brief wall-compression impulse that decays exponentially; Phong shading + subsurface edge glow on cell walls; mobile guard (48 vs 80 march steps, 0.6 pixel ratio); inspired by Erwin Hauer "Continua" architectural screens (1950s–60s) and Floris Kaayk "Metalosis Maligna" (2006); sliders: Density (Voronoi cell scale — structural), Wall (cell-wall brightness/thickness), Glow (overall luminosity + camera distance) |
| F43 | Dune | Audio-reactive desert sand surface; PlaneGeometry (110×110 desktop / 50×50 mobile segments) displaced by a GLSL vertex shader summing 7 sinusoidal height modes — one per freq band — at evenly-spread compass directions: sub-bass makes long lazy dune crests, brilliance makes fine surface ripples; drama comes entirely from shadow cast by the displaced surface under a single low-angle raking directional light, no glow, no emissive, no rainbow; warm ochre sand palette (pale crest → mid ochre → dark shadow); beat fires a radial impact-crater ripple from centre; camera low-angle, slowly orbiting; ACESFilmic tone mapping; mobile guard (50×50 segments, pixel ratio 1.0); inspired by Lita Albuquerque "Stellar Axis: Antarctica" (2006, https://olafureliasson.net/artwork/stellar-axis/) and real-time raking-light audio patches in the Elekktronaut TouchDesigner community; sliders: Dunes (spatial frequency — structural: 0=long desert dunes, 1=fine beach ripples), Depth (audio amplitude sensitivity — flat surface to dramatic tall dunes), Sun (sun elevation — 0=near horizon long dramatic shadows, 1=overhead flat light) |
| F44 | Spire | N×N grid of sharp stone spires on a dark ground plane; single raking directional light casts dramatic shadow bars between spires; camera orbits the perimeter at mid-height looking inward; 7 freq bands drive spire heights across column zones continuously (CHOP-style per-frame lerp) — sub-bass=left, brilliance=right; beat fires an upward camera jolt + brief light surge that decays — no geometry snap; restrained cold-obsidian → warm-sandstone palette (no rainbow, no neon glow); ACESFilmic tone mapping; desktop shadow map + subtle UnrealBloomPass for spire-tip highlights; mobile guard (8×8 max grid, no shadows, pixel ratio 1.0); inspired by Maya Lin "Wave Field" (1995, University of Michigan, https://www.mayalin.com/) — a landscape of earthen mounds that recall ocean waves — and the way raking sidelight in real-time VJ patches turns instanced height data into shadow-theatre; sliders: Formation (grid density 4–12 spires per side — structural), Height (amplitude sensitivity), Warmth (0=cold moonlit obsidian / blue-white key light → 1=warm sundown sandstone / amber key light) |
| F45 | Membrane | Large iridescent metal surface resonating with 7 standing-wave harmonic modes driven by audio frequency bands; MeshPhysicalMaterial thin-film iridescence colours every wave crest according to viewing angle and surface normal; CPU vertex displacement writes directly to Float32Array each frame so Three.js can recompute normals correctly; warm SpotLight key + cool fill DirectionalLight studio rig; no rainbow palette, no neon glow, no centre pulse; beat-kick impulse decays continuously (CHOP-style); camera orbits in a slow sinusoidal path; very subtle UnrealBloomPass desktop-only; mobile guard (no bloom, fewer segments); inspired by Tokujin Yoshioka "Crystallize" (2011, Swarovski Crystal Palace, Design Miami, https://www.tokujin.com/work/crystallize); sliders: Detail (mesh segment count — structural), Amplitude (wave displacement height), Film (thin-film thickness 0=thin blue shimmer → 1=full soap-bubble spectrum) |
| F46 | Cinder | IFS (Iterated Function System) fractal chaos-game point cloud in 3D; 7 affine transforms (one per freq band) each map to a structural sub-region of a fern-like attractor; band amplitudes weight transform-selection probability so dominant frequencies sculpt the geometry in real time — loud sub-bass floods the base, treble concentrates the tips; 80 K–250 K points (18 K–60 K mobile) accumulate in a ring buffer updated each frame with a custom ShaderMaterial vertex shader that computes per-point age from uRingHead uniform entirely in GLSL (no CPU sort); warmth-shifted near-monochrome palette (cool silver-blue embers → warm amber-gold cinders); beat fires a camera-orbit velocity kick that decays exponentially; UnrealBloomPass desktop only; no per-band rainbow palette, no concentric ring beat pulse; mobile guard (reduced ring-buffer size, no bloom, lower pixel ratio); sliders: Density (chaos-game iterations per frame 0=sparse embers → 1=dense constellation), Chaos (IFS transform weight spread 0=uniform distribution → 1=fully audio-driven), Warmth (cool silver-blue → warm amber-gold cinders), Glow (bloom and trail persistence) |
| F48 | Typograph | 3D extruded typography relief wall; 7 rows of capital letters (one per frequency band, sub-bass at bottom → brilliance at top) extrude toward the camera proportional to their band's live amplitude via continuous CHOP-style easing — the depth of each row tells you how loud that frequency band is at every moment; warm ivory MeshStandardMaterial under a 2-point studio rig (warm amber key light + cool steel fill); characters rotate through a random shuffle every few seconds; camera yaws slowly within ±35° and receives a brief kick on beat transients; no rainbow palette, no 3-pass neon glow, no hue-jump on beat; mobile guard (5 columns max, reduced bevel segments, pixel ratio 1.0); inspired by Ryoji Ikeda "data.tron [FRAGMENT]" (2008, YCAM Yamaguchi) where data is rendered as a physical typographic field in space; sliders: Columns (letters per row 4–10 — structural), Relief (pop-out depth: flat grid → full extrusion), Warmth (emissive/light temperature: cool white → warm amber) |
| F49 | Tape | Loose magnetic-tape ribbon strips drift through dark studio space; N CatmullRomCurve3 ribbon strips (3–12 via Count slider — structural) have 6 control points each that lerp continuously toward Perlin-noise targets — audio band amplitude scales drift amplitude and beat fires a velocity kick rather than snapping state; ping-pong FBO feedback accumulates motion blur each frame (previous frame is zoomed slightly, rotated a fraction of a degree, and multiplied by a decay factor before the new ribbons are drawn on top); warm amber-to-copper MeshStandardMaterial palette under a two-point studio rig (warm amber key + cool steel fill); slow elliptical orbit camera with gentle altitude drift; ACESFilmic tone mapping; no rainbow palette, no 3-pass neon glow, no hue-jump on beat; mobile guard (22 vs 44 curve segments, pixel ratio 1.0); inspired by Karsten Schmidt (toxi.cc) continuous curved-surface ribbon work and TouchDesigner SOP-ribbon feedback-texture patch aesthetics (https://toxi.co.uk/); sliders: Count (ribbon strand count 3–12 — structural), Flutter (audio displacement amplitude: barely moving → wild thrashing), Sheen (material roughness: 0=rough matte tape → 1=polished mirror chrome) |
| F50 | Lattice | Audio-reactive 3D crystal lattice; a simple-cubic N×N×N array of metallic node spheres (InstancedMesh SphereGeometry) connected by cylindrical bonds (InstancedMesh CylinderGeometry) fills the scene; 7 frequency bands each drive a distinct displacement mode — sub-bass radial expansion, bass transverse Y-wave, lowMid transverse Z-wave, mid axial twist, upperMid X-wave, presence scale pulse, brilliance micro-noise perturbation — so every part of the spectrum animates a different structural quality of the lattice; all displacements are CHOP-style continuous lerp targets, with a decaying beat-kick impulse added on top for transient energy; warm amber DirectionalLight key + cool steel fill two-point studio rig, no rainbow palette, no neon glow; slow orbital camera at 24° elevation; desktop UnrealBloomPass + OutputPass; mobile guard (N≤4, fewer sphere/cylinder segments, pixel ratio 1.0, no bloom); Scale slider changes N (structural — rebuilds geometry), Wave drives displacement amplitude, Glow adjusts bloom strength and emissive pickup; inspired by George W. Hart "72 Pencils" crystal sculpture and TouchDesigner SOP-crystal-lattice VJ patches; sliders: Scale (N=2–5 nodes per axis — structural), Wave (displacement amplitude: subtle breathing → dramatic crystal deformation), Glow (bloom + emissive brightness) |
| F47 | Platter | Seven brushed-metal CylinderGeometry platters (one per frequency band) float in a dark studio space; a custom ShaderMaterial renders concentric groove rings (like hard-drive platters or vinyl records) with Blinn-Phong specular and Fresnel rim lighting from two orbiting studio spotlights; each disc continuously tilts in its assigned outward direction proportional to its band amplitude, revealing genuine 3D depth — discs appear as thin slivers at silence and face-on circles at full volume; palette warmth derived from live bass/treble balance (bass-heavy → warm bronze, treble-heavy → cool platinum) — no per-band rainbow, no neon additive glow; slow 360° camera orbit at 35° elevation with gentle handheld Y sway; beat fires a decaying spin impulse (no state cuts, no hue jumps); UnrealBloomPass desktop only; mobile guard (64 vs 128 radial segments, no bloom, pixel ratio 1.0); inspired by Wolfgang Tillmans "Freischwimmer" (2003) and Pfadfinderei VJ material aesthetic; sliders: Spread (structural — disc Y separation: tight stack → spread column), Tilt (structural — max audio tilt angle: flat discs → dramatic 3D lean), Glow (inner emissive warmth + bloom intensity) |
| F40 | Lamina | Hundreds of thin metallic plates cluster in a dark void on a Fibonacci-sphere distribution; each plate is assigned to one of 7 frequency bands, continuously easing toward an audio-displaced home position — bands with high amplitude push their plates outward along the sphere radius; plates rotate slowly on their own axes at varying speeds giving an ever-changing glinting silhouette; camera orbits at a fixed radius with gentle sinusoidal altitude drift; MeshStandardMaterial with configurable roughness/metalness/envMapIntensity; IBL via PMREMGenerator + RoomEnvironment; UnrealBloomPass on desktop; beat fires an additive radial scatter impulse (not a state reset — continuous motion at all times); Warmth slider morphs material from cool steel-blue (low metalness, slight blue tint) to warm amber-gold (high metalness, amber emissive); no rainbow per-band palette, no 3-pass neon glow, no hue-jump on beat; mobile guard (50 vs 170 plates, pixel ratio 1.0); inspired by Studio DRIFT "Fragile Future" chandelier sculptures (2006–present, https://www.studiodrift.com/work/fragile-future) — hundreds of dandelion seeds cast in bronze suspended in precise formation so the whole reads as a single luminous mass whose texture emerges from the individual reflective surfaces; sliders: Count (plate density 50–300 — structural), Scatter (beat impulse strength), Warmth (cool steel → warm amber) |
| F37 | Chronicle | 3D scrolling audio sediment landscape; each frame of the 7-band spectrum is deposited as a row of flat-shaded geometry that scrolls back through Z, building a physical relief record of the music over time; interpolated 25-column mesh updates per-frame with DynamicDrawUsage; warm terracotta MeshStandardMaterial with directional lighting — no rainbow palette, no neon glow; camera orbits the landscape with beat-reactive elevation pulses; Depth slider changes row count from shallow sketch to deep archive (structural); mobile guard (MAX_ROWS 40 vs 96, MAX_HEIGHT 4.5 vs 6.0); inspired by Quayola "Partitura 002" (2011, https://quayola.com/partitura/); sliders: Depth (history depth — structural), Height (amplitude-to-height sensitivity), Orbit (camera orbit speed and elevation) |
| F35 | Relay | Audio-reactive video feedback synthesis; 7 glowing emissive nodes (warm amber bass → cool silver-white treble) orbit in a 3D formation inside a large dark sphere; each frame the scene renders to a ping-pong FBO and the feedback shader zooms toward the vanishing point, rotates, and applies configurable chromatic RGB-channel offset before decaying — the accumulated signal becomes a "signal atmosphere" painted on the sphere interior; camera orbits slowly giving genuine 3D parallax; mobile guard (half-res FBO, no bloom); inspired by Andrei Jay "WAAAVE_POOL" (2019, framebuffer feedback synthesizer, https://github.com/ex-zee-ex/waaaave_pool); sliders: Formation (node cluster spread — structural), Cascade (feedback depth / signal memory), Aberration (chromatic RGB channel separation) |
| F34 | Nimbus | Volumetric storm-cloud chamber; GLSL fullscreen-quad raymarching of a 3D layered-noise density field (value-noise FBM); 7 audio bands modulate cloud density at octave-spaced spatial scales (sub-bass=large slow billows, brilliance=fine surface wisps); single-sample Beer-Lambert shadow ray per voxel for sun shading; camera drifts on a Lissajous path through the bounded cloud volume; beat fires a warm amber lightning flash from within the cloud; restrained near-monochrome palette (deep indigo void, cool grey-blue cloud shadow, warm cream-white lit face, amber-gold lightning); mobile guard (0.5 dpr, 28 vs 52 ray-march steps); inspired by Olafur Eliasson "Your Blind Passenger" (2010, ARoS Aarhus fog tunnel installation) and Inigo Quilez's real-time volumetric cloud rendering (iquilezles.org); sliders: Coverage (cloud density — structural: 0=near-empty wisps, 1=dense overcast), Turbulence (domain-warp chaos), Lightning (beat flash intensity) |
| — | Aperture | Perforated metallic sphere; a SphereGeometry shell covered in a hexagonal close-packed hole grid via a custom GLSL fragment shader (fragment discard inside each hex cell); holes dilate and contract per latitude-mapped freq band (sub-bass=equator → brilliance=poles); inner emissive amber core visible through holes; 3-point Blinn-Phong lighting (warm tungsten key + cool fill + rim); slow elliptical camera orbit; warm-steel palette; beat fires a brief shell brightness flash; ACESFilmic tone mapping; mobile guard (pixel ratio 1.0 vs 2, 128×64 vs 256×128 sphere segments); inspired by Herzog & de Meuron "Prada Aoyama" Tokyo flagship perforated metal mesh facade (2003, https://www.herzogdemeuron.com/projects/173-prada-aoyama/); sliders: Density (hole grid scale — structural), Breathing (audio hole-dilation sensitivity), Warmth (inner glow intensity) |