Liveblogs. Pinned posts

The Guardian has paved the way on liveblogs and was one of the first newspapers to support stories in this way.

The new Journalism team was set up in Q3 2021 and tasked to bring together the expertise of Editorial + Product & Engineering and deliver world-leading, innovative products. The first area of focus was liveblogs with a key events filter and pinned posts.

The challenge
In a fast-paced news environment, we realised readers were having some trouble orientating themselves in liveblogs. Allowing our editors to pin a post would allow us to select content that would relate to the latest updates or the headline and solve that challenge.

The final design allows for the pinned post to collapse and cover only a small % of the screen. This is to allow readers to see that live updates are still coming through under it.

We also made the decision of duplicating the pinned post, placing it both at the top of the blog and in its original context.

Design-wise a banner at the top and changing the border were enough to indicate the difference of this post vs. the following ones.

 my role

I worked across two teams on this project:
→ As the lead product designer in Editorial Tools
→ In collaboration with a researcher and designer in the Journalism side

On the Ed Tools side my responsibilities included:
→ Wireframing, designing and prototyping the flow and toggle to allow a post to be pinned
→ Demo and user testing sessions with the digital editors
→ Speccing and snagging the designs once implemented

On the Journalism side:
→ Work on quick designs and prototypes alongside the other product designer in the team
→ Research support on qual research sessions

For the CMS side of things the template looked very much the same as before, except:
→ We added a pinned block space at the top of the list of blocks (which is how posts are called in the tool)
→ Added a toggle next to the space where the liveblogger decides what kind of post they will be writing (regular, key event or summary). The decision is made at the same level despite having another toggle at the bottom of the block.
→ Added a prompt when editors try to pin a block and something is already pinned. This will warn them about the change they are making as to what will appear at the top.

Research

10 unmoderated testing sessions
→ in UK, AUS and UK
→ both users and non-users of Guardian liveblogs

Amongst the main insights gathered are:
→ Collapsing and expanding posts was key. This allowed them to see that the blog was still being updated under the pinned post, which was a big challenge.
→ There is a need for standardising the amount of content that appears in a pinned post. There is such a thing as too much content in a single post.

ed tools team

PM: Calvin Dickson
Product design: Ana Pradas
Engineering Support: Jon Herbert

Journalism team

GPM: Abi Bendall
PM: Max Walker
Scrum master: Huma Islam
UX Researcher: Georgia Ellis
Product design: Zeek Ikomoni, Ben Wuersching and Ana Pradas
Engineer manager: Alina Boghiu
Engineers: Anna Beddow, Joe Cowton and Marjan Kalanaki
Data Analyst: Anthoni Mangeri
Head of Editorial innovation: Chris Moran
User feedback: Paolo Castro