Interactive touch screen: displaying travel, weather and social media for live broadcast

London Live - Building the digital patform

London Live is a British television channel, launched at 6:30pm on 31st March 2014. Combining London news and entertainment, it is broadcast on Freeview channel 8, satellite, cable and online.

The challenge

With just six weeks before launch, and the new studios completed, the London Live team were able to start running pilots for their live morning, lunchtime and evening news programmes.

At this point, it became clear that the broadcast graphics system Chryon, would not easily be able to deliver the level of interaction needed to support the desired experience when presenting live travel, weather and social media.

The brief

In order to support the live morning, lunchtime and evening news programmes that were being launched, we were commissioned to develop an interactive studio screen.

This would take all the integration points we had already completed for the web (tube, rail, traffic and weather) and bring these together into a set of screens that the presenter could interact with.

We had just three weeks to design and build this

After that, a complete lock down of the studios, software and systems was planned, ahead of launch.

an image
Running daily iterations on site
an image
Testing camera angles

What we made

Given the extremely tight timescales, following each morning pilot, we ran daily on-site iterations at 9am with the London Live news teams, producers and presenters to rapidly develop the screens.

We started by looking closely at the fonts and colours that would be used, as these can change significantly when broadcast to a TV screen.

Testing inital ideas for a cover slide
Testing our inital ideas for a single data point
Testing our inital ideas for multiple data points
Testing our inital ideas for traffic information

The final slides

We then went through a series of daily on-site design iterations with the London Live news teams, producers and presenters to rapidly develop the screens.

The cover slide for a weather broadcast
Presenters can select any day or day part and the information to present
Travel information covers road, rail and underground
Social media slides can be presented
Financial information covers currencies, indicies and individual stocks

With different presenters having their own style, we then went on to look at how the information could be flexibility presented. This included developing the ability for presenters to queue up various combinations of screens into different running orders. This would be used to allow different bulletins to be dialled up at a moment’s notice, for example should the production team have to cut back to the studio quickly from a live outside broadcast.

This meant presenters could at any moment walk across the studio and interact with the screens – and would that the screens would need to support both touch gestures and a hand controlled clicker.

Testing the screen interaction

The result

The resulting studio is now used every day as a core part of the breakfast, lunchtime and evening and weekend news programmes.

What the team have been able to bring together in just few weeks before launch has been incredible.

Vikki Cook – Head of News and Current Affairs, London Live

“If you look at what is possible with the latest web technologies, you will see a user experience is that is both highly interactive and visually rich. This exceeds anything done on TV to date.”

Bryn Balcombe
Head of Technology, London Live

Find out more

Contact us today and arrange a free consultancy session to find out to launch a new best-in-class digital product or service

Read next

Case Study

Building the digital platform for London’s newest television station

A mission critical launch, no existing infrastructure, and six months to do it

Case Study

NearDesk: An innovative service for flexible working

Launching a new business model to enable flexible working across a network of 250 venues

ArticleTechnology

React - Best practices for structuring Reactjs applications

We share our best practices for developing react single page applications