The above image remixes the Hydra code "Filet Mignon" from AFALFL and GLSL shader "Just another cube" from mrange. Licensed under CC BY-NC-SA 4.0 and CC0 respectively.
Patchies is a patcher for audio, visual and computational things that runs on the web. It's made for creative coding; patch objects and code snippets together to explore visualizations, soundscapes and computations 🎨
Try it out at patchies.app - it's open source and free to use 😎
Patchies lets you use the audio, visual and computational tools and libraries that you know (and love!), together in one place. For example:
- Create interactive graphics with P5.js, Three.js, HTML5 Canvas and Textmode.js
- Synthesize and process video with Hydra and GLSL shaders
- Live code music with Strudel, ChucK, SuperSonic and Orca
- Synthesize and process audio with Web Audio nodes, Tone.js and Elementary Audio
- Run programs and games on the Uxn virtual machine and write your own with Uxntal assembly.
- Compute like a caveman with stack machine assembly, or like a wizard with Ruby and Python
- Connect to the outside world with MIDI, MQTT, SSE, WebRTC, Iframe and VDO.Ninja.
- Manage data and control flow with js, expr, filter, map, iframe, spigot, trigger, select, metro and more.
- Use built-in widgets or make your own with Vue.js, DOM API, Tailwind or any library you like.
- Use any third party JavaScript library via esm.sh.
Try out the above demo which uses P5.js with Hydra to create a random walk shader.
Patchies is designed to mix textual coding and visual patching, using the best of both worlds. Instead of writing long chunks of code or patching together a huge web of small objects, Patchies encourages you to write small and compact programs and patch 'em together.
If you haven't used a patching environment before, patching is a visual way to program by connecting objects together. Each object does something e.g. generate sound, generate visual, compute some values. You connect the output of one object to the input of another object to create a flow of data.
This lets you visually see the program's core composition and its in-between results such as audio, video and message flows, while using tools you're already familiar with that lets you do a lot with a bit of code. This is done through Message Passing, Video Chaining and Audio Chaining. They're heavily inspired by tools like Max, Pd, TouchDesigner and VVVV.
"What I cannot create, I do not understand. Know how to solve every problem that has been solved." - Richard Feynman
No installation needed. Open patchies.app and start patching.
New to Patchies? Check out the documentation for guides and object references.

