Comments sidebar

Comments designed to work for all BBC brands and platforms

Role: UX Designer
Company: The BBC
Team: CBBC - Web


Context

Comments were launched in NewsRound in the early 2019. They were strategically important because one of the organisation’s primary objectives was to appeal to under 35. All products at the BBC were going to implement comments, both for under and over 16 audiences.

There was one problem: those designs didn’t work with the layout of the new article pages that would have gone live later in the year.

Task

I decided that I had to explore options for a new layout that would work across brands and platforms (web, mobile and apps) and choose the best option to put it in front of participants. It was important to understand what they thought about it and whether it was easy for them to use it.

Actions

I played with different ideas and none of them seemed to work. They all had in common one thing with the existing designs, comments were at the bottom of the page. After looking at comments of other digital brands I came across something that would have worked, The New York Times. The NYT uses a side bar for their comments. I decided to design a side panel for the BBC.

To design a side panel I tweaked and changed the designs until they worked visually. I gradually refined the visual elements and typography in it and found a way to have a fixed header. I then created a working prototype with Proto.io and used it in a UserZoom unmoderated usability test.

I structured the test so that participants would first use the prototype and then answer a number of questions around their attitude to commenting. They were also given a list of words to choose from to describe the experience. I run the test with 128 participants: 4 age groups split by gender for a total of 8 segments and 16 participants per segment.

Results

The screen recordings of the sessions showed how easy it was for most participants across segments to find comments in the article page, load more comments and close the panel. Their opinions on how they thought they looked and how it was for them to use were very positive. The top six words they chose to describe the experience made up over 80% of the words chosen. Engaged, Confident, Social, Comfortable, Calm and Expected were the words most participants were drawn to.

At this point I decided to run the exact same case study with the existing comments to compare the results with the first test. The response was quite different with negative comments on how it looked and how it was to use. I created a deck with the designs, the steps and results of both tests. My recommendations at the end of the deck were to explore the comments side panel with wider BBC teams a run a small live test to verify that the pattern wouldn’t have a negative impact on numbers. I presented the deck I put together to the senior stakeholders from the Children’s team, the Audience and Platforms team and the Moderation Services team. At the end of my presentation the audience engaged in a discussion over the possibility of implementing my designs.

Previous
Previous

SME banking app

Next
Next

Report module