# Canvas and Artboard

> Write long pages with Dvina on a Canvas, lay out screens, notes and arrows on an Artboard, play a prototype, and download what you made.

A Canvas page is for long reads you write together with Dvina, like a report or a handbook. An Artboard is a bigger page for screens, photos, notes and arrows, where a flow of screens becomes a prototype you can click.

## How it works

Both open in the panel beside your chat. While one is open, what you ask in the chat is about it, so you can say "add a section on pricing" or "draw the sign-up screen," and Dvina changes it as you watch.

Everything you make is saved in your Library. Canvas pages you make are in **Docs**, and the ones Dvina writes in a chat are in **Artifacts**.

### Make one

1. Click **Add Context**.
2. Choose **Canvas** or **Artboard**. It opens in the panel, ready to work on.
3. Click its title at the top of the panel to name it.

You can also ask Dvina in the chat to make one for you. If you close a new Canvas page or Artboard with nothing on it, it isn't kept.

## Write on a Canvas page

Click the page and type. The page says **Write, or press / for blocks**.

1. Press <kbd>/</kbd> to open the block menu.
2. Choose a block: **Text**, **Heading 1**, **Heading 2**, **Heading 3**, **Bulleted list**, **Numbered list**, **To-do list**, **Code Block**, **Table**, **Blockquote** or **Callout**.

Select text to format it from the toolbar that appears over it. You can also drag a block to move it.

### Go back to an earlier version

1. In the panel, open **History**. It lists every change, newest first: Dvina's, the ones marked **Edited**, and the ones marked **Restored**.
2. Choose a change, then:
    - **Undo this change** to take back only that change of Dvina's.
    - **Go back to this version** to return the whole page to how it was then.

Either way, Dvina saves it as a new version, so nothing is lost.

## Design on an Artboard

The Artboard's tools sit in a column on its left, or in a bar at the bottom on a phone:

- **Select:** Pick and move things on the board.
- **Add:** Put a **Note**, **Text**, a **Shape**, an **Arrow**, an **Image** or a **Screen** on the board. For a screen, choose its size: **Phone**, **Tablet** or **Desktop**.
- **Layers:** See everything on the board, the topmost first, and pick one to select it. With a frame selected, its elements show too: pick one, add one, move it up or down, or remove it.
- **Properties:** Change what you selected.
- **Theme:** Set the board's own colors and **Corner radius**. Each color you leave follows the app's theme.
- **Undo** and **Redo**, **Zoom in**, **Zoom out** and **Fit to screen**.

To connect two things, drag from the edge of one to the other to draw an arrow.

### Change what you selected

Select something, then open **Properties**:

- **A note, text, shape or image:** Choose its **Color**, its **Size** (**S**, **M**, **L** or **XL**) or, for a shape, **Rectangle**, **Ellipse** or **Diamond**. For an image, add a **Description**. Choose **Bring to front** or **Send to back** to restack it.
- **An arrow:** Add a **Label**, turn on **Dashed line**, or choose **Arrowheads**: **End**, **Both** or **None**.
- **A frame:** Change its **Name**, **X**, **Y**, **Width** and **Height**. Select one of its elements to change that element too.
- **Several things:** Choose **Group** to keep them together, or **Ungroup** to take a group apart.

## Play a prototype

Link your screens, then click through them as your users will.

1. In a frame, select a button or a link and open **Properties**.
2. Under **On press**, choose where it leads: another frame, **Go back** or **Nothing**.
3. To choose the frame the prototype opens on, select that frame and, under **Prototype**, turn on **Starts here**.
4. Click **Play prototype** in the tools, then choose **Play on canvas** or **Play full screen**.

To start from a frame, click **Play from this frame** by its name. To see every link on the board, click **Show prototype links**. Full screen, the arrow keys go **Back** and **Forward**, and <kbd>Esc</kbd> stops playing.

## Download

1. In the panel, click **Share**, then **Download**.
2. Choose a format:
    - **Canvas page:** **Markdown (.md)** or **PDF (.pdf)**.
    - **A selected frame:** **PNG image**, **PDF** or **Code (TSX)**.
    - **Other things you selected:** **PNG image** or **PDF**, of just those.
    - **Whole artboard:** **PNG image**, **PDF, a page per frame**, or **PDF, one page** when the board has notes or shapes.

## Tips

- **Work on it together.** Share a Canvas page or an Artboard with **Can edit**, and you see each other's cursors and every change as it happens, Dvina's too. People with **Can view** can still play a prototype and download.
- **Bring your sources.** Ask Dvina to write from your files, your connected apps and the web, and the page links where each claim came from.
- **Start from a note.** On an empty Artboard, add a note or a screen, or ask Dvina to draw it.

## Related

- [Create](/docs/use-dvina/features/create)
- [Sharing](/docs/use-dvina/features/sharing)
- [Library and Feed](/docs/use-dvina/features/library)
- [Create](/product/create)
