Adding Playback Speed feature on Disney+ Hotstar

Watching movies is a way to spend most of people's free time. There are different ways to enjoy it. Some people want to increase their productivity by watching movies at a speed above normal or schooler working on a task to review a movies. One feature that can help them is playback speed.

Playback speed is a feature that allows users to speed up or slow down video or audio media.

Disney+ Hotstar is a streaming service dedicated to show international and Indonesian hit movies. Currently within the Disney+ service itself there is no feature to choose the playback speed of the content they have, compared to their competitors such as Netflix and WeTV which already have this feature.

According to Howard A. Rosenblum, CEO of America’s National Association of the Deaf, he stated that the playback speed feature alone could help deaf people who might prefer a slightly slower text speed. On the other hand, according to Everette Bacon, board member at America’s National Federation of the Blind, many people in the visually impaired community can understand and appreciate audio playing at a much faster speed than most people with vision might be comfortable with.

Apart from its needs in certain communities, myself as a streaming service connoisseur feel that the playback speed feature is very important, especially when I watch a TV series that already has many episodes, but unfortunately Disney+ Hotstar does not yet have this feature in their mobile application. Besides that, sometimes I like to watch movies with speeds between 1.25x-1.5x so that I watch more movies/tv series.

Before starting my main research, I did a customer review analysis using the reviews on google play, with the results that many users were disappointed or at least just gave suggestions for Disney+ Hotstar to add playback Speed ​​feature on their product.

In this research, I used 4 approaches, namely:

  1. In-depth Interview to 5 subject
  2. Customer review Analysis
  3. Journal review
  4. Competitor Analysis

Interview subjects must have the following criteria:

  1. Men and women with an age range between 15–45 years.
  2. Aware of the playback speed feature in similar applications.
  3. An active online movie streaming application user in the last 3 months.

My interview guideline was made based on the background of the problem and pre-research from the results of the customer review analysis.

Data Collecting

Interviews were carried out using Zoom and WhatsApp Call to 5 subjects who matched the predetermined criteria. The interview schedule is adjusted to the availability of the subject in the time span 25 February 2022–02 January 2022.

In this competitive analysis section, I look for the advantages and disadvantages of competitors or similar applications from Disney + Hotstar be it generaly or design wise, namely Netflix, WeTV, YouTube, and Viu.

Netflix

Netflix was chosen because this application is one of the largest streaming applications like Disney+ Hotstar, besides that Netflix itself already has a playback speed feature so we can see which part is good and which part isnt and latter add or avoid those element on our design.

WeTV

Similar to Netflix, WeTV was chosen because this product already has the playback speed feature, not to mention a lot of their content is free so its easier for me to reach.

Youtube

Youtube as the largest streaming service in terms of the number of users is well known in the community, on average my interview subjects are also familiar with the playback speed feature from Youtube, and nowaday they also have some movies in their library to be rented.

Viu

Viu just like Disney+ Hotstar, doesn’t have a Playback speed feature, that’s why I choose this application as Disney+ comparison. From the results of the customer review itself, it can be seen that many users want the Playback speed feature to be added to Viu just we have seen in Disney+customer review.

A movie consists of 3 elements, namely images, sound, and writing. Majority of humans able to absorb stimuli in the form of images better than sound and writing. But that doesn't mean humans can't absorb sound and written stimuli quickly, it just takes practice to get used to it.

“…with practice and early exposure, the general population might achieve fast listening rate, and save themselves listening time”, says Bragg and co.

In line with the opinion of Bragg and colleagues , Pastore’s research results also show that there is not much difference between the speed of 0% (normal) and 25% (1.25x) in absorbing facts and problem-solving.

Define

After i conduct my research, the next step is to organize the insights i have collected through affinity mapping.

User Persona is a fictional character who represents the target user of a product. User personas serve to provide a real picture of users for product designers to make it easier to understand them, the goal is that products are made based on what users need. For this case study, I created 2 personas, male and female, with different personalities and detailed information, but with relatively the same needs.

User Persona 1

User Persona 2

User’s Journey Map is a visualization of an individual’s relationship with a product/brand over time. Its own function is as a tool for designers to see the product from the user’s point of view with the ultimate goal of improving the user experience in using the product.

The following are the results of the analysis through affinity mapping and insights from subject friends who support the background of this research problem, including the following:

I realize Disney+ Hotstar users need the Playback Speed ​​feature for some situations.

“Pernah pake yang lambatin buat nugas”.

“Yang nyepetin buat speedrun tv series”.

“Buat scene yang terlalu cepet dipelanin”.

From my finding subject feel that the main advantage of Disney+ Hotstar is that it is cheap~free because the product cooperates with one of the largest providers in Indonesia (Telkomsel).

“Dapet gratisan dari Telkomsel”.

“Karena dapet gratisan dari paket (Telkomsel)”

“Biasanya terpaksa kalo pake yg legal asal gratisan mah”

Besides that, there are also other advantages of Disney+ Hotstar, namely the film library which is quite large and complete.

“Film yang dicari emang ada disitu (Disney+)”.

“Streaming service cukup lengkap”.

Based on the results of my research that I have done, I conclude that this feature is needed by users to either speed up or slow video down.

Ideate

User flow has the primary role of mapping out a series of paths that traffic will take to a website or Apps to help achieve company and product goals. Here is the User flow navigation on Disney+ after I add playback speed feature.

Information architecture is information that is displayed in the form of charts, columns, or structured designs that are interrelated to make it easier for others to understand. Below is shown information architecture of Disney+ navigation flow from opening the app to activating the playback speed feature.

A wireframe is a layout of a web page that demonstrates what interface elements will exist on key pages. It is a critical part of the interaction design process. Here is the wireframe that I’ve made for this particular case study.

While of course our bread and butter is the playback speed addition, I also add some redesign to other areas in this apps such as the movie overlay, movie player, and menu bar base of our finding from competitor analysis.

Mock-up

High-fidelity design is basically our final design of product that we want to publish to users, of course the process itself isn’t finish yet but this is the most telling design of our final product before we conduct a test to users.

To make things easier for us before we create our final design, we compose our product’s design system so that we can reuse these component for latter.

In this page I only do some minor change like:

1. The original menu bar feel redundant with Disney+ button in it so I swap the place with Home button and swap it with watchlist button. After that I redesign the Home button so it will stand out compared to other button.

2. This is the new Watchlist button that I add to this menu bar. The main purpose itself of course so users can navigate to watchlist page faster since that is the place where users can access bookmarked movies or tv series.

3. And this last one is a new addition to this page, this will give users easy access to genres that previously only available accessed from hamburger overlay on left top, and of course this also serve the purpose of replacing the Disney+ button in menu bar in a way.

I did some overhaul in this page so its faster to navigate and give easy access to similar movies/tv series.

  1. Now genres is tap-able so users can access those genres easily (genres shown depend on related movies), and also I remove the movie summary.
  2. Here I only change the “WATCH” button placement and size, the reason is so the page wont feel empty and since its bigger, its easier for users to tap.
  3. Here I remove the info button since it has exactly the same function as the “WATCH” button, after that I add download button so users no need to navigate to the movie page to download movies and episodes button (for series only) for them to choose which episode to watch. And lastly I move the watchlist button (+) to the top-right of this page.
  1. Here I remove the text from setting button and move the placement.
  2. I change the button icon to a more universaly used one and move it to the bottom of the video player since its also the more universaly used placement for maximizing button.
  3. Lock button purpose is so when the button tapped, the screen will locked and prevent users from accidentally press other button so their watching movie experience wont be disturbed.
  4. Here I breakdown the setting and audio & subtitles button to a smaller and specific function. And of course we also add our playback speed button here.
  5. This function as movies recommendation for users, similar to what Youtube have in their product.

And here is our creme de la crème, the playback speed feature. There is nothing fancy here just adding a playback speed button to the video player Hpage and give it an overlay. There is seven speed option from 0.5x to 3.0x. According to our research, different user has different use of this feature, from slowing down the movie so they can analyze the movie easier, to increasing their productivity so they can spare more time for other activity.

Not much to say in this section other than here we can see our navigation flow of this apps from homepage to changing speed when we watch the movies or tv series while improving some of Disney+ design along the way.

Since this is like my second time making an UI/UX case study, there’s some bits that I miss or straight up fail to do when researching and redesigning this product. Of course mistake is part of our growth as a human being and I’m not afraid being wrong in my learning process. I do wish to create a better and more comprehensive case study in the future. Some of mistake and limitation I feel in the making of this case study.

  • While I do bring up deaf and blind community, I actually don’t have any link to those community, so there is some data especially about accessibility that I cant provide in the research.
  • I wish I had data traffic of Disney+ competitor that show how often people use their playback speed feature, but I do understand why they aren’t publish those data.
  • I am an amateur when it come to designing stuff, so there is so many mistake and inconveniece while redesigning this apps.

https://www.uxmatters.com/mt/archives/2013/02/how-do-users-really-hold-mobile-devices.php

https://elemental.medium.com/is-life-better-at-1-5x-speed-f5ae46c293c6

https://www.sciencedirect.com/science/article/abs/pii/S0360131511002351

https://uxplanet.org/a-beginners-guide-to-user-journey-mapping-bd914f4c517c

https://www.experienceux.co.uk/faqs/what-is-wireframing/

https://dl.acm.org/doi/abs/10.1145/3173574.3174018

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Participatory Policy with Design

How to Lead the Future

Designing fun: the user experience master class

Chess Game Pieces representing the table top board game chess. Created by Dion Ashton in Canva Pro Design.

DubsTech Rebrand - Case Study

Five Native Figma Tools That Will Save You Time

Cutting through the Language Gap

KingDraw Update| KingDraw V2.7 for Windows PC

How to Create Any Graphic Design in Less Than 5 Minutes

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Muhammad El-Manurwan

Muhammad El-Manurwan

More from Medium

Case Study: Journey Experience Design for a Traditional Market

Aldalilah

MediTree by National Wellness Institute Case Study- Ironhack Paris Project 4

Chef Scully Bakery app

Expanding Yelp to Better Help Consumers — UX case study