The big design challenge for the next version of iPlayer was how to create this simplicity in light of more features and functionality without overwhelming our audience.

Let's consider the two basic tasks: find and play. The goal is to minimise our audience's time spent on the first task while maximising their time spent on the second one; ultimately discovery is just a means to enable people to watch their favourite show, which is why they come to the iPlayer in the first place.

Thus, the primary design challenge was to elegantly weave the new functionality and features into the iPlayer fabric while keeping the user interface simple. The following four design strategies informed our solution framework:

Navigation

We recognised that watching TV and listening to the radio are two different activities that respond to different user needs. The previous version of iPlayer mixed radio and TV content on each page. However, user data showed that very few people used the iPlayer for both at the same time. Radio and TV iPlayer use peaked at different times of the day and had little overlap. (Table 1 most likely overstates the overlap as the number reflect hardware not users).

Table 1: Average Daily BBC iPlayer Users

In other words, very few people are indifferent to whether they watch TV or listen to the radio when they come to the iPlayer. This makes sense as watching TV and listening to radio are not perfect substitutes; TV is an immersive experience that tends to get the audience's undivided attention while listening to the radio tends to complement other activities and is a less immersive experience. People come to the iPlayer to either watch TV or listen to the radio.

Table 2: TV and Radio Use by Time of Day

Therefore, we decided to make TV and radio the top navigational choice. The two pages, however, are identical in terms functionality and look and feel; it's only the content that differs. The TV page is the home page as more people come to the iPlayer to watch TV than listen to the radio. As a matter of fact TV and radio are the only two top navigational choices down from five in the previous version.

Image 1: iPlayer V3 Header

This reduces V3 to three key pages: TV, Radio and media player. Fewer pages imply less navigation between pages and therefore less clicks to find content. The radical simplification of top-level navigation implies, however, that most of the navigation has to take place in context and in page which poses different challenges which will be discussed next.

Image 2: iPlayer V3 thumbnails of the 3 key pages (TV, Radio, EMP)

Browsing

Collapsing Home, TV Channels, Radio Stations, Categories and A to Z into one page required us to rethink how content is accessed and bundled. Our design guidance came from considering the three primary discovery modes that we identified: browsing content, finding missed shows and exploring content of a certain type. The design of the TV and Radio page therefore consists of three parts that directly respond to the three user needs: the drawers on top of the page allows users to discover shows that they might not know about; the EPG on the lower left half of the page allows users to find what they missed; and the categories module on the lower right hand corner enables users to browse content by type.

Image 3: The three browsing modules (drawers, EPG, categories)

The drawers enable all scanning behaviours, combining four different sources for content discovery: Featured (editorially selected), For You, Most Popular and Friends. Each of them has a different flavour that might appeal to different users at different times. As it is impossible to know beforehand what might be of interest to the users, they can easily switch between the different sources. Upon arrival the drawers are partially open to reveal the available options. As soon as they interact with any of the drawers, the chosen one expands to show more content. As soon as another drawer is selected, the focus shifts accordingly.

The drawers are a playful and efficient way to surface content, making the best use of the limited screen real estate. Earlier design treatments considered having four different modules, each containing one of the sources. However, it became clear that that solution would break the simplicity of the navigation.

Image 4: The drawers default state

Image 5: The drawers selected state

The EPG and the categories module, on the other hand, are more utilitarian by nature. The users know what they are looking for; the primary design challenge is to enable users to navigate the EPG or the categories and to get them to the searched item as quickly as possible.

Personalisation

V3 personalisation features consist of For You, My Categories and Favourites. The different features are revealed over time as users engage with the content rather than all at once potentially overwhelming them. Favourites accompany the users throughout their iPlayer experience giving them universal access to their favourite shows at all times. Like a shopping cart it is pervasively accessible on top of the page connecting discovery - where shows are added - and watching - where they are consumed.

Image 6: TV Favourites in open state

My Categories are woven into the categories browsing module, in essence bookmarking the ones of interest to the users. Once users have chosen their favourite shows and categories and new content gets surfaced in the For You drawer, discovery requires less active engagement: users will always be only one click away from accessing their favourite BBC shows. Less time spent discovering means more time enjoying.

Image 7: Categories

Look and Feel

The new carbon fibre look and feel of V3 replaced the shiny look of V2 while keeping the distinct and iconic black and pink of the iPlayer. The new "materiality" of the interface gives the interface depth and texture that adds dynamic to animated components such as the drawer.

Image 8: Carbon Fibre look and feel details

To underline the selected state in the top navigation a visual element inspired by the old radio dial was introduced while a streamlined font and color hierarchy was created to maintain a simple user interface.

In a nutshell V3 offers new functionality in a new user interface that aims to make it easier for our audience to find what they want to watch or listen to. Streamlined navigation, new functionality and a new taxonomy will enable our audience to find more quicker giving them more time to enjoy the content.

So what's next? We keep working to improve the experience with the goal to enable our audience to spend less time looking and more time enjoying on all platforms. The new iPlayer on mobile devices with Favourites launched recently and will soon launch on the other platforms as well.

Fabian Birgfeld is Head of Product Planning, BBC FM&T