The infinite canvas

The canvas is the main stage of Sumi Studio: a whiteboard you can pan and zoom without limit. Nodes sit on it, and links between nodes show how data flows. This chapter walks you through the canvas interface and how to move, zoom and pan.

The canvas interface

Once you open a canvas (/canvas/your-canvas-ID), the interface has a few parts:

• Top bar: on the left, the canvas title (double-click to rename; a single click opens a menu with Back to home, Project assets, Share, Publish, Version history, New canvas and Delete canvas), the save status (Saved, Saving, Unsaved and so on) and the project it belongs to; on the right, Assets (opens the asset library), Share (its menu has Publish to community and Share via link, plus Invite to collaborate on team canvases), the appearance toggle, your credit balance and your avatar. Team canvases also show an "N online" badge at the top center;
• The canvas body: an endlessly pannable, zoomable whiteboard where nodes sit and links show data flow;
• The vertical toolbar on the left: from top to bottom, Add, Canvas Elements, Assets, Templates (official templates + workflows you saved), Sticky note and Comments, then Shortcuts (opens the cheat sheet) and Help; on narrow screens these collapse into a More menu.

Quick-start cards

A new empty canvas shows a "Double-click the canvas / to add a node" hint in the middle, plus three quick-start cards — Character views, Image to video and Audio to video. Click any one to insert a ready-made set of sample nodes and links, as a template for learning or getting started.

Move, zoom and pan

• Marquee / hand: press V for marquee mode (drag a box to select nodes in bulk), press H for hand mode (drag the canvas itself); press P for pen annotations;
• Zoom: pinch on a trackpad, or hold ⌘/Ctrl and scroll; you can also use ⌘/Ctrl + = to zoom in and ⌘/Ctrl + - to zoom out;
• Fit view: ⌘/Ctrl + 0 or ⇧1 zooms and centers the canvas so everything is visible;
• Pan: hold Space and drag, or drag with the middle or right mouse button.

Version history

Click the canvas title and choose Version history to preview earlier saved versions of the canvas and restore one when you need it.