Fuser

Editing code by hand

The Creative Code editor — opening it, line-diff highlights, Explain this line.

Creative Code has two modes that share the same node: prompt mode, where you describe what you want and an LLM writes the JavaScript, and code mode, where you read and edit that JavaScript directly. They aren't separate features — they're two views on the same sketch. This page covers code mode; for prompt mode see Prompting. Most sessions land in code mode automatically after a prompt, and you'll often stay here for targeted tweaks before going back to prompt mode for the next big move.

Opening the editor

The editor opens automatically the first time a prompt-mode generation starts. You can also switch to code mode directly from the Creative Code node — the editor takes over the foreground and the sketch keeps running on the canvas behind it.

Save your edits with the Save button in the editor toolbar or ⌘/Ctrl+S. The button is disabled when there are no unsaved changes. The node-level Save button on the canvas is a different thing — it captures the running canvas as an asset; see Saving and sharing.

The editor surface

The editor uses a dark theme tuned for long sessions. You get:

  • Syntax highlighting for JavaScript.
  • Line numbers and a clean, fixed-width layout.
  • Line-diff highlights during streaming — when the model is mid-write, new and modified lines are colored so you can track changes as they land.
  • Selection that survives re-renders, so a line you've highlighted stays highlighted while the model writes around it.

The editor is meant for tight, focused edits — declarative param tweaks, swapping a constant, refining a draw loop. For larger restructuring, drop back to prompt mode and describe the change.

Explain this line

Select a line (or a contiguous range) and the Explain this line popover appears. Click it to ask an LLM for a plain-English explanation of what that code does — kept to three sentences or fewer so the popover stays compact.

This is read-only. It doesn't modify the code; it doesn't send the explanation to the chat panel. Use it when you've inherited a sketch from a prompt and want to understand a specific block before touching it, or when you're learning the library and want to see what noiseSeed() actually does in context.

Editing while the model is streaming

You can type while a generation is in flight, but it's usually noisy — your edits get overwritten by the next chunk of stream. If you want to take over, cancel the generation first (or submit a new prompt to interrupt) and then edit. For small tweaks, wait for the stream to finish.

Try to fix

When your sketch crashes at runtime — three consecutive frame errors flip it into the error state (see transient error tolerance) — the editor surfaces a Try to fix action next to the error. Clicking it sends the runtime error message back to the model along with your current code, asking for a targeted patch. The model edits in place rather than rewriting the sketch from scratch, so your params, attachments, and structure usually stay intact.

Reach for Try to fix when:

  • The error is a runtime exception (not a syntax error caught before run).
  • You'd rather keep iterating from the current code than re-prompt from scratch.
  • The error message is informative on its own — model fixes work better when the error is specific.

If two attempts don't resolve it, fall back to a manual fix or a rewrite prompt.

What's Next?

On this page