This content originally appeared on SitePoint and was authored by Michiel Mulders
This article explores different video player controls, their purpose, and which controls to pick for specific use cases such as learning platforms, social media platforms, power users, or mobile users. Did you know how many cool power-user controls YouTube has? Read on!
An engaging video player can attract more viewers. Modern video players can offer vastly more controls than the simple play–pause buttons of the early days.
Take a look at YouTube nowadays. Users can navigate video segments using YouTube’s chapter functionality. This feature helps users quickly search videos for a segment that’s relevant for them.
How often have you watched a video, hoping to find specific information, only to discover that it doesn’t answer your particular question? It’s frustrating!
Savvy YouTubers worked out a temporary solution to this. They found it helpful to list the different segments together with timestamps in the description of the video. This solution still meant that you had to open up the description to scan for your specific question. On top of that, it just wasn’t easy for Google to index videos that handle different questions about a particular topic.
Video player user experience encompasses so much more than adding chapters. A video player for an online learning platform demands different controls than a YouTube video or a simple teaser video on a product website.
Why Does UX for Video Players Matter?
Take a video platform like YouTube. Users consume content in various ways. Let’s explore how three different personas use YouTube:
- Alice uses YouTube to look up educational information quickly. She uses the chapter functionality to scan for relevant sections. She also uses the arrow keys to quickly skip through segments in small incremental steps to find the information she needs.
- Ben loves watching gaming videos. He’s a traditional power user who uses shortcuts such as F to enter full screen, M to mute, or the spacebar to pause the video.
- Alex loves studying with background music. He uses the YouTube autoplay functionality, so he doesn’t need to worry about selecting appropriate study music. He often selects some background music and trusts the YouTube algorithm to select similar music when a video finishes.
The above scenarios illustrate that a video platform hosts many different users who use it in various ways. Therefore, it’s challenging to pick the right controls and shortcuts to provide the best experience for all users.
So, which video player controls can we find?
Which Video Player Controls Exist?
Many different video player controls exist. This list summarizes the controls you most often find:
- Play/Pause button.
- Skip to next video.
- Adjust volume.
- Toggle for subtitles.
- Adjust screen size (mini player, theater modus, or full-screen modus). Most often, you’ll find a button to enter full-screen mode. YouTube, however, allows you to enter a theater modus that adjusts the video size to the size of your screen. They also offer a mini player so you can navigate YouTube while watching the video using a small video player.
- Change video quality. Not everyone has an excellent internet connection. Therefore, allow users to adjust the quality. Make sure to provide an option to adjust the video quality automatically. For users with an unstable internet connection, the video player can automatically adjust the video quality depending on the connection speed. Most users prefer reduced quality to continue watching the video without interruptions.
Less common controls include the following:
- Adjust video player speed. This control allows you to slow down or speed up the video. You can most commonly adjust the video player speed in steps of 25% between a range of 0.25 and 2.
- Toggle to enable autoplay functionality. Useful for listening to music or you prefer the content algorithm to decide what you watch next.
- Rewind and fast-forward. Although useful, this control is mostly hidden. For example, YouTube only allows you to use this control using keyboard shortcuts. Few video players implement this functionality as part of their default video controls.
- Settings. YouTube implements a gear icon as part of their default set of controls. However, YouTube’s video player is complex. They use the settings control to hide other video controls that are infrequently used.
Lastly, we shouldn’t forget how we display the current timestamp and the video length. The most straightforward solution is first to show the current video timestamp, followed by the total video length. In this example, we’ve paused the video at 40 seconds with a total video length of two minutes and 13 seconds — “0:40 / 2:13”. On the other hand, some video players show the remaining length of the video. Don’t do this, as it’s confusing for the user.
The next section takes a look at common and more experimental keyboard shortcuts to navigate a video player.
Continue reading How to Design Your Video Player with UX in Mind on SitePoint.
This content originally appeared on SitePoint and was authored by Michiel Mulders
Michiel Mulders | Sciencx (2021-01-20T14:00:54+00:00) How to Design Your Video Player with UX in Mind. Retrieved from https://www.scien.cx/2021/01/20/how-to-design-your-video-player-with-ux-in-mind/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.