Skip to content
Preview on your screens

Docs contents

Design a dashboard

Preview a dashboard on your screens

See a dashboard as each of your screens will draw it, check it reads well from where people stand, and try it on a real screen.

You’ll have

A dashboard checked at your screens’ own sizes, with any block too small to read from across the room marked, and a 30-second try on a real screen.

You’ll need

Follow these steps in your own Denframe. This website never connects to your household, your accounts or your devices, and never asks for your credentials.

  1. Choose the screen to preview on

    The list at the left of the bar above the picture is Preview on. It names the screen and its size. Your own screens are under Your screens, an offline one marked as such, and common shapes under Other sizes, from a TV at 1080p or 720p to portrait panels, tablets and a 4K wall display.

    Choose one and the picture redraws as that screen would show it, with its own overscan and its own arrangement: a portrait screen uses the portrait grid.

  2. Check it can be read from across the room

    The Readability chip in the bar gives the dashboard’s reading size on that screen and how many blocks read smaller than they should, for example Readability · 32px · 2 small.

    Press it to tint every block that reads too small, with the size it reads at and the size it should, in millimetres. A block below the smallest readable size is tinted more strongly. The finding is written beside the chip, and counts how many blocks are below that size.

    The check uses the screen’s measured size and how far away it is read: the distance saved on the screen, or the usual one for its kind. On a shape from Other sizes, or a screen with no measured size, pressing the chip says why it can’t look.

    The overlay is a way of looking and is never saved. It is off each time you open the editor.

  3. See the screen’s edges

    Hover over or focus Edge space in the Spacing & surface group. The picture hatches the screen’s overscan, naming where it comes from, and draws the dashboard’s edge space inside it.

    Overscan is the screen’s and is set in its own settings; edge space is the dashboard’s. See Keep a screen looking right.

  4. Open the full-screen preview

    Choose ↗ Full screen. The preview keeps the Preview on list in its bar, so you can switch screens without leaving, and adds a Size choice:

    SizeWhat it shows
    Fit the boxThe dashboard fitted to your window. The sizes in it are not real.
    True sizeThe dashboard as large as it is on that screen’s glass.
    As read from thereThe size the dashboard appears from where it is usually read, compared with where you sit.

    The two real sizes need your screen measured and your own display measured too. Choose Measure this display, hold a bank card against your monitor, resize the rectangle until it matches, and choose It matches.

    The line under the picture always says whether the size is measured, estimated or unknown, and when a wall larger than your window is cropped to its middle. Press F for your browser’s full screen, and Escape or the close button to leave.

    Your display’s measurement stays in this browser only. Zooming the page or moving the window to another monitor discards it, and Forget removes it. As read from there only scales the picture; it does not blur it or imitate anyone’s eyesight.

  5. Try it on a real screen

    The button at the top right says where the dashboard is: Show on screen while it is on none, the screens it is live on, sent to or rotating on, or that it is a draft. Press it to list your screens. Each row says what that screen shows now and offers Show, Try 30 s, Stop, and Add to rotation or Remove from rotation. Manage rotations → opens the rotations themselves.

    Try 30 s shows the dashboard on that screen for 30 seconds, then the screen goes back to what it was showing.

    A try appears on a real screen in your home. Check that nobody is using it. A draft dashboard says so at the top of the list: screens keep the version last applied until you choose Apply layout.

  6. Check it worked

    The picture matches what the screen showed during the try, and the Readability chip shows no small blocks on that screen. If it lists some, give those blocks larger cells: see Add and arrange blocks.

If it doesn’t work

My screen is not under Your screens

A screen is listed once it has connected and reported its size. Turn it on, or connect it first: see Chromecast, Google TV and Nest Hub.

Pressing Readability only shows a message

The chosen preview is a shape, not one of your screens, or your screen has no measured size yet. Measure it in its settings: see Keep a screen looking right.

True size says it needs measuring

Measure your own display with Measure this display, and make sure the chosen screen has a measured size.

True size stopped after zooming

Zooming or moving the window to another monitor discards the measurement. Measure this display again.

A try did not appear on the screen

Check the screen is on and online in the list, and that Denframe can reach it. See Troubleshooting and FAQ.

Related guides