Viewer & Presenter Mode

Running an AuraDeck presentation in front of an audience.

AuraDeck has two playback modes: a viewer for single-display use, and a presenter mode for dual-display setups with speaker notes.

Viewer (F5)

F5 from the editor launches a fullscreen viewer in the current window.

  • The viewer renders one slide at a time at the deck's configured aspect ratio.
  • Navigation uses the arrow keys, space, page up/down, or Home/End.
  • Escape returns to the editor.
  • F toggles between fullscreen and windowed viewer.

The viewer is just the slide HTML rendered in an iframe — every CSS animation, transition, and <script> runs as it would in any modern browser. This is intentional: animations are the most expressive thing AuraDeck offers, and the viewer should not get in the way.

Presenter Mode (F6)

Presenter mode opens two synchronised windows:

  • An audience window — fullscreen on the primary display, showing the current slide and nothing else.
  • A presenter window — showing the current slide, the next slide, your speaker notes from manifest.jsonslides[].notes, and a running elapsed-time timer.

Both windows respond to the same keyboard input, so you can advance from either one.

Presenter window layout

┌───────────────────────────┬────────────────────────┐
│                           │                        │
│   Current slide preview   │   Next slide preview   │
│                           │                        │
├───────────────────────────┴────────────────────────┤
│                                                    │
│   Speaker notes for the current slide              │
│                                                    │
├──────────────────┬─────────────────────────────────┤
│   Elapsed: 03:12 │   Suggested: 30s (overdue)      │
└──────────────────┴─────────────────────────────────┘

The "suggested" duration is read from manifest.jsonslides[].duration_seconds if you specified it, and turns red when the elapsed time exceeds that target.

Tips

  • Set aspect_ratio in manifest.json to match the projector you will be presenting on. "16:9" covers most modern projectors and TVs; "4:3" matches older equipment.
  • Use CSS animations triggered on slide load for entrance effects. Each slide has its own DOM, so animations re-run every time you navigate to that slide.
  • For complex slides with heavy JavaScript, test in the viewer before presenting — initial render time is ~50–200 ms depending on slide complexity.
  • The audience window has no chrome and no cursor (after a few seconds of inactivity) — it is safe to put on a projector.

Exporting →