The video player control bar gives viewers control over their viewing experience, including volume, playback speed, and display options.
Control Bar
The control bar appears at the bottom of the player and includes:
- Volume controls
- TTS (Text-to-Speech) speed
- Fullscreen toggle
- Feedback button
- Timer display
Volume Controls
Adjusting Volume
- Volume slider - Drag to adjust volume level (0-100%)
- Mute button - Click to toggle mute on/off
- Visual indicator - Icon changes based on volume level
Volume States
| Icon | State |
|---|---|
| Speaker with waves | Normal volume |
| Speaker with one wave | Low volume |
| Speaker with X | Muted |
TTS Speed Control
Viewers can adjust how fast the AI avatar speaks:
| Speed | Description |
|---|---|
| 0.7x | Slow - easier to follow complex content |
| 0.8x | Slightly slower than normal |
| 0.9x | Just below normal speed |
| 1.0x | Normal speed (default) |
| 1.1x | Slightly faster |
| 1.2x | Fast - for quick review |
Changing Speed
- Click the Speed button in the control bar
- Select desired speed from the dropdown
- Change takes effect immediately
Speed preference is saved and persists across sessions.
Fullscreen Mode
Entering Fullscreen
- Click the Fullscreen button (expand icon)
- Press F11 on keyboard (browser fullscreen)
Exiting Fullscreen
- Click the Exit Fullscreen button (minimize icon)
- Press Escape key
- Press F11 again
Fullscreen Behavior
In fullscreen mode:
- Player fills the entire screen
- Control bar repositions appropriately
- Avatar sizing adjusts for larger display
- All interactive features remain available
Timer Display
The control bar shows timing information:
- Elapsed time - How long the current session has been active
- Chapter duration - Time spent on current chapter
- Completion status - Shows "Completed" when session ends
Format: MM:SS
Microphone Controls
For interactive sessions:
Mute/Unmute
- Click the Microphone button to toggle
- Visual indicator shows current state
- Muted mic shows with a line through it
Device Selection
If multiple microphones are available:
- Click the microphone dropdown arrow
- Select preferred device from list
- Selection is saved for future sessions
Camera Controls
For video-enabled sessions:
Enable/Disable Camera
- Click the Camera button to toggle video
- Visual indicator shows when camera is active
Device Selection
- Click the camera dropdown arrow
- Select preferred camera from list
- Preview shows selected camera feed
Feedback Button
Quick access to provide feedback:
- Click the Feedback button
- Modal opens with text area
- Type your feedback
- Click Submit
Feedback includes context about:
- Current video and chapter
- Session information
- Viewer details (if available)
Keyboard Shortcuts
| Key | Action |
|---|---|
| Space | Play/Pause |
| M | Mute/Unmute |
| F | Toggle fullscreen |
| ← | Previous chapter |
| → | Next chapter |
| Esc | Exit fullscreen / Close modal |
Mobile Controls
On mobile devices:
- Controls adapt to touch interface
- Tap to show/hide control bar
- Swipe gestures for navigation (if enabled)
- Volume controlled by device buttons