BBC Ideas

Launching a Webby Award winning new service — short-form videos for curious minds

I was responsible for the user experience of a one-year beta website, working with external branding, design and development agencies

Business goal

To position the BBC as THE place for under 35s to get interesting, thought provoking content.

Responsibilities

My role was to lead UX, which included responsibility for:

  • Briefing and managing the external design agency
  • Managing generative and evaluative research
  • Championing accessibility
  • Adhering to and creating new BBC design patterns

DELIVERABLES
A website
Marketing material

SUCCESS CRITERIA
Consumption — users to watch more than one video per session
Perception — the BBC to be the place to come for thoughtful content

TIMELINE
2017–2018

mobile

The problem

The BBC was losing market share of under 35s to competitors, especially to short-form content providers like YouTube. 

This audience is the future heartland of the BBC. We needed to bring them back with high quality content in a format appropriate to their lifestyle.

The big idea

I joined the project after the proposition had been defined by the Audiences team: 

“BBC Ideas is for people who care about the quality of their media diet BBC Ideas is a mobile focussed experience introducing users to eye-opening, surprising and essential ideas in the form of short form videos and needs-based playlists.”

Design principles

I wanted us to have a simple set of design principles that we could use to guide and assess the UI and visual design of the site, especially as our team was fully remote and involved multiple external party agencies. 

Based on the product proposition, brand guidelines and discussions with the leadership team we came up with the following principles:

triangle-1
life-wool
soil

We expected mobile and tablet usage to be high

Understanding

The first task I set myself was to ensure the design team and stakeholders understood our future users and the landscape that we would be entering.

The process involved several stages including:

Personas

I made sure the personas were front-of-mind for the whole team during the design process. I also used the personas to create recruitment briefs for research studies.

The personas were an effective tool. As they were a fixed reference point, they were useful for creating consensus when making decisions. 

Picture-1

Competitor/pattern research

I reviewed direct competitors - looking for common patterns, expectations users might have and areas that could be improved.

One of the principles of the project was efficiency and reuse. As the project was envisioned as a learning opportunity it made sense to save time and budget by reusing existing components. 

The BBC has a large digital portfolio and the GEL pattern library. I reviewed the portfolio with the design agency looking for opportunities for reuse.

Design challenges

Based on the learnings from the Understanding phase, I set out the design challenges we would need to overcome to make the project successful. The design team tackled these problems thoughout the project.

Learning: Understanding of the BBC Ideas proposition was mixed
Challenge: How might we get users to understand the BBC Ideas concept

Learning: Off-product ads will be the main form of acquisition
Challenge: How might we get users to stay and watch more than one video

Learning: Collections of short form videos were new to the BBC
Challenge: How might we create a quality short form video experience

The scope of work

With the product team and the design agency (Magnetic North), I worked out a plan for what could be achieved within budget, would be acceptable to users and would deliver the proposition.

As the team worked remotely, we needed good tools and discipline to keep in touch. I had daily standups with the design team and we kept in touch on Slack throughout the day.

softwire-roadmap-timetable
play-life
Screenshot-2021-08-09-at-20.17.17

Development

Once we had the plan in place we started ideating and defining solutions:

Ideation

Ideation was mainly done through collaboration with the Magentic North design team. At key points in the project we held workshops with the wider team to generate diverse ideas and get stakeholder buy-in.

workshop

Journey mapping

Idealised journeys were created by the Audiences team before production started. I made sure we applied this thinking to the real world and worked out how users would respond to them. 

Katie-2

Wireframes

Magentic North produced the wireframes. I reviewed them to ensure they met the brief.

One way I did this was by using these wireframes in prototypes during usability sessions.

wires

Prototypes

In keeping with the rest of the project, I kept the prototypes lightweight and fast. 

Prototypes were used to get feedback from users in usability sessions and to demonstrate ideas to the design and engineering teams.  

An early prototype shown to users in usability sessions

Evaluative research

Hall testing

Our design researcher recommended hall testing as it met our need of getting a mix of qual and quant feedback.

We worked with an external recruitment firm and booked a conference suite in a busy part of the city centre. We ran short sessions made up of an interview and simple tasks and got through 60 participants in the day.

Our findings were that understanding of the proposition was mixed -  we realised more work needed to be done to help users to understand what BBC Ideas was all about. We addressed this in our next design iteration.

1_BNT-TYQcmGY4e_XU0359AQ
1_UnBGIyL0LnKEAZW6-HMEiw

Findings from hall testing

Lab sessions

We conducted regular lab sessions to gather feedback on our designs. In general, as we used a lot of existing design patterns we didn't run into severe problems, but we did find opportunities to make improvements.

playist-life
playlist

Collections of themed content were key to getting users to watch more than one video

Solution

Here’s some key features of the solution we delivered:

Subtitles

As part of the BBC's Accessibility Champions Network, I had a strong desire to make sure all BBC Ideas content was supplied with subtitles. 

This need is even greater when you consider that we expected Ideas content to be consumed by people on-the-go. Making sure content could be enjoyed without the need for headphones would remove a barrier to usage.

I pushed hard to get content subtitled, but that would come at a cost to the business. Eventually, through laying out the argument clearly and the BBC’s strong accessibility guidelines, we managed to come to an agreement that all content would be supplied with subtitles.

This is a great example of inclusive design creating a better experience for all users. 

subs-1

Collections

Groups of themed content was a key idea since the conception of the product - the aim was to make it easy for users to find a second video to watch after playing the first.

My challenge was: how to create a solution that was easy to use and undertand for the user but relied on existing BBC patterns to reduce development costs.

I wanted to make sure there was a clear visual distinction between collections and individual content.

Working with Magnetic North, we came up with a bold visual style that created distintion between collections and individual content, reinforced the Ideas brand and got around the problem of not having bespoke collection imagery.

Users responded well to the concept and execution of collections. Usage data told us that users watch more than one video per session, which was a key goal of the project. 

collections-1

Likes and play counts

An aim of the project was to use BBC Ideas as a platform for testing new product thinking. One of these areas was how likes and play counts could be used to help users decide if they want to watch content. 

Once we dealt with concerns, such as low numbers of likes/plays being detrimental to users wanting to watch, we were able to implement likes and play counts and learn how users responded to them.

One interesting point we learned was that some users were drawn to videos with low play counts as they felt they were buried treasure that they'd discovered.

The commissioning team also used number of likes as a signal for future commissions.

likes-1

Outcome

BBC Ideas has become a successful product — it was envisioned as a one year experiment but as of 2021 it’s still alive and kicking. 

Users love the content - the completion rates of the videos are higher than expected. There are now over 500 videos published, with some videos and collections gaining millions of views. 

BBC Ideas also won a Webby Award for Public Service & Activism.

How did we do on the initial goals of the project? 

Consumption - users to watch more than one video per session
Looking at the usage data, the site averages over two watches per session, so this goal has been achieved.

Perception - the BBC is the place to come for thoughtful content
Judging by the traffic to the site since its launch, there has been some positive effect on perception, but the size of shift is difficult to measure.

Reflections

My recollections of this project are all very positive. It was a pleasure to work on a new project with a strong proposition and a capable cross disciplinary team.

Inclusive design can make a product better for everyone
By making subtitles mandatory, we made the product accessible for deaf users. In addition, it also meant that the product could be used without audio, opening up use cases such as commuting or getting a baby to sleep. 

Debate with facts not opinion 
We knew that adding subtitles to all videos would provide a better experience, however the product team challenged the decision due to the additional time and cost generating subtitles would incur. When I said that there was a BBC Accessibility Guideline that all video content must have subtitles, that gave weight to the argument and made the decision easier to prioritise.

Relationships matter
I wanted to have a close relationship with the external design agency and remove the barrier between companies as much as possible. Fortunately, Magnetic North were on the same page. We had daily video stand-ups to give updates and I made myself available on Slack for discussions and feedback with the designers. This led to a close relationship where we were comfortable giving honest feedback and iterating quickly. 

reflect

Credits

UX — BBC
Tom Killeen

Branding Agency
D8

 

UX Agency
Magnetic North

Development Agency
Softwire