The editor
Edit vs Play, the Float Inspector, the Scene tab, drag-to-place, keyboard shortcuts.
The editor is a visual layer on top of a running game. You toggle into it, pause the game, and rearrange / retune / add things with your hands — without leaving the chat loop.
Edit vs Play
The preview toolbar (top of the iframe) has an Edit / Play toggle on the left.
- Play — the game runs. Input goes to the game. The agent can still receive chat. This is the default state.
- Edit — the game pauses. Entities show selection rectangles. Drag things around, edit fields in the Inspector, drop new entities from the Assets tab.
Keyboard: Cmd+E toggles. Suppressed if you're typing in an input or textarea, so it doesn't fire while you write a chat prompt.
What happens when you enter Edit
- The game scene pauses (the iframe stops simulating).
- The editor overlay scene mounts on top of the canvas.
- The left panel auto-switches from Chat to Scene.
- The publish badge stays as it was.
- Edit-mode tools appear in the toolbar: World / HUD toggle, Show hitboxes toggle.
The Scene tab
The left panel Scene tab has two parts:
- Hierarchy — every entity in the current scene as a tree. Click an entity to select it (selection rectangle appears in canvas, Float Inspector opens). Alt-click in the canvas cycles selection through overlapping entities.
- Palette (bottom strip) — draggable primitives. In World mode: rect, circle, group, trigger, tilemap. In HUD mode: text, button, progress bar, panel.
Drag any palette item onto the canvas to drop a new entity at that position.
The Float Inspector
When an entity is selected, the Float Inspector slides in from the right edge of the iframe. It has:
- Transform — x / y / rotation / scale.
- Visual — per-entity-kind fields (sprite asset, fill color, etc).
- Properties — per-entity behavior parameters (
speed,damage, whatever the agent wired). - Hitbox / Depth anchor — read-only summary + an "Edit hitbox" launcher.
- Tilemap painter (when a tilemap entity is selected) — palette + paint / erase / rect / fill tools.
- Ask AI (top of the Inspector body) — textarea for entity-scoped prompts. The agent receives the entity's context.
The ✕ in the Inspector header clears selection and closes the panel.
Drag-to-place
Three places provide drag sources:
| Drag source | What you drop | Where |
|---|---|---|
| Assets tab (image / spritesheet cards) | A sprite entity using that asset | Canvas (any position) |
| Scene tab palette (World mode) | A rect / circle / group / trigger / tilemap entity | Canvas |
| Scene tab palette (HUD mode) | A text / button / progress-bar / panel widget | Canvas |
The drop position becomes the entity's spawn position. You can immediately nudge with arrow keys (Inspector position field has live arrow-key support) or click-drag in the canvas.
World vs HUD modes
The toolbar's World / HUD pill toggles which scene you're editing:
- World — the gameplay scene. Entities have transforms, physics, scene positions.
- HUD — the heads-up display overlay. Widgets have anchors (9-grid position relative to the viewport) and offsets, not free x/y.
The HUD has different palette items (text / image / icon-button / progress- bar / panel) and Inspector fields (anchor + offset + layer instead of transform).
Toggle is greyed out if the active world has no HUD scene attached. To add one: ask the agent.
Show hitboxes (Debug mode)
The ghost button labeled Debug mode (sometimes called Show hitboxes in code) overlays runtime physics info on the canvas:
- Edit mode — shows authored hitbox rects + depth-anchor crosshairs + per-tile collision metadata.
- Play mode — shows actual Arcade physics bodies + velocity vectors + static-vs-dynamic colors.
Useful for diagnosing "why doesn't this collide right?"
Auto-save (silent)
Every ~10 seconds of idle in Edit mode, your changes flush to disk as a draft — no rebuild, no preview reload, no commit, no upload. This is silent auto-save — fast, invisible, just so you don't lose work.
Explicit save happens when you:
- Press Cmd+S (or Ctrl+S).
- Click Edit / Play to return to Play.
- Click Publish.
Explicit save runs the full pipeline: write to disk → build → commit → upload → reload preview. ~5–15s depending on game size.
A workspace cleanup (e.g. session reclaim) loses any uncommitted silent- save drafts. Always do an explicit save before stepping away for a long break.
Undo / redo
Per-mode command stack: world edits and HUD edits track their own undo history.
- Cmd+Z — undo last command (current mode).
- Cmd+Shift+Z / Cmd+Y — redo.
Inspector field changes are individual undo steps. A drag-to-move is one undo step (start position → end position). Silent auto-saves do NOT advance the baseline, so undo continues to work across them.
Keyboard shortcuts
| Key | Action |
|---|---|
| Cmd+E | Toggle Edit / Play |
| Cmd+S | Explicit save (build + commit + reload) |
| Cmd+Z | Undo |
| Cmd+Shift+Z / Cmd+Y | Redo |
| Backspace / Delete | Delete selected entity |
| Arrow keys | Nudge selected entity 1px (Shift = 10px) |
| Alt + click in canvas | Cycle through overlapping entities at click point |
Common workflows
"Adjust where the agent put something"
Drag the entity in Edit mode. Save. Continue chatting.
"Add three more enemies in specific places"
Drag the enemy sprite from Assets onto the canvas three times. Save.
"Tune a behavior parameter without re-prompting"
Select the entity → Inspector → edit the speed (or whatever) field. Save.
"I want to ask AI about a specific entity"
Select it → type into Ask AI at the top of the Inspector → Send. The agent gets the entity's context automatically.