Editors

• One URL per artifact. /app/w/<canvas>/edit/<node> opens whichever editor the node calls for. Use the browser’s back button to return to the canvas.
• Preview | Code. A view toggle switches between the rendered result and the source in a Monaco editor. Edits recompile the preview as you type.
• Save. ⌘S or the Save button; a dot marks unsaved changes. Auto-save runs too, and a crash-recovery draft is offered (Restore / Discard) if the tab closed mid-edit.
• Version history. Every save snapshots the document; the last 30 are kept per node. Restoring loads a snapshot as an unsaved change, so you can compare before you commit.
• The agent edits in place. The chat rail runs the same Workflow Agent with document tools: it makes targeted edits, rewrites the whole file when that is clearer, and searches the source. Your own edits and the agent’s never collide — an agent edit computed against a version you have since changed is refused with a warning rather than silently overwriting your work.
• Leaving is safe. A turn in flight belongs to your session, not the tab: navigate back to the canvas and return and the agent is still working; the transcript and document land when it finishes.

For screen nodes — complete HTML pages. The preview is the real page in a sandboxed frame, with the toolbar:

Prev / next screen

Arrows step through the other screens on the canvas; they are real links, so browser history follows.

Outline

A document outline of the page; clicking a heading jumps the code view to that line.

Select an element

Inspect mode — click anything in the preview and its tag, id, classes and size attach to your next message, so 'make this button bigger' points at the exact element.

Mobile / Desktop

Switch the preview viewport. The choice is saved with the screen.

Open in new tab

The page on its own, sandboxed.

Share

Publish a public link at /s/<id>, copy it, or Copy prompt with link to hand the page to another agent. The link follows the work — it updates after every agent turn.

Export

HTML file, PDF fit to content (with page-size options), or a ZIP with every asset.

Preview pane

Multi-page screens navigate inside the frame: back and forward arrows, a route field, a Routes menu and Reload. A drag handle on the frame’s edge resizes the preview width — arrow keys step 16px, Shift ×4, double-click resets — so you can check breakpoints without leaving the editor.

Chat rail

Attach reference images (PNG, JPEG, WebP, GIF, AVIF) by drag, paste or the attach button. Send while a turn is streaming and the message queues behind it; a failed response pauses the queue with Resume and Dismiss. An Agent memory menu shows the few things the agent has noted about this screen, each editable or forgettable.

For GLSL code nodes — fragment shaders in the Shadertoy convention, running live on your GPU. The rail toggles between Uniform controls, Edit with AI and Version history; the toolbar adds:

Freeze this frame / Resume

Pause the clock. Knobs still repaint a frozen frame, and resuming continues from the frozen moment rather than skipping ahead.

Restart from the beginning

Reset the shader's time to zero.

Capture the current frame

Rasterize the frame you are looking at onto the canvas as an image node, so a shader can feed image models.

Share

Create share link publishes a snapshot with the current knob positions baked in; Update link republishes the current state; Revoke takes it down. Deliberately not live — you tune privately, then decide what to show.

Export

Standalone page (a single HTML file with the harness and your knob values) or the raw Shader source.

Knobs

A shader declares its own tunable uniforms and annotates them on the same line; the TUNE panel turns those into sliders and pickers, with Reset to return every knob to the shader’s defaults. Knob positions save with the node, never into the source, so tuning never rewrites the code you or the agent are working on. Generated shaders always ship with three to five knobs; if an older shader has none, ask the agent to add some.

uniform float uSpeed; // @range 0.1 4.0 @default 1.0 @label Speed

The harness supplies iResolution, iTime, iTimeDelta, iFrame and iMouse, so a shader must not redeclare them or emit #version. Compile errors from your GPU are mapped back onto the exact source line as editor markers, shown to the agent when you ask it to fix the shader, and surfaced on the canvas node as Fix shader.