Get users to the content they love

GET USERS TO THE CONTENT THEY LOVE
I joined NOW TV’s Product Design Team in 2014 as a Lead UX Designer. Back then a start-up created within Sky, NOW TV was an attempt to compete with Netflix and similar services by offering exclusive content, such as Game of Thrones or Sky Sports, at a reasonable price on multiple devices. We were really excited.
A rapid scale-up of the project led however to quick and pushy decisions and a somewhat cluttered app. It was time to take a step back and to re-design NOW TV from scratch to prepare it for an international roll-out (e.g. as Sky Ticket in Germany).
Today, NOW TV is one of the UK’s most successful streaming services. Design played a vital role in that. For web alone we managed to increase the number of playouts by 77 % on desktop, on tablet web by even 120 %, and on mobile web by 150%.
My role
UX Lead for the NOW TV Web platforms.

The challenge
To increase the number of playouts on NOW TV by getting them to the content they love.
The solution
A new cross-platform content hub and landing experience for NOW TV.
Success Metrics
Increase the number of playouts by helping users to find what they are looking for.
Increase variety of shows and programs users are watching by inspiring those users.
Constraints
Legal restrictions about the way we could enable the user to playout content (the user had to download a separate player instead of playing out through the browser).
Additional background information about my thinking process, explorations and certain aspects of the product
Lab tests from our research team indicated that the biggest problem our users had was a fundamental basic one: Finding content and understanding the propositon. NOW TV back then consisted of 4 different passes that could be bought separately. I analysed our research, iterated the character of the problems to solve and conducted a series of workshops to gather and condense findings. A topic that came up over and over again, was the overall navigation structure. How can we modify the NOW TV structure to fit users behavior and expectations when looking for content? Together, as a team, we re-formulated this into a positive action that almost like a Mantra influenced our everyday work:
Get users to the content they love!
This guideline defined every flow and interaction on the page.
The landing experience for every user logging in to NOWTV was the movie landing page.
This page was confusing for those who didn’t actually own a movie pass.
Movie Landing Page with no hint to other passes


As a first step I recommended to modify the top bar section to help users understanding where they are (in which pass section). So working with our Visual Designer, Amy Clarke, we decided to highlight the purple top bar.

The app was accompanied by a cluttered left side menu and I started to iterate on how I could adapt the structure to users search behavior.
The first idea I prototyped was to develop a focussed state.

Amy Clarke, adapted this concept and introduced some additional color coding (based on the colors of the individual passes) to emphasize this navigation concept.

I hoped our users would be able to find the navigation within the web product easier this way.

The paradigm failed on some devices, like TV, due to slightly different interaction models on those devices.
Users scroll lists faster and the drop out menu seemed to make the interaction inconvenient.

On top there was a disconnect between the design and marketing teams who operated independently, which led to a broken experience when trying to log-in to NOW TV via web.
The NOW TV web product itself, also was not mobile responsive which lead to some broken flows.
It was time to make a step back and to re-think NOW TV


Whatever navigation model I came up with, it had to provide guidance for a constantly changing content structure, similar to news websites

I wireframed first ideas in order to discuss them with stakeholders and developers.


I explored different variations on this wireframe level and prototyped a few ideas.

In daily reviews and catch-ups around our design board everyone took their job titles off and we were creative together as a team.
We worked very collaboratively at NOW TV. Something that I learned here more than anywhere and would like to bring into every new job.


After numerous tests and iterations I finalised our final UX concept for a landing page across web and mobile which based on research allowed our users to find content the quickest way to the content they want to watch.
Users would now be welcomed with an overview page which would allow access to the different content sections. It would also highlight new content and promotions and work as navigation at the same time. It would of course be mobile responsive and also work as a potential Desktop App.

The information architecture and the display of information required a very detailed analytical specifications to define the different information displays. I worked closely with Dhanyaa Balakrishnan, another visual designer of the project team, on this. Based on my table below she was able to provide a consistent visual system on how we presented information across NOW TV’s content displays. Based on many user tests we hoped to provide exactly the type of information that our users needed to select a Movie.

Besides the in-page navigation, I created concepts for a responsive top bar for Mobile, Tablet, Desktop and, now new, a downloadable desktop app. The idea was to provide a consistent navigation grid to our users despite changing contents across all platforms, initially on web and later on on every single platform.


With the new navigation in place, and defined information displays on the new landing hub, I would also like to mention the flow users went through in order to get to content.
As said, we now we had a new overall content welcome hub to access content, a consistent navigation, a mobile responsive web product. The final and maybe most important step missing was access to the details pages for movies, or shows/ sports programmes. From here users could play out content and get detailed information.
Was this step necessary at all? This journey was long and nested:

I tried to simplify the navigation to get there. Instead of supporting a page-based navigation, a simple content overlay did the job. See my wireframe and Stuart’s final design below.
The same overlay on a mobile screen (in this case for a show and not a movie).

As a UX Lead I worked with 5 Visual Designers over the time to deliver this re-design, over a period of almost 2 years. This involved a lot more than can be shown here. It was a very complex project in the end, involving a lot of internal communication and convincing. The product was intensively tested, mostly across Europe, like here in Milan and underwent further smaller iterations.

We did some last tests in a Hi-Fidelity Prototype to iron out obvious aspects.
The new NOW TV then went live in 2019 as NOW TV in the UK and Italy and Skyticket in Germany and Austria.

As a final result of the launch, with this re-design of NOW TV the number of playouts went up by 77% on desktop, 150% on tablet and 80% on mobile.
Numbers and story slightly tweaked for NDA reasons and demonstration purposes of this portfolio.

