The new iPlayer homepage

My team’s focus in iPlayer was helping people find things they wanted to watch. This is both getting them to the content they came for and helping them to find new favourite programmes from the BBC.

Why we did it

Across our regular research sessions, we saw that people were generally comfortable with finding something they already had in mind. However, discovering something new to watch wasn’t a great experience.

We set out to change that. Our homepage seemed to be where people experienced the most confusion. It was feeling outdated, and wasn’t presenting the content as well as it could. We decided it was a good place to start.

The iPlayer homepage before we started work The homepage before we started work

Investigating the problem

We started with some research. We watched people use the current site, and invited stakeholders to come along. We also interviewed those stakeholders. From this we found out that the homepage had been tweaked many times, without having been considered holistically in a while.

We also began to discover a gap between how the organisation and the public understood the homepage. We discovered fundamental flaws with the way the content had ended up being structured, which was hindering peoples discovery of new shows.

Specifically, it became clear that users had no idea why they were being shown the shows they were, or how they were ordered. Many people assumed it was ‘computer generated’, with others assuming that the content was (badly) personalised.

In fact, iPlayer is lucky enough to have a fantastic editorial team, who actively curate the homepage and other pages where you can find shows. However, because people did not understand why they were being shown this content, it made the page seem like a ‘random jumble of stuff’, rather than a carefully curated collection.

Previous iPlayer homepage screenshot Because the content seemed like a random selection, many users resorted to the safety of the Most Popular list

The lack of orientating devices on the page was also leading to people not exploring the breadth of content. Analytics showed an unusually steep drop off as users made their way down the page.

My hypothesis at this stage was that if we reassured users with clearer signposting, we’d make content more appealing and easier to scan, in turn increasing consumption.

Looking at the competition

To further investigate my hypothesis, I conducted a competitor analysis of the ways that streaming services sign post their content. Though affinity mapping of these sections, I synthesized the results into a colour-coded visual. I presented this to our stakeholders and colleagues to show people where our offering diverged from our competitors.

A small section of the competitor analysis A small section of the competitor analysis

  • Featured

    Items promoted to all users.

  • Content affinity

    Items linked based on the show's content.

  • Platform related

    Items linked by their relationship with the platform.

  • User activity

    Items linked to the logged-in user.

It helped us as a team to uncover the logic of how they piece together their homepages. Having this hung on the wall behind the team was a good reminder of the direction the user experience for content discovery was moving, and how we differed from that.

We also found that our editorial colleagues had their own frustrations with the page. They found it inflexible and limiting. For example, there were only two slots on the page for curated collections, which often underperformed because of their cramped design.

Looking inwards

Some examples of the output from the workshops we ran internally. Some examples of the output from the workshops we ran internally.

We ran workshops with iPlayer product teams to uncover peoples assumptions and desires for a new homepage. This took the form of a co-design session where participants created their own version of the homepage, using a set of printouts of components, which they pieced together, labelled and described to the group.

And looking outwards

The results from the co-design sessions with the public, stuck up behind the team. The results from the co-design sessions with the public, stuck up behind the team.

I also adapted and ran these co-design sessions with members of the public, to get a better sense of their ideal iPlayer homepage. Combining this and our internal research allowed us to pull out common themes, which helped us design a better homepage for everyone. Some of those key themes that emerged were:

  1. Genre based collections help people orient themselves and fit with their mental models of our content
  2. People wanted to be clearly shown the ‘Best of the BBC’ — an opportunity to shout about our editorial offering
  3. Boxsets are a key part of our offering that we had been keeping hidden from people
  4. Users expect personalisation to be woven seamlessly into the product, and don’t need it called out explicitly

The slice framework

Wireframe of the three slice types alongside each other. Wireframe of the three slice types alongside each other.

From these we developed a new homepage based on a framework of slices. I worked with the team to develop how these slices looked and felt, working on both an MVP approach and options for the future.

The old collection style, which hid our content behind a hover state and described shows in terms of 'programmes'

The new collection style used to display the same content, split by series.

The slices framework enabled us to experiment with new offerings much quicker, and allowed more flexibility to the editorial team to add time-based collections, such as for big sporting events.

I investigated three navigation devices for these slices - strip, carousel and pocket. These were ABC tested, with the carousel ultimately being identified as the one that helped the most with our original goal - to help people discover more shows to watch.

Three of the slice styles we tested Three of the slice styles we tested

Individual items

The new item hover states, designed to free up space to autoplay clips from the show.

As well as redesigning the slices themselves, we also looked at the individual items which sit in them. Research showed us that users rarely read the secondary descriptive text, and relied on visuals to help them make a decision.We freed up the image space to autoplay a silent trailer on hover, whilst retaining the secondary text. This is yet to be implemented, however.

The resulting homepage tested positively with users, and with a few final tweaks it went live to positive results. The new homepage is driving higher playback times for users and is more sustainable and flexible for the business.

This project was completed over the space of three months with Filipo and Dimple. It coincided with the rolling out of a visual refresh of iPlayer.

Previous iPlayer homepage screenshot

Check out other things I’ve worked on or about me