Room (a game engine)

track: engines lab · experiment · pinned to kit v0.1.0 ← the lab

kaplay 3001.0.19 runs in the canvas below. The four lab cast characters, a desk and a vault are drawn by the kit and Rough.js into detached SVGs at load, rasterised through a canvas and handed to the engine as sprites. You are Ines: walk about, bump into the others for a line, and press E by the vault. The status line says which sprite path was used.

baking sprites…
controls: ← → ↑ ↓ or W A S D walk, E uses the vault or the desk; bump into someone for a line. Click the room first to give it the keyboard.

loading…

The baked sprites

What this taught us

  1. An engine gives, for nothing, the three things a storyboard page has to fake: input (keys, touch and a gamepad through one API, with the canvas owning the keyboard so a page's fields are left alone), a camera (one call a frame and the room is wider than the screen), and collisions (bumping into Vex is one handler on a tag). The room took fewer lines than the walk cycle's rig. Status: exploring.
  2. It costs the DOM. Everything is pixels on a canvas: no text to select or search, no <svg> to inspect or export, and the kit's drawings only get in by being baked into bitmaps first (SVG serialised, loaded as an image, drawn to a canvas, handed over as a data URL). The bake is done once at load and is cheap, but a sprite is one pose at one size: a new mood or pose is another bake, and zooming the camera shows the pixels where the SVG would stay crisp.
  3. Rasterising through a canvas was needed, not a fallback: the engine's loader takes a URL and the page must not fetch anything from a third party, so the sprite is a data: URL made by the page, and that needs the canvas step. The SVG is written with explicit width and height attributes, so the image has a size to draw at; the page avoids the blank-image failure rather than testing it. The kit's fonts do not reach the engine either; the lines are drawn in the engine's own font.
  4. For a storyboard to play inside an engine it would need three things the data does not have yet: a room (where the floor is, where people stand, what blocks them), verbs on the props (the vault's "open" is a sprite swap here, written by hand) and the lines as reactions rather than a sequence (a line is said when you bump into someone, not when the panel comes up). The storyboard's kinds of scene, with cast, props and says, map onto all three; what is missing is the geometry and the triggers, which is a new scene kind, not a change to the kit.