Login

Practical examples for player UI

FastPix Player adapts its user interface (UI) to deliver the best possible experience based on container size, stream type, and available features. This guide provides practical examples of how FastPix Player configures its UI in different scenarios.


Single player in a large container

When FastPix Player is embedded in a large container, it displays the full set of controls to enhance the viewer's interaction and experience. This ensures all necessary features are readily available.


Example controls:

  • Play/Pause button
  • Seek bar with thumbnails
  • Volume control
  • Subtitles button (if present)
  • Fullscreen toggle
  • Playback speed control
  • Picture-in-picture mode
  • Forward-seek offset
  • Backward-seek offset
  • Audio track switching (if audio tracks are present)
  • Live indicator (for live streams)

On-demand: For on-demand content, the player provides access to all standard controls, enabling users to navigate and interact with the video as needed.

On-demand


Live stream: For live streams, the player includes live-specific elements such as the live indicator, minimal seek functionality, and real-time interaction controls.



Single player in a medium container

In a medium-sized container, FastPix Player condenses its control bar to maintain a balanced layout. Essential functions remain accessible, while the UI avoids overcrowding.


Example controls:

  • Play/Pause button
  • Simplified seek bar
  • Volume control
  • Subtitles button (if enabled)
  • Fullscreen toggle
  • Live indicator (for live streams)

On-demand: The player displays a refined control set that supports basic navigation while prioritizing usability.


On-demand


Live stream: The player maintains essential live streaming controls such as the live indicator but may limit some secondary features for simplicity.

Live stream


If audio tracks are present: The player includes an option to switch audio tracks if applicable.

Audio tracks are present


If only subtitles are present: The subtitles button will appear, enabling subtitle control.

Only subtitles are present


If both audio and subtitle tracks are present: The UI will adapt to include both audio switching and subtitle options as needed.

both audio and subtitle tracks are present


Single player in a small container

For small containers, FastPix Player prioritizes core functionality to fit within limited space. The control bar is simplified to essential features for efficient operation.

Example controls:

  • Play/Pause button
  • Basic seek functionality
  • Volume control (icon-based)
  • Fullscreen toggle
  • Live indicator (for live streams)

On-demand player in a small viewport: The control bar will feature only the most necessary functions to maintain a smooth user experience.


Live stream player in a small viewport: The player adapts to include basic live stream controls, ensuring real-time playback with minimal controls.

Live stream player in a small viewport

d

If audio tracks are present: A compact control for audio switching may be included if space allows.

Audio tracks are present


If only subtitles are present: The subtitles button will appear, enabling users to toggle subtitles.


If both audio and subtitle tracks are present: The UI will adjust to accommodate these options within the available space.


Multiple players in a large viewport

When multiple FastPix Players are embedded within a large viewport, each player will adjust its UI based on its container size maintaining usability and functionality without being influenced by the overall viewport size.

The responsiveness of each player is independent, meaning smaller players within a large viewport will maintain a minimalist control bar, while larger players will display a more comprehensive set of controls.




FastPix Player's responsive design ensures that regardless of the stream type, enabled features, or container size, the UI remains intuitive and functional. By understanding how these factors influence the player’s UI adaptation, you can design and implement FastPix Player in various scenarios to provide the best possible viewing experience.