STARZPLAY’s App

Improving Content Search

Reading Time: 6 minutes

The Challenge

The challenge is obvious, we need to improve content search in the STARZPLAY’s App. First of all, let’s have a look at some screenshots around the current STARZPLAY App:

Research

The first step is to carry out some netnography in order to know more about STARZPLAY; how the brand is ranked and what is said about it. I will look for opinions that may offer insights to better understand the challenge I am facing.

Orange TV – The first result is the Orange TV site advertising STARZPLAY and offering recruitment and technical information. I assume that the service is already available in Spain under Orange TV. Otherwise, I don’t see any comments or opinions from users. I move on to the next result.

Xataka – the article clarifies dates for service availability. They confirm that the service is active in Spain since March 28th. There are no comments or opinions from users. We move on to the following results.

StarzPlay – When I press any CTA ‘View Now’ it gives me the option to subscribe via Orange or Vodafone. No user comments.

Espinof – Here we have comments. Let’s collect those that may be enlightening. I see 6 quite negative comments. From my experience, I would say that this type of negative feedback is due to the feeling of “saturation” that many users have in the new emerging platforms, such as Apple’s or Disney’s. Nobody talks about the quality of the platform’s contents or the experience of using the platform. Next.

Genbeta – provides information on the scope of the platform (10 million viewers for the most watched series ‘Power’). No user comments.

Fueradeseries – neither does it provide direct information on the platform user experience.

Starz.com – Official website of STARZ. No user comments, but I find it useful as an approach to their interface.

Computerhoy – similar to the previous ones. There are no user opinions on the use of the platform. They explain that the platform is property of Lionsgate and its availability through Orange TV.

We move on to the iOS and Android app stores. In my experience, this is a good reference point for netnography. Let’s have a look:

AppStore – the rating is 2.9 out of 5 and there are few comments. None of them refer to the experience using the interface, only to its availability in different countries.

Google Play – first relevant finding. It refers indirectly to the STARZPLAY interface. Several comments indicate that the Chromecast feature works better than on Netflix. This leads me to two findings:

  • The platform seems to have a solid performance.
  • The interface seems clear on the use and understanding of the Chromecast resource.

So far the netnography. It has not given me much information to be able to empathize with the users in their use experience, but as a kick-off it has been very useful to me when it comes to giving a better context.

Proposals

I will analyze the STARZPLAY Android App and the competitors platforms I have access to: Netflix, Prime video, HBO and Disney +. I will just give references if necessary to justify the interface design decisions I made.

1. Improvements to the current version

I have developed a first, more “conservative” proposal that would add improvements to the existing interface. I have done this for two reasons:

  • could be used as a short-term and more affordable improvement. It would be a natural iteration, keeping us in the same version.
  • the review and improvement of the current interface serves me to delve into the design and thus make a much more innovative and valuable proposal.

Let’s explain the improvements I made:

a) Home:

  • added Chromecast icon in the header, next to the search icon. Its function is to facilitate the App-to-TV broadcasting. This improvement was guided by the findings obtained during the research phase.
  • the icon text to show all items in rows and columns has been changed to (‘SEE ALL’). Now it’s easier to understand and more accessibility friendly.
  • added item counter (‘2 | 46’) for better accessibility. Combined with the ‘focused’ state that adds a blue border, larger size and ‘play’ button (if applicable) we make the user more aware of the reviewed items and their two-dimensional location within the App. The blue color will generally be used to identify items in the ‘active’ state.
  • the ‘play’ button only appears on the element that has the focus (if applicable). For example, in ‘CONTINUE WATCHING’ it only appears in the element that has been tapped to see its detail. When returning, it is assumed that the user is interested in playing this item. Eliminating the buttons on the elements that do not have the focus improves the visual perception of the covers.
  • Finally, I have improved vertical layout. Depending on the screen format of the smartphone, it will let users know that there are more sections before start scrolling. This issue has a direct impact on users being able to discover STARZPLAY content, which is the main goal.
b) Side menu:

• Avatar system has been added to make the user experience more customized and friendly.

• The active section or subsection is marked in blue to highlight contrast and readability, as well as to facilitate understanding of navigation levels.

c) Side menu / Settings:

The same criteria in legibility and contrast improvement from previous screen have been applied.

2. New navigation system – (Wireframes)

I decided to use a Bottom navigation menu instead of the ‘hamburger’ side menu. Ergonomics is improved by being able to use the App with one hand. It forced the development team to review and simplify the navigation, which benefits the users when understanding the App, handling it and discovering STARZPLAY contents.
The major advantage of the bottom navigation menu is that it is consistent throughout the App. Let’s analyze the wireframes developed for some of the key screens.

a) Home / Category with ‘featured’ section:

  • Categories become tabs placed on top of the screen. We change tabs by swiping over any empty area of the screen or by touching the tab itself.
  • The slider will show us related content, tailored to our preferences.
  • The section ‘FEATURED’ is added. It shows new content to be released on the platform. Another valuable way to improve the ability to discover new STARZPLAY contents.
b) Home / Category without ‘featured’ section:

The ‘FEATURED’ section becomes optional.

c) Search (basic):

We have a classic search engine that most users know. It allows both keyboard and voice inputs. It also offers a number of popular searches that can help users discover new and related STARZPLAY content.

d) Search (voice assistant):

Designed as a section to be developed in the future. It can be seen as a key differentiating element from competitors. It would be a specialized Artificial Intelligence that moves us away from the traditional method mentioned above. We could ask for “the series I was watching last night”, “comedy series like The Big Bang Theory”, “historical documentary”, etc.

It is the most powerful and effective way to achieve our goal. Most of the times, users don’t want to spend a lot of time looking through covers. In addition, the results can be very fast and specific or more general, depending on the user’s intention in each moment.

Finally, key screen layouts are shown:

3. Final Designs

a) Home / Category with ‘featured’ section:

b) Home / Category without ‘featured’ section:

c) Search (basic):

d) Search (voice assistant):

4. Animations and micro-interactions

Below are some animations made in Principle. The animation bases for the splash screen, transitions, horizontal navigation, menus and voice search are suggested. It is recommended that you view the video below in full screen mode (use the “Full Screen” button on the right side of the video player).

And that was all around researching and improving STARZPLAY. A somewhat different approach that demonstrates that each case may require its own techniques and methodologies, depending on the different contexts we face on our daily work.

© 2021 Oscar Manzano