Tip: Open the app and check the Documentation button on the start screen for the full list of tips and shortcuts.
Motion Loom Storyboard is a browser-based storyboarding tool for planning animation sequences. It provides a full drawing canvas with multiple brush types, a scene and panel management system with duration and timing controls, layer support, an audio timeline, and a variety of export formats including PNG, GIF, video, and PDF.
The top bar contains the project title, undo/redo buttons, save/load controls, and export options.
The left-side vertical toolbar holds all drawing and editing tools: Select, Brush, Eraser, Line, Rectangle, Ellipse, Text, Eyedropper, Pan, Zoom, Rotate Canvas, and Camera. Click a tool or press its keyboard shortcut to activate it.
The left panel displays scene and panel management controls. It shows the list of scenes, panel thumbnails in a navigable strip, and buttons to add, delete, and reorder panels. Panel numbering and duration settings are also accessible here.
The central canvas area where you draw and compose each panel. Supports panning, zooming, and canvas rotation for comfortable drawing at any angle.
The right panel provides brush and tool settings (size, opacity, brush type, fill/stroke options), the color palette with 16 swatches, and layer management controls including visibility toggles and copy/paste between panels.
The bottom panel contains the timeline visualization, audio track controls, and per-panel dialog and action notes fields. Use it to set panel durations in MM:SS format with frame counts and to import audio files.
| Tool | Description |
|---|---|
| Select (V) | Select, move, and transform drawn elements on the canvas. Use the Direct Select tool (A) to edit individual path vertices |
| Brush (B) | Freehand drawing with configurable brush type (round or square), size, and opacity |
| Pen (P) | Draw freehand bezier paths with anchor points and curve handles |
| Eraser (E) | Erase drawn content from the canvas |
| Line (L) | Draw straight lines between two points |
| Rectangle (R) | Draw rectangles with optional fill and stroke |
| Ellipse (O) | Draw ellipses and circles with optional fill and stroke |
| Text (T) | Place and edit text on the canvas |
| Eyedropper (I) | Sample a color from the canvas |
| Pan (H) | Pan the canvas view without drawing |
| Zoom (Z) | Zoom in and out of the canvas |
| Rotate Canvas | Rotate the canvas view for comfortable drawing angles |
| Camera | Define and adjust the camera framing for the current panel |
A set of 16 color swatches is available for quick color selection. Use the Eyedropper tool (I) to sample any color directly from the canvas.
The Camera tool lets you define and adjust the camera framing for each panel. Use it to set the visible area of your composition, simulating camera pans, zooms, and crops within the storyboard layout.
| Format | Description |
|---|---|
| JSON Project | Save the full project as a JSON file for later editing |
| PNG (Current Panel) | Export the current panel as a single PNG image |
| PNG Sequence | Export all panels as a numbered PNG image sequence |
| GIF (Animated) | Export the storyboard as an animated GIF using panel durations |
| H.264 Video | Export as an H.264-encoded video file |
| PDF (Grid View) | Export a PDF with panels arranged in a grid layout |
| PDF (Single View) | Export a PDF with one panel per page |
| Key | Action |
|---|---|
| B | Brush tool |
| P | Pen tool |
| E | Eraser tool |
| V | Select tool |
| L | Line tool |
| R | Rectangle tool |
| O | Ellipse tool |
| T | Text tool |
| I | Eyedropper tool |
| H | Pan tool |
| Z | Zoom tool |
| Ctrl+Z | Undo |
| Ctrl+Y | Redo |
| Ctrl+S | Save project |
| Delete | Delete selected element |
| Ctrl+C | Copy drawing layer |
| Ctrl+V | Paste drawing layer |