In 2009, I joined the BBC News design team to be one of the leads in its fifth major redesign. Working in an agile team of product managers, engineers, designers and journalists, we were tasked with delivering an incredibly ambitious overhaul of BBC News, for both its UK and international audiences, and its internal editorial team of journalists.
BBC News’s online offering had evolved a great deal since its launch in 1997, responding to the ever-changing landscape of news delivery, the evolution of the world wide web, and the possibilities that better connection speeds opened up. In addition, the constant improvements being made to mobile devices, and their ability to serve up online content, meant that BBC News was looking to further deliver for its customers, and expand its reach to better engage with international audiences, specifically in North America.
daily users
Templates
Sections
Ad formats
At the time, the site was the number one news site in the UK, with six million visitors per day. However, competition was on the rise and international engagement was lacking. With so much to lose, the challenges with the redesign were vast. Not only had technology changed, the customer base and their habits were changing. Social media was altering behaviors in how people shared information, and journalists were looking to deliver engaging content, quickly, and in an increasingly competitive medium.
Broadband connections and higher quality video allowed for news consumption in a visual format (a clear competitive advantage for the BBC), a medium younger audiences had a voracious appetite for. International monetization, with the then Mid Page Unit (MPU) display ad was generating revenue, meaning that adding more advertising units to the North America facing site was a clear go-do.
Previous versions of BBC News
Commercially, the site was falling behind the competition in the range of advertising solutions it could support in its international instances. In highly competitive markets this was a disadvantage and impacted the ability to deliver the expected reinvestment back into core BBC services. The need for more flexible relationships with premium advertisers, at the time, was acute as the pressure on the display-ad market increased. The role of the BBC News site internationally was not to attempt to be the first choice news destination within a given market but to provide a unique global perspective and become a more valued part of the users overall online news portfolio.
Competitor analysis
Research showed that two thirds of those surveyed said the ideal role of BBC News was to ‘help make sense of the world as a global citizen’. In the United States, a quarter of those surveyed stated that the BBC News website helped them make sense of the world as an American—i.e. why is this happening to me / impacting on me.
The research also noted there was an appetite to cover American news through a prism of international perspective. More than half of respondents said that they would read BBC News more often if it had more commentary/opinion/analysis of US news from an international perspective.
For the UK audience, front page and index layouts were not meeting the needs of editorial teams and therefore not delivering the best possible experience for the customer. Insights showed that there was opportunity and appetite for better use of imagery, clearer signposting, promotion of the best high-value, original content, and improved layout flexibility and volume of content in the top half of the page.
Further adding to the project complexity, the BBC was going through further iterations in aligning its sub-brands, bringing consistency to its ecosystem with its Global Visual Language, which, as part of the advisory team, I was helping put in place. Internally, technology was changing with major updates to the Content Production System (CPS) which meant both engineering and journalists, both in BBC News and BBC Sport, were in a state of flux. All this made delivering our vision, on time, even more ambitious.
At that time, our vision was:
'Deliver a world class, news experience for people looking to access the latest, highest quality journalism, and exposing the full range of our content offering. We will enable our UK audience to get better value from their license fee and for our International sites to build reputation and increase revenue, providing a more tailored news offering to the largest audience the BBC has outside of the UK. The international Edition will meet the need of US customers to more clearly explain world events, and their impact on the US, as well as providing a clearer insight on how events in the US are perceived around the globe.
Of course, accompanying this vision, there were a number of tactical requirements that I won’t list all of here but, included were:
The list goes on…
With our vision in place and the changes happening across the business, the team underwent a rigorous process, going through extensive behavioral data from UK and US audiences. We were able to discern the path that customers were taking and saw a clear divide in behavior.
Through our research, we saw that we had two clear groups of customers. One group, we named Skimmers, would literally ‘skim’ the news of the day, often arriving directly on a story page (25%), digesting the essence of the main story. After reading (not always all of) the story, they would navigate through the Most Popular stories section (50%). Once done, Skimmers would leave without ever seeing the breadth of content on the front page or indexes.
The second group were what we called the Diggers. This customer would devour stories, finding the best of the day and the rich, original content we offered, reading articles all the way through, and digging deeper on subjects of interest.
Other insights that surfaced was the recognition that there was a need to focus on live and breaking news, keeping users engaged for longer. Our audience were looking for improved imagery, and our journalists were looking for better ways to display them, allowing us to consider more visually engaging layouts and hierarchies, as well as be more intentional around using video over text when delivering stories.
With my focus on the front page, information architecture for the site navigation, Index and Media pages, and with two clear archetypes in place, we set about interviewing key stakeholders—from product leaders to newsroom journalists—in order to understand their expectations and requirements, we created personas that characterized the sub-types of customer that we found within the Skimmers and Diggers, and user stories that we later pressure tested explorations through.
We went deep into competitor analysis of news sites, both in the UK and from around the world. Although we were enjoying the top spot as the number one news site in the UK, we were noticing that other agencies were starting to offer innovative and elegant ways to deliver the day's news. Analysis showed how customers would be funneled around sites, where breadth, depth, live and breaking were peppered in to keep customers engaged and how ad units were, in some cases, elegantly integrated.
We explored how and when video was incorporated and what video destination pages offered. Again, with a clear competitive advantage in news video, our goal was to showcase the best video content available, including flexibility to suit particular audiences and market requirements. However, the challenge was to find the right balance between increased promotion of video and the fact that the majority of users still wanted their news experience to be predominantly text based.
This analysis helped us in going broad with our explorations, taking elements that we liked and applying them to our own rough concepts, even going so far as to take non-news sites that we admired and do our own verisons for BBC News. This allowed the team to push the envelope of what was perceived as possible and challenge the beliefs of internal stakeholders.
Pitchfork
Pitchfork inspired News
'Going broad' exploration
Although not seen by our core audience in the UK, display ad units dictated everything about the layout of our templates. As crazy as this sounds, this was the only way we were able to tailor our grid system and templates to allow for the pages to house the required content and flex to incorporate multiple IAB (interactive Advertising Bureau) and OPA (Online Publishers Association) ad formats. The wide array of sizes, placement requirements, and animations that the units encompassed made template creation incredibly difficult. After many iterations to the grid, we were able to create an underlying column structure that catered to all content and ads, with little negative impact on our core customer base.
The global navigation was a huge undertaking and one that I found incredibly challenging. The information architecture of the site was to remain relatively untouched but the move from a left-hand-nav to a horizontal nav was a project unto itself. This decision was part of a move to both modernise the site and align with a broader move in the BBC to systemize navigation structures, providing the customer with a consistent experience across the multitude of offerings.
There is a great deal of history behind the labelling and structure of the BBC News navigation. In essence, the names were a direct representation of the desks of the journalists that reported on those areas. As archaic as this sounds, the structure made sense to our audience and was replicated by many of our competitors. However, the move to a horizontal version that needed to be scalable and intuitive was quite the fight. Subjective, internal opinions often caused issues but customer data and research was used to bring about resolution.
Multiple sketches, wireframes and designs were pressure tested, taking into account the varying ad units that would need to be housed inside the top section of the page and flexing to incorporate secondary sections and in-page navigation.
A few of the many navigation explorations I worked on are below.
Layout explorations
Front Page and Index templates was an area where we were able to go broad. Using our analysis from competitor research, and the existing pages (the sections of which needed to be ported over, in most cases), we went deep on considering a systemized approach to the key requirements.
These requirements meant that we needed to be intentional in systemizing each element, ensuring it could deliver for both of our customers—journalists and our users, flexing gracefully around ad units and increasing engagement, highlighting the incredible breadth of content that many customers were missing out on.
Of course, we wanted to cater for both Skimmer and Digger archetypes but the intent of the Front page and indexes was to showcase the breadth and ever-evolving news cycle. A key area that we needed to get right was with the top three stories. These needed to be able to flex to allow for the visual hierarchy, or ‘Volume’, to change. In the old site, the top three stories would stack hierarchically but, if story two had updates or media rich content, journalists were unable to highlight this. With the redesign, I systemized the top three stories area to cater for various sizes and hierarchies. This allowed journalists to make calls on what the focus should be, allowing for flexibility they had not had before, drawing the customers eye to content that was more engaging or more up-to-date. Similarly, we introduced a carousel in the top right of the index pages to highlight video, drawing younger customers into a video-rich world of news.
As mentioned, there was a great deal of work going on (and a sizable working group from across the business, of which I was a part) that was looking at bringing cohesion to our core offerings. Neville Brody, the highly respected designer, and his Research Studios, was asked to look at bringing a considered visual language to the BBC and News was the first candidate given the Brody treatment. As one of the lead designers on News, I was lucky enough to work alongside Neville’s team in his studio, advising on our customers needs and helping iterate the language that paved the way for BBC News and the BBC as a whole. Brody’s approach was to bring bold, strong type treatments, crisp and uncluttered layouts and remove the gradients and textures of Web 2.0, removing unnecessary visual noise from the customer’s experience.
With constant validation, iteration and an exhaustive style guide I crerated, BBC News launched on time and, although initially criticized by its incredibly critical audience, it saw a rise in adoption, with site visits increasing immediately and rising year-over-year.
Home
Story
In the year of the release, we were nominated for the People’s choice award at the Webbys. We won the .Net Magazine Award for best redesign and the following year saw our fellow journalists take home the 2011 General Excellence in Online Journalism award. Being part of this work, learning from and being inspired by incredibly talented people is something I will never forget.
But, it didn’t end there. We didn’t stop. We continued to iterate and push. BBC News won the Webby for The People’s Voice award in 2012 and the team has continued to deliver incredible innovations since.
March 2020 saw record figures for many news outlets but the figures revealed that the BBC’s online portals attracted the highest number of daily visits during the peak of the recent coronavirus pandemic in March and April 2020, outperforming its closest competitor, CNN.com, by 36%.
Data from ATI also confirms that bbc.com had it's highest ever monthly traffic in March 2020:
© Dan Shallcross 2021