Main content

Winter Olympics; a new approach to the Ö÷²¥´óÐã's live event coverage

Johnathan Ishmael

Lead Technical Architect, Digital Products Group

Tagged with:

Hello, I'm Johnathan Ishmael, a Technical Development Lead within Ö÷²¥´óÐã Sport in Salford. Over the past few months our team has been working on a project to deliver digital .

The aim was to build a platform for live events that can be easily tailored to suit a wide range of events, which we can continually iterate and improve over time to provide the best-possible experience across four screens - PC, tablet, mobile and connected TV. The underlying technology also had to be scalable across the Ö÷²¥´óÐã, giving us the capability to bring even more live events to audiences digitally.

You may have already seen this project in action during our Beta period from late November to the end of January through our new format Sportsday Live pages. We've been listening to your feedback during the Beta and improving the experience, as well as releasing new features.

I am pleased to announce that last week we took the product out of Beta for Ö÷²¥´óÐã Sport’s coverage of the Winter Olympics on 7 February.

Sochi 2014 on four screens

The following day turned out to be a big test for the new platform as our live Sochi, football and RBS Six Nations coverage helped drive a number of digital Ö÷²¥´óÐã Sport records on Saturday 8 February, including:

• 10.1m global unique users – the highest number outside of the London 2012 Olympic Games

• 7.3m UK browsers – again, the highest outside of London 2012

• 3.4m unique UK mobile browsers - highest ever, including London 2012

• 1.5m unique UK browsers on tablet - on a par with the previous all-time high on New Year's Day 2014

• Highest reach on Connected TV since the London 2012 Olympics with a 200% week on week increase

We’re delighted so many people choose to use Ö÷²¥´óÐã Sport's products during major sports events and we hope they enjoy doing so.

To give you an insight into our aims for this project, when we started out our aspirations were to create a live experience that could:

• Showcase a wide variety of content from around the Ö÷²¥´óÐã, including live video and radio, clips, statistics and live text commentary posts

• Deliver this breadth and depth of content to audiences in one place, faster than would have possible using previous technology

• Responsively deliver all web content to all devices regardless of screen size in a consistent user experience from mobile, tablet to desktop

• Use the same architecture to deliver content to connected TV and mobile applications

• Provide a re-usable and scalable platform that can be used to deliver live events across the Ö÷²¥´óÐã

The Winter Olympics is the first major event to use our new live platform. Here are some detailsÌýabout the technology behind the responsive website and some of the benefits it brings to audiences.

How is it different?

Unlike traditional web pages which are typically assembled by code (e.g. ) on a server, the new live pages are partially assembled by code on your device using . Your device receives a single stream of data updates (such as results and text commentary updates) and uses this information to draw the page.

As we don't send presentation information to your device we can update the page more frequently. Content such as results and live text commentary are delivered twice as fast as the old site, whilst keeping your data bills low. This allows us to provide a more timely second-screen experience as we can publish content into the page at the relevant point in the broadcast.

One further benefit of this approach is that we can select and interchange the items the user sees on the page; for example, a results table, a video or festival set list. This provides a powerful mechanism when covering live events as we can adapt the page at a moment's notice to show the most relevant content, all without the user having to refresh.

How does it work?

Using our in-house content management system a journalist builds a live page, giving it a title, image and duration. The journalist can also associate this page with an event or competition, as well as media such as television or radio shows. When loaded on a device the page then fetches the relevant data, for example video and scores. The page then continues to monitor for updates, so that any updates from the journalist appear straightaway.

For the technology we chose ,Ìý a JavaScript framework. The decision was made after a prototyping phase using different Javascript MVC frameworks including Ìý and .Ìý AngularJS works by creating custom tags within the HTML, which act as hooks in which to put the data.

AngularJS has a separation between the business logic code, which converts the data for the view, and the presentation code. Two way data bindings mean we update our data and AngularJS takes care of updating the HTML to match. Unlike some of the other JavaScript frameworks it requires no direct DOM manipulation. More information on AngularJS including code example and presentations can be found on the

To the future….

Over the coming months the team is working to create new features and optimise important aspects of the site, such as performance. The live platform has been developed as a framework that can be reused within the Ö÷²¥´óÐã, across even more live events and Ö÷²¥´óÐã products. We've got some amazing live events for Sport in 2014, including the World Cup, Wimbledon and the Commonwealth Games, and the Ö÷²¥´óÐã will be working to offer the same experience for a greater range of news, cultural and music events in the future.

I hope you enjoy our digital live coverage using the new live page,andÌýI amÌýalways keen to hear what you think, so please do leave a comment.

Johnathan Ishmael is Technical Development Lead, Ö÷²¥´óÐã Future Media Sport.Ìý

Tagged with:

More Posts

Next

Inside No.9: How we made The Inventors