IEBPROJECT CASE STUDY
25 / 47
CT 00:00:00 T+00:00
Velm's board library window showing a grid of board thumbnails with names and item counts, and a folder sidebar

Systems & graphics engineeringSolo designer and engineerDrawing 25 of 47

Velm

I built a native infinite-canvas app in Rust so I could stop using Miro on my own machines. The main rule I built it around is that drawing a frame should only cost as much as what's on screen, no matter how much is on the board.

Sheet 02 of 05/Why

Why I stopped using Miro

Miro had become the slowest thing on my computer. What bothered me was that it got slower the more there was on the board, even when I was only looking at part of it.

The same 100,000 item board zoomed far out into a dense confetti field, HUD reading 87687 of 100000 visible
PL 04The same board zoomed out to 4 percent, where culling has nothing left to remove. There are 87,687 items on screen, and drawing them uses up the frame budget.
A research board about mechanical keyboards, mixing product photographs, yellow sticky notes and CAD drawings
PL 05One of my own boards that I use every day. The photographs, stickies, notes and drawings on it all came across from Miro in the import.

Sheet 03 of 05/Parts

Issued as separate drawings

I split this project into parts. Each part below has its own page, with its own sections and pictures.

Sheet 04 of 05/Scope

Two things I cut on purpose

Collaboration is gone completely and there's no dark mode yet. Other than that it's a real tool, with 41 shapes, mind maps and charts you can drop right on the board.

A grid of around forty outlined vector shapes including arrows, cylinders, callouts and flowchart symbols
PL 06Every shape the app can draw, laid out at once: rounded rectangles, polygons, callouts and the flowchart set. They're all drawn as signed-distance fields, with no tessellated meshes.
Several mind map diagrams with a central node branching out to labelled child nodes
PL 08Mind maps lay themselves out with a tidy-tree pass. When you add a branch, the siblings move to make room so nothing overlaps.
Four charts on the canvas: a bar chart, a line chart, an area chart and a donut chart
PL 09Charts, tables, kanban and timeline views are built in, so you don't have to go back to another app for structured data.
A Velm board with yellow and green sticky notes on the left, a box labelled Miro board connected to a cylinder labelled Velm board, a green hand-drawn tick and a red ellipse reading 100 fps
PL 10A demo board with three sticky notes, two shapes joined by a connector, a line of text and a pen stroke tick.
Two kanban boards titled Sprint and Sprint over limit, each with To do, Doing and Done columns of white cards
PL 11Two kanban boards. The second one has three cards in Doing against a limit of two, and the column header reads 3/2.
A table with Item, Qty and Note headers and two rows, with its left edge partly behind the toolbar
PL 12A table on the board. The Note column widens to fit its longest cell.
Link cards on the canvas for a GitHub repo, a forum page and a YouTube video, with the video card selected and a small toolbar above it
PL 13Pasting a link makes a card. The selected YouTube card can switch between row, card and large views.
Four yellow sticky notes in a row labelled 0, 1, 2 and drag me, with the last one selected and faint guide lines along the row
PL 14Dragging a sticky note snaps it into line with the others in the row.

Sheet 05 of 05/Source

Inspect the work