New BBC iPlayer: redesign insights

Monday 17 March 2014, 11:34

Kutlu Canlioglu Kutlu Canlioglu Creative Director

Tagged with:

Hi, I’m Kutlu Canlıoglu, Creative Director for TV&iPlayer.

Over the last year we’ve been redesigning BBC iPlayer across all platforms. And on Tuesday of last week a public preview of the new iPlayer on the web and connected TV platforms was released. I wanted to share some of the thinking that went into the redesign.

Our goal was to create an improved and more coherent user experience across the different applications that deliver the BBC iPlayer service. As part of the redesign, we’re replacing three different websites we’ve been maintaining for mobiles, tablet devices and desktop computers with a single responsive website. We’re also rolling out a new TV app for connected TVs and consoles that support HTML, which will eventually replace the two different apps we currently support on TVs. And over the coming months, our native apps for mobile and tablet devices will be adopting the new UI framework, patterns and functionality inline with our new responsive website and TV app.

We had four key principles to help shape the design of the user experience across the platforms:

1. Simplify finding

2. Encourage discovery

3. Pave the way to a more personal iPlayer

4. Never a dead-end

Find/Discover

Finding something particular and discovering new programmes are the two main user activities on iPlayer.

We know from stats on our current desktop site that 58% of our users come to iPlayer with something particular in mind to watch. This ratio is even higher on mobile devices.

But there are around 1,200 hours of content available on BBC iPlayer at any one time, and this will increase as we extend the availability window from 7 days to 30 days (subject to approval from BBC Trust). So exposing the breadth of content available, without getting in the way of those users who have come with something specific in mind, was a key consideration.

an approach to consistent use of the screen across different platforms for user needs Our approach to consistent use of the screen across different platforms for user needs

To achieve this on the new responsive website, we used the familiar carousel pattern to facilitate discovery, and supplemented it with a set of tools we refer to as the “find tools”.

the screen ftramework in use on the home page layout for computers The screen framework in use on the home page layout on computers

The find tools get you directly to what you’re looking for, but they minimise if you engage with the featured content in other parts of the page. Similarly, if you use the find tools, the featured content dims down to get out of your way.

On devices with smaller screens, we use a vertical scroll to support finding and discovery, with the find tools at the top of the screen to help get you straight to the programme you’re looking for if you already have one in mind.

The screen framework is adapted to better fit user needs on mobile The screen framework is adapted to better fit the key user needs on mobile devices

On our TV app, we use a similar framework to the desktop experience. The find tools are on the left, and if you’re here to browse the programmes, you can move horizontally to browse the best of and (previously) hidden gems on iPlayer.

iPlayer home screen on a connected tv app iPlayer home screen on a connected TV app with a similar framework to a desktop computer

In the coming months, we’ll be integrating the new TV app into the Connected Red Button service. And we’ve been working closely with colleagues across the BBC to make sure there’s a joined up experience across the range of BBC TV apps.

Our aim is that once someone is using iPlayer on one device, they’ll be familiar with all instances of iPlayer across all their devices.

Discovery through Channels and Categories

Curated content from the BBC’s TV channels is a new feature we’re introducing as part of the redesign. Previously, the presence of channels in iPlayer was limited to browsing by the broadcast schedule. The new channel pages, with their strong branding, provide a destination where our editorial teams can showcase programmes from each channel, and surface content that is made available exclusively for iPlayer, or premiered on iPlayer first.

BBC ONE page on the new BBC iPlayer BBC ONE page on the new BBC iPlayer

They are also home to each channel’s live TV stream. Of course, we continue to offer the full schedule through our TV Guide, as well as channel-specific schedule pages.

Categories is another area where we’re making it easier to discover new content. We continue to offer the list view of everything in each category but you’ll also find a curated view of programmes you might not have known about.

Drama category in the new iPlayer Categories in the new iPlayer are a key part of the discovery experience

 

A more personal iPlayer

Helping users personalise iPlayer was a key goal of the redesign. You’ll find that favourites work similarly to how they work currently but with the bonus of a responsive approach: now, if you sign in to the site you’ll be able to get your favourites on your mobile and tablet devices as well. We’re also working hard to integrate signing in into our native mobile, tablet and TV apps so we can offer a seamless experience across the platforms.

We’ve also made “Recently Watched” easier to find. It gets a much more prominent place on both the responsive site and the TV app and provides a “warm trail” into programmes. We think of this as a form of “lazy favouriting”, and are working to improve this further so we can also use this space to surface new episodes of the things you’ve watched in the past.

The recently watched area The new BBC iPlayer home page with the Recently Watched area open showing three programmes  

The redesign also paves the way for the future development of a much more personal iPlayer. So, for example, we’ve recently prototyped incorporating personalised recommendations based on programmes you’ve watched and your favourites into the browsing experience.

Never a dead-end

When approaching the playback page, we had to keep in mind the fact that user needs change throughout the watching experience.

Since a majority of our users currently use iPlayer to catch-up with the latest episodes of programmes they follow, most journeys in the new iPlayer are biased towards getting users to the latest episode as quickly as possible. So the first user need on the playback page is to establish that this is the right episode, and if not, to get you to the episode you’re looking for. To aid this we list all available episodes directly below the programme information of the episode you’re on.

Similarly on TV, when the programme starts playing, the playback controls are briefly displayed in their expanded state, exposing the long description of the episode, to help you make sure you’re on the correct episode. And, if you’re not, you can access all other episodes to the left of the programme information.  

  playback controls on the connected TV app include an easy way to get to other episodes Playback controls on the connected TV app include an easy way to get to other episodes

During playback the UI dims down if you’re watching embedded on a web page, or disappears completely in full-screen mode. On the TV app, you can still browse iPlayer while the programme you’re watching continues playing in the background – an experience users will be familiar with from our red button service.

At the end of the programme, we display the next episode if it’s already available, and give you recommendations for other relevant programmes.

The More Programmes panel opens automatically at the end of playback The More Programmes panels open automatically at the end of playback  

Similarly, while you’re browsing a category, if you haven’t found anything that takes your fancy, we give you a link to the full listing of that category, as well as links to other categories if you want to skip to another genre.

  End of the Highlights category on the new iPlayer with onward journeys End of the Highlights category on the new iPlayer with onward journeys

And if you’ve searched for something and it’s no longer available on BBC iPlayer, we’ll give you a link to the programme website so you can find out if it’s coming back on air and to iPlayer.

Redesigning for new and existing users

An important part of any major redesign is getting it right for new and existing users.

For example, we knew that to provide a simpler interface that makes iPlayer as inclusive as possible for new users, we might need to move some of the features that existing users enjoy to a different part of the interface.

To get this right we have repeatedly user tested each change. And we’ve been pleased to see that existing users find them intuitive. We think this is for a few reasons: we’ve made sure users can still find what they’re looking for using routes they’re familiar with on the current iPlayer; we reused design patterns that are familiar from other parts of bbc.co.uk; and we’ve ensured that changes to the key part of the iPlayer experience, the new playback page, are straightforward and evolve from the current design.

Finally, one thing we haven’t changed. Users who’ve come to enjoy that little bit extra from iPlayer (and Spinal Tap fans) will be happy to see that, where operating systems allow, the new iPlayer’s volume controls still go up all the way to 11.

Redesigning BBC iPlayer has been a great experience. And I hope we’ve gone some way towards living up to the responsibility that comes with working on a service that’s enjoyed by so many people. You’ll see this is by no means an end but very much a starting point for iPlayer to evolve further in future.

I look forward to hearing what you think. You can use the survey we’ve created to capture your feedback, or post your comments to this post and I’ll do my very best to respond to you.

Thank you for reading.

Kutlu Canlıoglu, is Creative Director for TV&iPlayer, BBC Future Media

Tagged with:

Comments

Jump to comments pagination
 
  • rate this
    0

    Comment number 1.

    First off thank you for fixing the schedule (my initial comments about navigation referred to the old schedule pages) The individual detailed schedule pages need to be looked at in the same manner as they are just simply too large and don't allow easy channel switching ( have the channel bar as part of the fixed Days or allow the channel selector at the top to switch between channel schedules.

    Regarding Find and Discovery you need to be able to filter by channel. I know the drive is towards all content is equal but a documentary on BBC 4 is something completely different to a documentary on BBC 3 and having them on an equal footing ignores the careful channel controller segmentation that has gone on.

    Also I don't know why Categories are in the Navigation portion as opposed to the Find area as moving them to the left would make more sense and free up the Channel Selector to show News as well.

    Regarding the responsive template you have really missed a trick to show much more information on wider desktop machines. The standard view stops at 1008px and doesn't expand any further. The channel selector could expand as the screen expands and the TV Guide could show much more information at 1280px and beyond.

    on a desktop the Discover portion is actually very cramped and the slider is far to thing to be useable even with a mouse and the sensitivity turned right down. Why can't the discover front page panel expand vertically and then I can use my scroll-wheel on my mouse also this would free up a lot of horizontal real estate ( if you still insist on capping the width at 1008px) so the episode descriptions would not get brually truncated like they do now.

    Finally the programme pages for shows not yet on the iPlayer needs to be looked at. If you click on say, Only Connect for tonight then you get a page that no longer has any of the iPlayer branding but actually has lost all of the navigation features that you used to get there.

    All in all it is shaping up to be a decent looking site but for me you just need to spend more on the desktop view as it actually looks incredibly cramped with the central show panel not expanding vertically meaning you have to use either the very thin slider or the arrows to navigate. Both of which are inferior and slow than the scroll wheel on my mouse.

  • rate this
    0

    Comment number 2.

    'a documentary on BBC 4 is something completely different to a documentary on BBC 3' - I find this difficult and narrow, some of the most challenging and interesting documentaries recently have been on BBC3, the presentation may be different but that's the only difference.

    Categories are 'channel' like - so fit into navigation, its like having the BBC Drama channel etc so I think they are good where they are.

  • rate this
    0

    Comment number 3.

    Kutlu, I haven't checked if it is fixed already but the live rewind feature on their new iPlayer is or was broken. Could it please be fixed. It's a feature that is being used a lot here

  • rate this
    +4

    Comment number 4.

    1. Simplify finding - The favourites bar was the simplest way to find programmes you were interested in, it's gone. The schedule pages are not suitable for a desktop. I can't see how you've achieved objective 1.

    2. Encourage discovery - You got rid of the 'For You' section which recommended programmes at the bottom of each programme page, how is this encouraging discovery?

    3. Pave the way to a more personal iPlayer - The favourites are ruined, there is no way to sort them, no way to find out what is expiring, no way to find out what is new, it certainly doesn't seem very personal to me.

    4. Never a dead-end - This is the only one I feel you've achieved, now we're just going round in circles. Seriously though, showing programmes as available in the schedule which aren't available seems like a dead end to me.

  • rate this
    +3

    Comment number 5.

    Please can you add an image of the site on a typical desktop screen (eg 22+" 1920 * 1080 resolution or even just 1680 * 1050) because the site does not look at all good when viewed on screens of this size, even if the browser isn't maximised. There is just so much wasted space that the design is clearly not "responsive" to the device at all but is just enforcing a tablet style design that is inappropriate to the screen size and mouse based interaction.

 

Comments 5 of 26

 

This entry is now closed for comments

Share this page

More Posts

Previous
Making the new iPlayer accessible for all

Thursday 13 March 2014, 10:41

Next
BBC iPlayer apps on Chromecast

Wednesday 19 March 2014, 09:02

About this Blog

Staff from the BBC's online and technology teams talk about BBC Online, BBC iPlayer, BBC Red Button and the BBC's digital and mobile services. The blog is reactively moderated. Your host is Nick Reynolds.

Blog Updates

Stay updated with the latest posts from the blog.

Subscribe using:

What are feeds?

Links about BBC Online

BBC Internet blog Archive

owl-plain-112.jpg 2012 ι 2011 ι 2010 ι 2009 ι 2008 ι 2007

Tags for archived posts