Plankton

A browser-only visual synthesizer. Write Crystal, compile it to WebAssembly, and animate textures with WebGL 2. Simple is best: a minimal interface, no backend, accounts, or API keys.

frequency = param("frequency", 8.0, min: 1.0, max: 40.0)
osc(frequency, 0.045, 1.4).modulate(noise(3), 0.2).kaleid(5).out

Run

Use the latest Node.js release (>= 22) and Make. Native Crystal is not needed to run the app.

make

Open http://127.0.0.1:4173/; Ctrl+C stops the server. First startup installs dependencies and builds the app, including its compiler assets. Use PORT=4180 make to change the port, or make help for available commands.

Without Make:

npm ci --ignore-scripts
npm run build
npm run dev

npm run build:cdn uses the pinned compiler from jsDelivr instead of bundling it. For GitHub Pages, select GitHub Actions in the repository's Pages settings and push to main; the workflow tests, builds, and publishes the site.

Use

• Write code and press Run (Ctrl/Cmd+Enter). Examples initially show a Preset preview; successful compilation shows Compiled Crystal.
• Combine 36 texture operations, four output buffers, feedback, live parameters, time and mouse signals. Inputs adds images, videos, cameras and microphone analysis; transport controls provide speed, seek, frame stepping and BPM.
• Save/open .cr files, capture PNGs, export JSON/GLSL, or share code by URL. Drafts are saved locally. Shared code and recovered drafts never run automatically. The interface supports nine languages.

See the DSL reference for operations, media inputs and limits, and Architecture for the compiler and renderer design.

Development

make test runs syntax, generated-code and JavaScript checks. Use make help for Wasm, browser and native Crystal test commands. Operation signatures live in schema/operations.json; run npm run generate after changing them. npm run presets regenerates example sources and graphs.

License

Plankton is MIT-licensed. Its DSL is inspired by Hydra, by Olivia Jack and contributors; this independent renderer does not bundle Hydra or p5.js code and is not fully compatible with Hydra.

The compiler package, @live-codes/crystal-wasm 0.4.0, is MIT-licensed; its bundled toolchain has separate licenses. Builds preserve the complete package in dist/vendor/crystal/. Retain its LICENSE, THIRD-PARTY-NOTICES.md and bundled license files when distributing the site. The CDN build uses the same package. Playwright (Apache-2.0) is used only for tests.