# Consolidated Playback Bar

***

### **What is the Consolidated Playback Bar?**

The Video Play Bar is a **redesigned control interface** that brings all demo navigation and playback controls into a single, unified bar at the bottom of your demo viewer.

This new layout mirrors the familiar experience of video players like YouTube or Vimeo, making it instantly intuitive for viewers. All controls now live in one place and appear only when you hover at the bottom of the demo.

{% @supademo/embed demoId="cmmb04ay6019r22c47jsbr81d" url="<https://app.supademo.com/demo/cmmb04ay6019r22c47jsbr81d>" %}

***

### **How to Use the Playback Bar**

1. **Hover at the bottom** of the demo to reveal all playback controls.
2. **Play/Pause** — Control demo playback.
3. **Mute/Unmute** — Toggle audio on or off.
4. **Arrow Keys** — Navigate through demo steps.
5. **CC** — Enable or disable subtitles.
6. **Language Icon** — Switch between available subtitle languages.
7. **Full-Screen** — Expand the demo for an immersive viewing experience.

> 💡 **Tip:** The playback bar automatically hides when not in use, keeping your demo content front and center.

***

### **Benefits**

* **Distraction-free viewing** — Viewers can focus entirely on the demo content.
* **Familiar UX pattern** — The video player-style bar is instantly recognizable.
* **Cleaner aesthetics** — A unified control bar creates a polished, professional appearance.
* **On-demand controls** — Controls appear only when needed via hover.
* **Improved accessibility** — All controls in one easy-to-find location.

***

### **Use Cases**

<details>

<summary><strong>Marketing and Website Embeds</strong></summary>

Embedding demos on landing pages or marketing sites? The consolidated playback bar keeps your demos visually clean and on-brand. Controls stay hidden until needed, letting your product take center stage.

</details>

<details>

<summary><strong>Sales Demo Leave-Behinds</strong></summary>

Share demos with prospects that feel polished and professional. The familiar video player interface makes it easy for anyone to navigate, replay, and share internally — no learning curve required.

</details>

<details>

<summary><strong>Customer Onboarding</strong></summary>

Help new users focus on learning your product, not figuring out demo controls. The intuitive playback bar reduces friction and lets viewers concentrate on what matters — the content.

</details>

<details>

<summary><strong>Live Presentations</strong></summary>

Running a demo for stakeholders or executives? Full-screen mode with hidden controls delivers a clean, presentation-ready experience that looks polished and professional.

</details>

***

> ✨ **The Result:** A viewing experience that puts your product first and controls second — exactly how it should be.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.supademo.com/customize/settings/consolidated-playback-bar.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
