Mobile Video Player
User Research

UX Designer & Researcher: Natalie Woodford

Collaborators: Scrum team software developers

Product

Mediasite Video Platform is a comprehensive video content management system designed for educational institutions and enterprises. It facilitates the creation, management, and delivery of multimedia content, including lectures, presentations, and training materials.

Over 2 million viewers (typically higher ed students) worldwide watch videos via the Mediasite Video Player.
…That’s a LOT of eyes on our product.

Impact

The project started with a simple issue ticket to investigate why the “show more” icon was cut off on the player control bar in portrait mode, but I quickly found that I had more questions than answers:

  • Why are the icons so small?

  • Are the icons in an order that makes sense?

  • Do users even view course content on their phones?

  • Do users have the right icons/features available on the control bar?

The problem

TL;DR
The current display was not user friendly no one at the organization knew how often viewers use the mobile player and which features were important to them.

The plan

Part 1
Lead a brainstorming workshop with my team to talk through our perceived must have features vs. nice to have features on the player control bar. This work helped develop the first draft wireframes for A/B testing with users.

Part 2
Identify users for the usability study which will include a survey, usability testing, and 1:1 interviews.

Part 3
Gather insights, finalize designs, report out to stakeholders

The execution

  • Using the outcomes from the team brainstorming workshop and data from a general user feedback survey, I completed the mobile wireframes that will be included in the usability study survey.

  • I then recruited 10 Student Digital Champions from the University of Bristol to be part of the study. These students are the sounding board and SME’s for Mediasite support for the student body.

  • As part of the survey, the participants were asked to watch a video on their mobile phone and respond to a series of questions about their viewing experience, the features available on the tool bar, and respond to an A/B test of current state and proposed designs.

Study Results

How viewers use the mobile player
I was surprised to learn that the study participants rarely used mobile devices for viewing course content. …but not without good reason:

  • The app required by Blackboard (Learning Management System) to access course content on mobile was such a bad user experience that they typically hold off watching until they can use a computer.

  • Study participants will only watch course content on mobile devices if necessary for time saving, such as riding public transportation.

  • If they do watch course content on a mobile device, Landscape mode is preferred because on-screen text (such as on PPT slides) is too small to read in Portrait mode.

Which features are important
The most important playback control features are Captions and Playback Speed:

  • Nearly every student said they turn on captions when watching course content (desktop and mobile)

  • Most students up the playback speed when watching course content.

  • Full Screen is also a popular feature.

Viewers are confused
There was a lot of confusion when talking about the “Course Channel” playback features (blue bar underneath playback controls Vs. the actual playback controls (black bar where the Play/Pause icons are.)

“Why are there two sets of controls on top of each other?” - Study participant

Design changes

The study results inspired positive changes for the playback controls:

  • I added the Captions feature to the main control bar (as opposed to leaving it in the “Show More” menu).

  • I added a new feature, Skip back and forward 10 seconds to the main control bar.

    • All study participants responded that this feature would enhance their viewing experience.

  • After learning more about the participants confusion between the “Blue” Vs. “Black” playback controls, we condensed the feature into one to make for a more streamlined experience.

Report out

With my user research and updated designs in hand, I presented my findings to the Product and Engineering team. My presentation focused on the current state usability issues, survey/interview feedback, and new mockups. I created issue tickets in GitLab to be prioritized by the scrum team.

I also created a 3-page report summarizing the study, results, and next steps that was sent to project stakeholders outside of my team. The report was also sent to the University of Bristol Digital Education department thanking them for participating in this research.