User Guide · Editor tour
User Guide
Developer
The editor, region by region
One workspace holds everything: a toolbar across the top, asset tools on the left, the 3D canvas in the middle, and structural properties on the right. Both the 3D model and the dieline draw from a single shared state, so they can never disagree.
Routes the editor answers to
/editor— opens the default mailer box./editor/<templateId>— opens any of the 11 catalog templates, e.g./editor/rsc-box.?state=…— a share link restores a full editor snapshot. When present, it wins over your local save.?embed=1— renders the read-only viewer chrome used by embed snippets: the panels and toolbar are hidden, the model stays interactive.
With no share link and no local save, the editor falls back to the template's default dimensions. A local save for the same template wins over the defaults — you always continue where you left off.
Top toolbar
The toolbar holds the template menu (all 11 templates, grouped by category), undo/redo, Save, Share, and Export. Save writes to your browser for the current template and shows a green Saved check afterwards. Share copies a read-only link — and warns you when large artwork had to be stripped from it. Export opens the export dialog, where every option shows its plan gate up-front.
Left: asset tools
Seven tabs feed artwork into the scene: Upload, Logo, Prints, Colors, Symbols, Text, Patterns. Uploads accept drag-and-drop and become textures; Colors holds a picker per panel; Symbols carries packaging marks (recycle, fragile, this-side-up) as inline SVG. Below the tabs, the placed-artwork list shows every piece in the scene with its target panel, offset, scale, rotation, and a remove button. Details on the Artwork & panels page.
Center: the 3D canvas
The viewport is a real-time 3D scene. Drag to orbit, scroll to zoom, right-drag to pan; the camera reframes itself when you switch templates. Click any panel to select it — the matching dieline region highlights too — and click empty space to deselect. The canvas toolbar toggles safe-zone guides and opens or closes the lid/flaps (a smooth animation, not a snap). Contact shadows can be switched off from the lighting section.
Right: properties panel
- Dimensions — width, height, and depth in millimetres, decimal values allowed.
- Structure — material chips, and for box templates a board-thickness slider from 0.2 to 1 mm.
- Finish — matte, gloss, soft-touch, or foil, where the template supports them.
- Lighting — Studio, Softbox, Dramatic, or Outdoor presets, plus a contact-shadow toggle.
- Background — a solid color, a named gradient, or your own image.
3D, Dieline, and Split views
The view toggle in the canvas switches between three modes. 3D is the folded model. Dieline is the flat vector: solid cut lines, dashed creases, bleed guides, and dimension annotations — pan and zoom work, and clicking a panel region selects that panel. Split mounts both side by side, which is where the sync is most visible: drag a dimension and both regenerate in the same frame.
Why the two views can never drift apart
Keyboard shortcuts
| Shortcut | Action |
|---|---|
| ⌘Z | Undo the last change |
| ⇧⌘Z or ⌘Y | Redo |
History holds 50 entries and coalesces rapid changes from the same control (a dimension drag becomes one undo step). It lives in memory, so it resets on reload — the autosaved snapshot is what survives.
Embed mode
Adding ?embed=1 to any editor URL hides the editing chrome for embedding in an iframe. It is read-only by convention — the panels are hidden, not the state — so treat shared links as public. See Exporting for the embed snippet and its plan gate.