Start a Design file

Open Design Canvas in Personal or the team where the work belongs. Start a Design, at the top of the Design files page, shows layouts grouped by purpose, with a preview of each one. Choose a layout to create an editable file, or choose Blank Design for an empty file (see Start a Design from a starter). Import JSON creates a file from a structured layout definition (see Create a Design from JSON). The blank file opens on the Frame tool, and the Inspector lists common Frame sizes such as Phone, Tablet, Desktop and Slide. Choose one to add a Frame in view beside what is already there, or to the right of the existing Frames when there is no room, or drag on the canvas to draw a Frame of any size. Team permissions apply to the file, and a directly invited Editor can work on only this file without joining the team.

The mobile app can search Design files, show active and Archived files, create a blank file or choose a starter layout, review and add comments or replies, resolve comments, duplicate a file, archive or restore it, and move it to Trash. It also supports collaborator access, version history, Branches, Libraries, Prototype Flows, and SVG export from the file's action menu. In the editor, the Layers panel can add a Page and select Layers; the app's editor can add Text, Rectangle Layers, or a 390 × 844 Phone Frame and change a Layer's name, text, position, size, and solid fill. The Prototype panel can create a Flow from a Frame, and team admins can publish or connect shared Libraries. Prototype playback and most canvas and Inspector tools are not in the app.

Choose Edit Design in the mobile app to open a Page. Select a Layer on the canvas or from the Layers list. The editing menu adds Text, Rectangle and Phone Frame Layers. The Selected Layer controls change its name, text, position, size and solid fill colour. Choose Apply changes to save those edits.

Each top-level Frame shows its name above its top-left corner. Click the name to select the Frame, or drag the name to move it. Dragging on the Frame's background draws a selection box around the Layers inside it. When a file opens, its Frames fit in the canvas view with a margin at the top and left. This also applies to Designs created from JSON and starters.

Add Pages from the Pages panel to separate work such as Wireframes, Desktop, Mobile, and Components. Pages share the file's Components, Styles, and Variables but keep their own Layers, guides, and canvas positions. Select nothing to see the Page in the Inspector: rename it, change its canvas colour, or choose Duplicate Page or Delete Page. Right-click a Page in the list for the same commands. A duplicated Page gets new Layers; its main Components become Frames so each Component keeps one source. Undo brings back a deleted Page while the file is open, and Versions keep earlier copies.

The status bar describes what the selected tool expects next. A selected Layer is marked in the Layers panel and named in the status bar.

Scroll or use a trackpad to pan. Hold Space and drag for the Hand tool. Use Cmd/Ctrl with the wheel, the zoom controls, or + and − to zoom. Press Shift+1 to fit the Page, Shift+2 to fit the selection, and Shift+0 for 100%. Press Shift+R to show rulers. Drag from the top ruler to add a horizontal guide or from the side ruler to add a vertical guide. Drag a guide to move it, or back onto its ruler to remove it. Layers snap to guides.

On a narrow screen, the Layers and Inspector buttons in the toolbar open those panels over the canvas.

Changes save automatically. Saving, Saved, Offline, or Save failed reports the state of durable persistence; there is no Save button.

The Design files list, below the layouts, shows the files in Personal or the selected team with a small preview of each first Page; View Design files at the top jumps to it. Archived lists archived files, Search Design files finds a file by name, and Shared with me lists files you were invited to from another team. In a file, More, the last button in the page bar, holds the actions on the whole file. More → Duplicate makes a copy in the selected Personal or team context and opens it, and More → Archive Design moves the file to Archived. Open an archived file and choose More → Restore Design to return it. More → Move to Trash, on any file, moves it to Trash, where it can be restored for 30 days; its prototype links show a not found page while it is in Trash, and work again if it is restored. A file that publishes a Library enabled in another file stays until the Library is disabled there.

To move a file created in the wrong team, choose More → Move to another team in the website editor or Move to another team in the mobile app's file menu. Save pending changes first. Pages, versions, branches, comments, prototype links and direct collaborators stay with the file. A file connected to a team Library cannot be moved.

If a file does not reopen with its latest saved content, Contact support.