Create Canvas
Rebuilding an infinite whiteboard in production code, because you can’t judge one from a static frame.
Tactile Games · Prototype → product · Interactive
Canvas is the infinite whiteboard at the heart of Tactile Create — our internal, AI-native suite that takes a game from a one-line idea through to a playable prototype. Think Miro, but wired into the way we actually make games.
I spent about three months rebuilding the invisible micro-interactions that make a whiteboard feel like a whiteboard — in production code, with Claude Code, not in Figma. Because here’s the thing about an infinite canvas: you cannot judge it from a static frame. It only exists once you can grab it.
You can’t design a canvas in frames. The prototype was the design.
Prototyping was the method
Miro spent a decade perfecting behaviours you never consciously notice. To get anywhere near that, I couldn’t mock it — I had to build it, watch people use it, and rebuild. I studied the whiteboarding market, then reconstructed the behaviours in real code so they could actually be felt and torn apart in critique.
Section membership was one of those behaviours. Moving something into a section, selecting the section itself, and absorbing an object by stretching the section around it all needed different feedback. Use the three states here to compare them.
The gap between generated and designed
The dummy whiteboard made the failure cases impossible to ignore. I could see exactly where the interactions stopped behaving like a real canvas:
- Arrow connectors overlapped objects or missed their endpoints.
- Routes changed unpredictably as connected objects moved or resized.
- The visual treatment did not consistently show what was attached.
- The pen tool amplified every input point into visible jitter.
AI can make something that looks finished in seconds. Then you move a shape and the arrow points past it, or select one and cannot tell which object is active. That gap is the work. A designer still has to use the product, find the failure states, and polish the behaviour until it feels right.
Build a connection in the AI draft, move the shapes until it breaks, then switch to Designer polish. The board stays exactly the same; only the behavioural decisions change.
The most useful design work was often behavioral rather than visual
A polished canvas depends on small decisions: where something lands, how it joins a section, how a connector routes, what happens when media fails, and which controls appear after selection.
Those details are easy to overlook, but they are what made the product feel less fragile in daily use.