Assets, prefabs, edit ops & panels

Beyond the viewport and inspector, the editor has the panels and operations you use to build a project.

Reference: the editor renders the live scene through the engine pipeline — The panels below act on the live scene the viewport renders.

Asset browser

The asset browser (packages/editor/src/components/AssetBrowser.tsx) is a folder tree of project assets with a name search and thumbnails (each asset’s kind — model / image / audio / scene / prefab / material — drives its icon). Drag assets into the viewport or hierarchy to instantiate them. An online asset browser can pull from Polyhaven / AmbientCG.

Prefab workflow

Save a selected entity (and its subtree) as a .prefab.json via the prefab save dialog (PrefabSaveDialog.tsx). Instantiate prefabs into scenes, apply per-instance overrides without touching the source, and unpack an instance back to plain entities. Prefabs can nest.

Scene I/O

The scene serializer (scene-serializer.ts) writes the entity tree + environment to .vscn.json, with autosave (the store debounces saves) and version stamping. Serialize → reload is idempotent (round-trips to semantic equality).

Edit ops

From the editor store (editor-store.ts): undo/redo (50-deep, gesture-coalesced), copy / cut / paste, duplicate, delete, and select-all. Gizmo drags push a single undo step on release.

Command palette

Ctrl+K opens the command palette (CommandPalette.tsx) — a searchable list of editor actions (focus, save, play, view presets, …).

Console & build panels

The bottom panel hosts the console (ConsolePanel.tsx) — engine logs with level filtering — and the build/export panel (BuildPanel.tsx), which runs build:web (HTML5 / itch.io → vgai-web.zip) or a Steam-ready desktop build via the editor server’s /__editor/export endpoint.

Navmesh baking

The navmesh handler (navmesh-handler.ts) bakes a recast navmesh from meshes tagged with walkable / obstacle roles; bake parameters live in the scene environment (see Navigation).