Connect with us


The way to Design Your Video Participant with UX in Thoughts – SitePoint

This text explores completely different video participant controls, their function, and which controls to choose for particular use circumstances similar to studying platforms, social media platforms, energy customers, or cell customers. Did you understand how many cool power-user controls YouTube has? Learn on!

An enticing video participant can appeal to extra viewers. Trendy video gamers can supply vastly extra controls than the easy play–pause buttons of the early days.

Check out YouTube these days. Customers can navigate video segments utilizing YouTube’s chapter performance. This function helps customers shortly search movies for a phase that’s related for them.

How usually have you ever watched a video, hoping to search out particular data, solely to find that it doesn’t reply your explicit query? It’s irritating!

Savvy YouTubers labored out a short lived resolution to this. They discovered it useful to checklist the completely different segments along with timestamps within the description of the video. This resolution nonetheless meant that you simply needed to open up the outline to scan on your particular query. On prime of that, it simply wasn’t straightforward for Google to index movies that deal with completely different questions on a specific subject.

Video participant consumer expertise encompasses a lot greater than including chapters. A video participant for a web-based studying platform calls for completely different controls than a YouTube video or a easy teaser video on a product web site.

Why Does UX for Video Gamers Matter?

Take a video platform like YouTube. Customers devour content material in varied methods. Let’s discover how three completely different personas use YouTube:

  1. Alice makes use of YouTube to search for academic data shortly. She makes use of the chapter performance to scan for related sections. She additionally makes use of the arrow keys to shortly skip by way of segments in small incremental steps to search out the knowledge she wants.
  2. Ben loves watching gaming movies. He’s a standard energy consumer who makes use of shortcuts similar to F to enter full display screen, M to mute, or the spacebar to pause the video.
  3. Alex loves finding out with background music. He makes use of the YouTube autoplay performance, so he doesn’t want to fret about choosing applicable research music. He usually selects some background music and trusts the YouTube algorithm to pick out comparable music when a video finishes.

The above eventualities illustrate {that a} video platform hosts many various customers who use it in varied methods. Due to this fact, it’s difficult to choose the fitting controls and shortcuts to offer the most effective expertise for all customers.

So, which video participant controls can we discover?

Which Video Participant Controls Exist?

Many various video participant controls exist. This checklist summarizes the controls you most frequently discover:

  • Play/Pause button.
  • Skip to subsequent video.
  • Modify quantity.
  • Toggle for subtitles.
  • Modify display screen dimension (mini participant, theater modus, or full-screen modus). Most frequently, you’ll discover a button to enter full-screen mode. YouTube, nonetheless, permits you to enter a theater modus that adjusts the video dimension to the dimensions of your display screen. Additionally they supply a mini participant so you may navigate YouTube whereas watching the video utilizing a small video participant.
  • Change video high quality. Not everybody has a wonderful web connection. Due to this fact, permit customers to regulate the standard. Make certain to offer an choice to regulate the video high quality routinely. For customers with an unstable web connection, the video participant can routinely regulate the video high quality relying on the connection pace. Most customers choose decreased high quality to proceed watching the video with out interruptions.

Much less widespread controls embrace the next:

  • Modify video participant pace. This management permits you to decelerate or pace up the video. You possibly can mostly regulate the video participant pace in steps of 25% between a variety of 0.25 and a pair of.
  • Toggle to allow autoplay performance. Helpful for listening to music otherwise you choose the content material algorithm to resolve what you watch subsequent.
  • Rewind and fast-forward. Though helpful, this management is generally hidden. For instance, YouTube solely permits you to use this management utilizing keyboard shortcuts. Few video gamers implement this performance as a part of their default video controls.
  • Settings. YouTube implements a gear icon as a part of their default set of controls. Nonetheless, YouTube’s video participant is advanced. They use the settings management to cover different video controls which can be sometimes used.

YouTube settings

Lastly, we shouldn’t overlook how we show the present timestamp and the video size. Probably the most easy resolution is first to indicate the present video timestamp, adopted by the overall video size. On this instance, we’ve paused the video at 40 seconds with a complete video size of two minutes and 13 seconds — “0:40 / 2:13”. Alternatively, some video gamers present the remaining size of the video. Don’t do that, because it’s complicated for the consumer.

The following part takes a take a look at widespread and extra experimental keyboard shortcuts to navigate a video participant.

The way to Design a Video Participant for Energy Customers?

As increasingly customers develop into accustomed to keyboard shortcuts, the shortage of them usually will more and more result in a irritating video participant expertise.

Keyboard shortcuts enhance consumer expertise for energy customers.

To provide a private instance, I like watching Belgian TV on-line utilizing their video platform. The platform implements a customized video participant. Sadly, you may’t use arrow keys to rewind or fast-forward the video. On prime of that, you may’t pause or unpause a video by hitting the spacebar. The video participant forces me to make use of my touchpad and navigate my mouse to the small pause icon. Irritating, proper?

Video gamers these days ought to not less than implement a primary set of keyboard shortcuts to fulfill energy customers.

  • Spacebar: begin/pause video
  • Proper arrow key: fast-forward video by 5 or 10 seconds
  • Left arrow key: rewind video by 5 or 10 seconds
  • M: mute or unmute video sound
  • F: enter or exit full-screen mode

However why restrict choices to those keyboard shortcuts? YouTube is a number one participant in implementing keyboard shortcuts. Right here’s what we are able to study from YouTube’s energy customers:

  • Urgent J rewinds the video by 10 seconds, whereas the left arrow key rewinds the video by 5 seconds.
  • Urgent L fast-forwards the video by 10 seconds, whereas the fitting arrow key fast-forwards by 5 seconds.
  • The quantity keys are a much less well-known keyboard shortcut. Urgent 0 brings you to the start of the video. YouTube additionally splits every video into 9 components of equal size. No matter size, urgent any of the quantity keys (besides zero) will take you to that spot within the video. It’s a good way to leap to the tip, again to the start, or someplace within the center.

It’s nice that YouTube each implements fast-forwarding/rewinding for five or 10 seconds. In case you’ve missed a small element of a video, you may shortly rewind utilizing the left arrow key. Once you need to scan by way of a video, you may press the L key to scan the video with 10-second intervals.

Totally different Varieties of Video Controls for Totally different Functions

Let’s focus on the varied controls to implement for various functions — similar to academic movies, social movies, and cell movies.

Academic movies

Academic movies on platforms like Udemy or Coursera implement completely different controls than common video gamers. For example, customers usually like to extend the pace of educational movies. For that motive, it’s a standard management you discover on these platforms.

Furthermore, academic movies go hand in hand with bookmark performance. The consumer can bookmark a specific second in a video and add a word. This performance permits the consumer to mark essential moments in a video for reference.

Social movies

Social movies profit most from fast sharing choices. YouTube permits you to share a video, nevertheless it’s not a part of their normal set of controls. They’ve added this performance under their video participant.

Nonetheless, it’s price implementing fast sharing choices as a part of your video participant controls. Don’t overlook so as to add the power to share from a selected timestamp. Most frequently, customers need to share a selected second in a video with mates.

Twitch, alternatively, permits customers to clip movies straight from the video participant.

Clips permits Twitch viewers to shortly share essentially the most uniquely-Twitch moments from broadcasts whereas enabling broadcasters to develop their channels by way of social sharing!

It’s an important function to shortly clip humorous moments, implausible gameplay, or different share-worthy moments.

Supply: Twitch video participant

Cellular video gamers

Cellular video gamers demand an easier design. It’s not doable so as to add a large number of controls to a cell system’s display screen.

YouTube’s cell video participant, for instance, supplies the next controls:

  • enter full-screen mode
  • go to subsequent or earlier video
  • pause video
  • allow captions
  • open video settings

For cell movies, although, shortcuts enhance the consumer expertise. For example, double-tap the fitting aspect of your display screen to fast-forward a video by ten seconds. The identical applies to the left aspect of your display screen to rewind a video by ten seconds. Furthermore, you may swipe up and all the way down to enlarge a video or show the search outcomes once more. Right here, the main focus lies with the pace of use, which positively impacts the consumer expertise.

Conclusion: Outline Your Viewers

To design the fitting video participant, make sure that to outline your viewers. Speak along with your customers to know how they use your platform and video participant.

For example, Twitch’s clipping performance is exclusive amongst different video gamers. This performance is completely tailor-made to its consumer base to shortly save a cool second throughout a stay broadcast.

Don’t overlook to maintain energy customers in thoughts. They love utilizing keyboard shortcuts to carry out primary video actions, similar to muting video sound, fast-forwarding a video, or getting into full-screen mode.

Check out all of the obtainable YouTube keyboard shortcuts to attract some inspiration!

Lastly, for those who’ve acquired the chops to construct your individual video participant, please hold the ideas provided above in thoughts. However for those who’re simply searching for a ready-made resolution, the dialogue above ought to present meals for thought as you’re wanting by way of obtainable choices.

Click to comment

Leave a Reply

Your email address will not be published. Required fields are marked *