Problem Statement

When bringing in public service design for post stream, copies length in different language services for “Breaking news” and time stamps are various, and some are long. The current design in public service did not include this cases for the feature phone (Breakpoint 0-239px). We need to make sure experience work well across our breakpoints, and still matching the BBC brand.

Discovery


Gathered world service copy examples for “breaking news” and how long they would be in different services.
Catch up with editorial team and product team to understand how they use different labels, including ”breaking” and “new”; define priority for MVP

Talk to our business analyst to understand timestamp logic in world service.



Explore new design approaches

By understanding world service needs from different conversation, I decided to divide label into 2 lines for Breakpoint 0-239px, time stamp and breaking new, which will to avoid misorder problem risk, same logic will apply to other break points if there are too many text.

I mocked up some options with different languages for the smallest breakpoint as it’s the key concern for us. I shared them with our UX team to get feedbacks and we made decision on the option 3 as the spacings remain the best balance for the text.





Deliver

While delivering final design and specs to the product team, I set up a documentation to help engineers understand how the post label logics works.
I also host the UX/Accessibility session with our Accessibility lead and champions, to check the screen reader UX I wrote are all correct for our audience. Although I am the UX designer in this project, I tried to understand how the screen reader UX works by coding different roles up in HTML so I can test them before it get built.



Other challenges and how I approach them


This component was built with all different process we went thought with our team, and as the main component for the Live page, it help the product team and editorial team to visualise and understand how the new Live page will look like and how can they work with it later, which is a big move for this project.

Some corss-team effort and impact also happened when I was delivering the project. There is a chance that Sometimes editorial team publish page without any opening post and some users might. Page with no opening post might make user feel the page is broken or not loading. Therefore, I also work with Lauren S (UX Architect & Content design supporter) to draft some opening post templates and propose them with Kevin B, UX designer for Tipo so he knew there is some improvement they could do for the digital publishing platform.

Default template for editorial team; also suggest to the editorial team on not publishing the page before the first post.


Feedback and outcomes

“The team are really happy with the design. 
They find it better looking than old live pages” 


from BBC World Service editorial team


Our first new platform-powered Live page went live in Febuary this year in Language Burmese, and the feedback we received from our editorial team about the page was very positive. The MVP version has now gone live in a couple of services, like BBC Burmese, BBC Igbo and BBC Urdu etc.



Current Live page example on BBC Burmese


Current Live page example on BBC Arabic





Traffic during Indian election


This new Live page not just brought editorial more options to visualise their new stories, more importantly, it offered great help during the 2024 Indian election period, which drove good traffic to our five main services in India, including BBC Hindi, Marathi, Telugu, Tamil and Punjabi.