Player Window Designer

What is the Player Window?

The player window (also called the live window) is the full-screen display players watch during the game. It shows:

• The countdown timer

• Clue messages you send from the console

• Available clue icons

• Your logo and branding

• Welcome, victory, and fail screens

You design all of this in advance. During a game, the console controls what appears — the designer controls how it looks.

Getting to the Designer

1. Open your room’s Gamemaster Console

2. In the left sidebar, click Player Window Designer (paintbrush icon)

3. You’ll see a live preview of the player screen and a settings panel on the right

Tip: Use a desktop or laptop for designing. The designer works best on a larger screen.

If you leave the designer without saving, your changes will be lost. The sidebar will warn you before navigating away.

Designer Layout

The designer has three main areas:

At the top right you’ll also find:

• Save Changes — saves your design to the room (lights up when you have unsaved edits)

• Share — copy the player window link to preview it in a browser or open it on your display

The Five Screens

Each tab represents a different state of the player window. Design them separately — they can all look different.

Welcome Screen

Shown before the game starts, if you turn it on.

• Toggle “Show Welcome Screen before game starts” at the top of the preview

• Add welcome text (use {game_name} to automatically insert your room name)

• Optionally show your logo and clue icons

• Add extra text blocks for rules, safety briefings, or themed intro copy

If the welcome screen is disabled, the tab is labeled “Welcome Screen (disabled)” and players go straight to the timer when the game starts.

Timer Screen

The main gameplay view — the big countdown players see during the game.

Typical elements:

• Timer — the countdown clock

• Logo — your escape room or game logo

• Clue icons — the row of hint slots (lock icons) at the bottom

Message Screen

How the display looks when you send a clue or message to the team.

This screen layers a message over the timer view. You can show or hide the timer, logo, clue icons, and the message box independently.

The preview text comes from the first text clue in your puzzles — add at least one text clue in the console if you want a realistic preview.

Victory Screen

Shown when the team completes the game successfully.

Customize the congratulatory title and message, background, fonts, and optionally show the completion timer and your logo.

Fail Screen

Shown when time runs out before the team escapes.

Customize the “time’s up” title and message, background, and styling. You can also show a progress indicator for how far the team got.

Working with Widgets

“Widgets” are the pieces on each screen — timer, logo, clue icons, messages, etc.

Show or hide widgets

Above the preview, click the toggle pills (e.g. Show Timer, Show Logo, Show Clue Icons). A checkmark means that widget is visible on that screen.

Each screen has its own widget visibility — hiding the timer on the Message screen doesn’t hide it on the Timer screen.

Select a widget

Click any widget in the preview. It gets a blue border, and its settings appear in the right panel.

Click the same widget again to deselect it.

Move a widget

Click and drag a widget to reposition it on the screen. Alignment guides appear while dragging to help you center elements.

You can also fine-tune position in the settings panel using X/Y sliders or Quick Snap buttons (Center, Left, Right, Top, Bottom).

Edit the background

Click anywhere on the empty background of the preview (not on a widget). Background settings appear in the right panel.

Customization Options

Timer

• Font size — how large the countdown appears

• Color — timer text color

• Opacity — fade the timer in or out

• Font — choose from popular Google Fonts

Timer settings can differ per screen (e.g. smaller timer on the Message screen, red timer on the Fail screen).

Logo

• Upload an image or paste an image URL

• Size — 20px to 200px

• Opacity — make the logo subtle or bold

The same logo is used across screens unless you hide it on a specific screen.

Clue Icons

Customize the hint slots players see:

• Icon — choose from built-in icons (key, lightbulb, lock, skull, etc.)

• Custom icon — upload your own image

• Icon color — color of the icon itself

• Background color & opacity — the circle behind each icon

These icons reflect your Clues Available settings from the console during gameplay.

Message (clue overlay)

When a clue is sent, style how the text appears:

• Font, size, and color

• Background color and opacity

• Background blur — frosted-glass effect behind the text

The actual clue content comes from what you send during the game — the designer only controls the styling.

Victory & Fail messages

• Title and message text — write your own copy (e.g. “Congratulations!” / “Time’s Up!”)

• Title and message font sizes

• Font families for title and body separately

• Text color

• Message box background color and opacity

Welcome text

• Welcome message — multi-line text; use {game_name} for your room name

• Font, size, and color

• Custom text blocks — add extra text areas (rules, warnings, story intro) and position each one independently

Backgrounds

Each screen type has its own background settings.

Background options

For video backgrounds on Welcome, Victory, and Fail screens, you can also set:

• Loop video — repeat continuously

• Mute video — play without sound

Tips for backgrounds:

• Dark backgrounds with light text usually read best on a TV

• Lower opacity (50–70%) on a background image keeps the timer readable

• Test on the actual display you’ll use in the room — colors look different on a big screen

Saving & Previewing

Save your work

1. Make your changes in the designer

2. Click Save Changes (top right)

3. Wait for the save to complete — the button returns to inactive when done

Changes are not live until you save. The player window during an active game uses the last saved design.

Preview on a real display

1. Click Share (top right)

2. Copy the player window link

3. Open it in a browser on your room TV, or use Open Player Window from the main console

This is exactly what players will see. Resize the browser to full screen for the best preview.

How Screens Switch During a Game

You don’t manually switch screens during gameplay — the app does it automatically:

Design each of these in the designer so every moment of the player experience matches your room’s theme.

Recommended Workflow

1. Start with the Timer screen — get your timer, logo, and clue icons looking right

2. Design the Message screen — make sure clues are readable over your background

3. Set up Welcome (optional) — intro text and branding before the clock starts

4. Customize Victory and Fail — match your room’s tone (celebratory vs. spooky, etc.)

5. Save Changes

6. Preview on your actual display using the Share link

7. Run a test game from the console to see everything switch in real time

Common Questions

Do I need to redesign for every game?
No. Once saved, your design stays with the room. You only need to update it when you want a new look.

Does the designer affect games already in progress?
Saved changes apply the next time the player window loads. For a clean test, refresh the player window after saving.

Why doesn’t my message preview show my clue text?
The Message screen preview uses your first text clue from the puzzle list. Add a text clue in the console to see a realistic preview.

Can I use different backgrounds for different screens?
Yes. Welcome, Timer, Message, Victory, and Fail each have their own background settings.

What aspect ratio should I design for?
The preview is 16:9 (widescreen TV format). Design with that in mind — most room TVs are widescreen.