# Link screens and Preview
> Link one screen to another with a drag, then play your prototype in Preview, in a tab beside your file.
Source: https://uxdeck.app/guide/link-and-preview (checked against uxdeck on 16 October 2026)
A prototype is your screens linked together: press a button on one and the next one shows. You make the links on the canvas by dragging from a layer to a frame, and you play them in **Preview**, which opens as a tab beside your file and stays live while you keep designing.
Every link is an interaction underneath, so once a link exists you can change what starts it, where it goes and how the screens change. See [Interactions](/guide/interactions) for all of that.
## Link a layer to a screen
1. Open the **Prototype** tab (⌥9).
2. Select the layer people will press, such as a button or a card.
3. Point at a side of the layer: a ring appears. Drag the ring onto the frame it should open.
The layer now goes to that frame **On click**, and a line on the canvas shows the link. A toast confirms it, for example "On click, goes to Checkout".
Select several layers first and every one of them gets the link. A whole screen can be linked too: select the frame and drag its ring onto another frame.
## What else the ring can do
Where you drop the ring decides what the link does:
- **Onto a frame:** go there on click.
- **Onto another variant** of the same component: change to it on click.
- **Onto a layer** in the same screen: scroll to it on click.
- **Hold** ⌥ **while dropping onto a layer:** this layer's motion starts when that layer comes into view.
## Edit the links on the canvas
With the Prototype tab open, the canvas draws a line for every link, overlay and swap.
- Click a line to open its interaction beside the panel.
- Drag the end of a line onto another frame to send it there.
- Press Delete to remove a selected line; ⌘Z brings it back.
- Press ⌘C on a selected line, select other layers and press ⌘V: they all get the same interaction.
## Play it in Preview
Open Preview in any of these ways:
- Press ⌥⌘↩.
- Press **Preview** in the top bar.
- Press the play button on a frame's name bar.
- Press **Preview** at the bottom of the Prototype tab.
Preview opens in a tab of its own beside your file. If your page has [flows](/guide/flows), the top bar's Preview starts where the flow of the selected screen starts, or where the page's first flow starts; without flows it starts on the selected frame.
Click through as anyone would. The arrow keys step through the page's screens in order even without links, and R starts again. Press **Done** or Esc to leave.
## Keep it live
Preview is a tab, not a copy. Change something in the file and the Preview tab shows it. If you ever doubt that it has caught up, press ⇧R to refresh it from the file.
## Shortcuts
| Action | Keys |
|---|---|
| Prototype tab | ⌥9 |
| Design tab | ⌥8 |
| Preview | ⌥⌘↩ |
| Next frame in Preview | →, Space or N |
| Previous frame | ← |
| Restart | R |
| Leave Preview | Esc |
More keys and the scaling options are in [Preview options](/guide/preview-options).
## Catches
- **A section is not a screen.** Select a frame inside it to link from it. A section with **Part of the prototype** turned off (in its Layout) keeps its frames out of Preview altogether.
- **The ring only shows in the Prototype tab.** In the Design tab, dragging a side resizes the layer.
- **A click inside a card that also has a click** runs only the inner layer's interaction.
- **Your browser may block the new tab** when uxdeck is open in a plain browser window. uxdeck then plays the prototype in place and tells you so.
Linking and Preview are on every plan.