Hey everyone ![]()
I’ve been building a browser-based node editor for writing and exploring p5.js sketches using LLMs. Think of it as a canvas where each node is a self-contained sketch: you write a prompt, get code, run it live, then branch off from any version to explore variations.
Live demo: Melanie
GitHub: GitHub - R4ph3rd/melanie · GitHub
It’s inspired by research on LLM-assisted creative coding ( https://dl.acm.org/doi/epdf/10.1145/3586183.3606719) anf implements a few more things:
- History tree / branching: every generation is a node; you can fork from any point and keep multiple directions alive in parallel
- Semantic axes: scrub a conceptual slider (e.g. “chaotic → minimal”) to morph the sketch along a auto generated semantic dimension
- Regional editing: select a zone of the canvas and prompt specifically against that area
- Parameter transfer: copy parameters from one sketch node into another
- Cascade re-runs: propagate a change through a chain of dependent nodes
Rough roadmap
- Mullti-file sketches. right now everything is single-file; adding support for class definitions, helpers, and file scoping so larger sketches stay manageable
- Local codebase connection, instead of everything running in an iframe sandbox, a mode that connects to your local dev environment so it edits files you own and version-control yourself
I was also considering making it feel more like TouchDesigner or cables.gl: a live signal-flow graph where the connections between nodes are typed and meaningful, not just history links.
Typed node connections & proper loop workflow with nodes that send and receive signals (numbers, colors, geometry), with a real draw()-loop execution model that runs the graph every frame.
Happy to hear thoughts, curious what interactions feel most natural to you or what do you think would be valuable to add.