# Present in a device

> Show your prototype inside a phone, tablet or browser mockup, choose the colour around it, and play it full screen on a phone.

Source: https://uxdeck.app/guide/present (checked against uxdeck on 16 October 2026)

When you present a prototype, it plays inside a mockup: a phone for a phone screen, a browser window for a desktop page. You choose the mockup and the colour around it once per page, and every screen on it uses them. On a real phone, the prototype fills the screen like an app.

## Choose the mockup

1. Click an empty spot on the canvas so nothing is selected.
2. Open the **Prototype** tab. The **Present** section is at the top.
3. Choose the **Mockup**:

| Mockup | What it shows |
|---|---|
| **Automatic** (default) | Each frame in what suits it: the matching phone or tablet when it was made from a size preset, otherwise a phone up to 480 wide, a tablet up to 1,100, and a browser window above that. |
| **Browser** | A browser window. |
| **Phone** | A phone. |
| **Tablet** | A tablet. |
| **None** | The screen alone. |

The icon in the field shows what Automatic chose.

4. Choose the colour around it in the second field: **Black** (default), **Graphite**, **Light grey** or **White**.

Press the play button in the **Present** section, or <kbd>⌥</kbd><kbd>⌘</kbd><kbd>↩</kbd>, to present.

## Present

Presenting opens Preview in a tab beside your file, scaled to fit your window, mockup and all. In Preview:

- **Options**, then **Show device frame**, hides or shows the mockup for you.
- **Options**, then **Hide UI**, removes the bar and the footer for a clean screen. Move the pointer to bring back **Show UI**.
- <kbd>F</kbd> goes full screen.
- **Responsive** scaling drops the mockup and fills the window, so you can resize it and watch your breakpoints switch.

All the options are in [Preview options](/guide/preview-options).

## Share it

Each [flow](/guide/flows) has **Copy link**, which plays that journey. Whoever opens it needs access to the file; see [Share a file](/guide/share). The bar in Preview shows who else is watching.

## Play it on a phone

Open the file in uxdeck on your phone and press **Play prototype**. The prototype fills the screen: no mockup, no bar.

- A **pager** with the previous and next screen shows for a moment as it opens, on each new screen, and when a tap lands on nothing.
- A desktop design shows in its own shape while the phone is upright; turn the phone and it fills the screen.
- **Press and hold with two fingers** for the menu: **Flows**, **Screens**, **Restart**, **Hotspot hints** (a tap that misses outlines what can be tapped), **Share prototype**, **View file** and **Go to Home**.

A tip explains the two-finger hold the first time.

## Catches

- **The mockup is set per page**, not per frame. Automatic is how a page with phone and desktop screens gets the right one for each.
- **The mockup is for presenting only.** It never appears in your published site or exports.
- **On a phone, uxdeck does not edit.** Tablets 768 wide and up get the full editor.
- **Hover does not exist on a touch screen.** Prototypes that rely on While hovering need a click as well to work on a phone.

Presenting is on every plan.