ogof is in alpha — free while we build it; the full version will be paid. Testers who send feedback get a launch discount. Send feedback

ogof

Start a map › Keyboard shortcuts

Keyboard shortcuts & gestures

Everything the editor does, and how to reach it — from the keyboard, or by touch on a phone or iPad.

Keyboard & mouse

Tip: ⌘ on macOS, Ctrl on Windows / Linux.

Tools & modes

VCursor mode — leave any tool mode (brush, line, text)
BBrush mode: drag to paint freehand strokes · 1–9 pre-set the next stroke's colour (the pencil cursor tints to match)
LLine mode: click (or drag) from start to end — stays armed so you can chain more lines · L or Escape to exit
TText mode: a single click places a text label (auto-edits) and exits the mode · T or Escape to exit without placing
⌥/Alt or Shift + 1–4 with nothing selectedSet this file's default shape — what double-click creates: 1 rectangle · 2 circle · 3 triangle · 4 hexagon (saved with the map as defaultshape; hexagons snap edge-to-edge and never overlap · ogof --hexagon seeds it from the CLI)

Create

Double-click empty canvasAdd a new node of the file's default shape at the cursor (auto-edits the label)
T then clickPlace a free-floating text label
L then click, clickDraw a line
B then dragPaint a freehand stroke
⌘/Ctrl + V an image · drop an image filePlace the image on the canvas (scaled down on insert; unavailable in shared snapshot views)
Drag a blue handle dot into empty spaceSpawn a new node at the cursor, already connected
PWith nodes selected: turn them into piles, or back into ordinary nodes · with nothing selected: put a new pile in the middle of the view. A pile is a stack you take copies from
Drag a pileTake a copy — same shape, colour, size and label — and drop it; its label is ready to type into · drag the pile's grip to move the pile itself

Select

Click an itemSelect it (replaces the current selection)
Drag on empty canvasRubber-band select nodes, texts, and images — lines join only when the band caught nothing else (they count only where a segment actually crosses the band)
Shift-drag on empty canvasAdd to the existing selection instead of replacing
⌘/Ctrl + ASelect every node, text, and line on the current map
Click on empty canvasClear the selection

Edit & style

Double-click a node / textEdit its label inline · Enter commits · Escape cancels
1–9 with anything selectedRecolor nodes, texts, lines, strokes, and the selected edge: 1 default · 2–8 blue, purple, green, yellow, red, orange, gray · 9 black (nodes invert to white-on-black; text: bold black)
+ / - with anything selectedStep palette colour by ±1 (wraps 1↔9)
⌥/Alt + 1–4 with nodes selectedSet the shape of every selected node: 1 rectangle · 2 circle · 3 triangle · 4 hexagon — non-rectangles are fixed-size (E-resize refuses them; becoming one drops a pinned size)
Shift + 1–9 with nodes or texts selectedFont size: 1 default (14px) → 9 largest (56px) · Shift + +/- steps it
Shift + 1–3 with lines selectedLine render style: 1 straight (default) · 2 smooth bezier · 3 orthogonal (right-angle elbows)
E with one node selectedToggle resize mode — drag the orange corner grips · Shift + E resets to auto-size · E or Escape to finish (circles, triangles and hexagons are fixed-size)
Drag a selected image's corner gripResize the image
A with one node selectedToggle anchor — the map centers on this node on load (one anchor per map)
2+ nodes / texts selectedFloating toolbar above the selection: align items on a horizontal or vertical centre line — if the result would overlap, items are spread along the line with a 20px gap

Arrange & move

Drag an item's bodyMove it (and any other selected items together)
⌥-drag (Alt-drag)Duplicate the selection (nodes, texts, lines, edges) and drag the copies · press ⌥ partway through a drag instead and a copy stays where the drag began
Hold Shift while draggingSnap to the 20px background grid (nodes, texts, line bodies, line endpoints)
Shift-drag a hexagonGrab and move its whole snapped-together cluster as one (drop settles everything back onto the lattice)
Drag a line endpoint dot (when selected)Resize / re-aim the line
Double-click a lineAdd a control point — the line runs through every added point · drag the green dots to reshape · double-click a green dot to remove it (works inside L-mode too)
Delete / BackspaceRemove the selection (nodes take their submap subtrees along)

Connections

Drag a blue dot to another nodeCreate a connection — release anywhere near the node once its handles show; the green handle is the one that will receive the edge (nearest to the cursor)
Drag a blue dot onto an existing connected handleRe-route the existing connection
Drag a blue dot into empty spaceSpawn a new node at the cursor and connect to it
Click an edgeSelect it (turns blue + thicker) · Delete removes it
Double-click an edge (or its label)Label the connection — "depends on", "triggers". Enter commits, Esc reverts, an empty label removes it
(creating a new edge)Replaces any prior edge between the same pair (undirected)

Submaps & navigation

⌘-click (macOS) / Ctrl-click / middle-click a nodeEnter that node's submap
Breadcrumb (top left): 🏠 › map › submapClick any crumb to go back to that level — the one before the last is one level up, the map's name is the whole map. Deep trails collapse the oldest levels into "…"
🏠 in the breadcrumbAll maps: ogof.io's start page, or the app's start window · not shown in the CLI, which opens one file
(current submap + view)Persisted in the URL hash (#/path?z=&x=&y=) so reloads / bookmarks / back-forward restore them

View

Mouse wheelPan — each notch moves exactly one background grid block
Two-finger trackpad swipe · right-click + dragPan freely
Trackpad pinch / ⌘+scroll / Ctrl+scrollZoom in / out (anchored to the cursor; clamps 50% – 800%)
− / + buttons (bottom left)Zoom out / in around the window centre
⚙ button (bottom left, beside the zoom)Map settings: default shape, theme, background grid on/off and default font, saved with the map
⌨ button (bottom left)Opens this page
⌘/Ctrl + 0 · double-click the zoom percentageReset zoom to 100% and recenter on the anchor node
Resize the windowAuto-recenters the current map

Clipboard & history

⌘/Ctrl + C / X / VCopy / cut / paste the current selection (each paste offsets +20px)
⌘/Ctrl + ZUndo (up to 100 steps; each save is one step)
⌘/Ctrl + Shift + Z · Ctrl + YRedo

Other

EscapeExit the active tool or resize mode · cancel a link drag or fresh node · clear the selection
(any change)Saves automatically — to the .canvas file, or on ogof.io to this browser

Touch

A keyboard isn't required — every action below works on a touch screen.

Nodes & text

TapSelect an item
Double-tapEdit its label inline
DragMove it (and any other selected items in lockstep)
Long-press (hold ~½ s)Enter the node's submap
Drag onto the red bar at the topDelete the dragged selection

Empty canvas

DragPan the viewport
TapClear the current selection
Double-tapAdd a new node of the file's default shape at the tap point (auto-edits)
T button in the bottom barText mode: the next tap places a text label (auto-edits) instead of a node, then the bar returns to cursor mode

View

Pinch with two fingersZoom the map in / out around the point between your fingers — only the nodes scale, the buttons stay put (clamps 50% – 800%)
Drag with two fingersPan the viewport (works at any zoom level)
− / + buttons (bottom left)Zoom out / in around the screen centre
⚙ button (bottom left, beside the zoom)Map settings: default shape, theme, background grid on/off and default font, saved with the map
Double-tap the zoom percentageReset zoom to 100% and recenter on the anchor node

Connections

Tap a nodeReveals its blue handle dots
Drag a handle dot toward another nodePull a connection
(while dragging)The handle that would receive the edge lights up green
Drop on a nodeCreate / re-route the connection
Drop in empty spaceSpawn a new node at the drop point and connect to it

Editing labels

Double-tap a node / textOpen the keyboard and edit the label
Tap outside the labelCommit the change and dismiss the keyboard

Navigation

Long-press a nodeEnter its submap
Tap a breadcrumb crumb (top left)Go back to that level — the map's name is the whole map
Tap 🏠Back to all maps: ogof.io's start page, or the iPad's document browser

Other

(any change)Saves automatically — to the .canvas file, or on ogof.io to this browser
Add to home screenLaunches ogof as a full-screen standalone app