Introducing the Red Bull Racing TAG Heuer Race Station

Comment

Introducing the Red Bull Racing TAG Heuer Race Station

Background

We approached Red Bull Racing several months ago with our take on a Live Race Hub. The concept was loved and in partnership with TAG Heuer, the Race Station was born. There were a few design iterations along the way, culminating in the final Red Bull Racing-supplied designs, as well as some investigation into the best way to get the lap time and track position data displayed in as close to real-time as possible - we looked at using data from FOM (Formula One Management), the team’s own telemetry, and finally settled on a manual input form in the platform.

Near Real-time Data Feeds

The Race Station takes full advantage of many of the key features baked into our platform:

  • Ability to consume multiple data sources in a single module
  • Event-centric page states, including multiple ‘sessions’
  • Context-awareness to provide current vs historical content

Over the course of a weekend, the Race Station consumes data from the following sources:

  • Ubimet - weather forecast and actual weather
  • ScribbleLive - the live commentary feed
  • Perform - race results and driver and constructor standings
  • 3 manual data input forms for:
    • Live lap times, position, tyre choice and pit stop information
    • ‘Mood in the Garage’; a light-hearted update on how the team are feeling ("Pumped and Excited" is a common update!), plus a couple of emoji to get the point across
    • ‘Key Moments’; a scrolling ticker which allows Red Bull Racing to pull out the key moments in the race and give them extra prominence

All of these sources are updated every few seconds and active user sessions poll them depending on which tab they’re currently viewing. We also restrict the commentary response to new or updated items since the last request. This way, the frequent requests are kept as light as possible, eliminating redundant information that the user is not looking at and improving efficiency, particularly for users with low bandwidth such as slower mobile connections.

Design and Development

In line with the main website, the Race Station is fully responsive. This ensures all key functionality and the general look, feel and hierarchy are consistent across all devices, from a mobile phone up to a high-definition television.

The most recent user analytics revealed that the vast majority of visitors to the website use modern browsers, so we were able to drop support for IE9 and older and focus our efforts on using the latest techniques to provide the best experience for modern browsers like Chrome, Firefox, Safari, IE10+ and Edge. For example, all the icons and graphics use vector imagery to ensure a small file size for each asset while giving a crisp look regardless of the screen resolution.

Rapid Data Entry

The public-facing site wasn’t the only part to get attention - the manual data entry forms needs support for rapid, frequent entries as a session progresses. All 3 data entry forms were produced using AngularJS, a popular framework that includes 2-way data binding. This means that any updates made in the form are instantly updated in the database and vice-versa without reloading the page.

The lap data form has been developed to ease the entry process as much as possible. You can tab through the fields swiftly and it has some smart defaults whereby it automatically fills with the data from the previous lap entered once you select a driver allowing you to quickly update the time and add a new entry.

Conclusion

Take a look at the Race Station here and look forward to seeing it in action during the next event!

Comment

Wallpaper Downloads

Comment

Wallpaper Downloads

Formula 1 racing has always been a loud and exciting sport, not to mention a very visual and photogenic one. Wallpaper images have been very popular, for almost as long as there have been computers! A recent project for Red Bull Racing and Scuderia Toro Rosso has brought these two elements together - making some excellent F1 photography available to fans worldwide, in a multi-lingual, multi-device, and easy to administer way.

Visit http://www.redbullracing.com/downloads or http://www.scuderiatororosso.com/downloads and you'll see the new and very attractive 'Downloads' pages, showcasing some very cool F1 photos.

Perhaps it's the desire to customise gadgets and computers, or the fact that most people can always just appreciate a great image, but providing high quality wallpapers also gives people a great way to identify with something that they are passionate about at a personal level, and show their commitment.

That said, we are now so far away from the days when people typically needed one of only a few sizes for their wallpapers - these days, options range from high resolution retina screens, multiple aspect ratios and pixel densities, across desktops, tablets, phones, and even other devices such as Smart TVs. It was therefore important that we consider both the website visitors' and the content editors' needs here and made it easy to upload and download a range of image options.

The solution that we have implemented is really easy to use from both sides. Available downloads (each has an availability date range in the CMS as well as the typical 'published' option) show on selecting a download which sizes are available. Downloading the image to your device is as simple as selecting the right version in the dropdown and pressing the download button. Popups and dialogue boxes are as minimal as possible if any appear at all (not all devices work the same way sadly), so the page does not come between the user and their desired image.

On the admin side, we use a 'field collection' user interface element to simultaneously add or 'upload' many images to one item in the CMS, making it very quick to add multiple images in one go.

Because the downloads page supports as many downloadable wallpapers as are available, via a simple and attractive grid, we've made it easy to highlight new or particularly exciting images by including a 'featured download' panel. This is easy to control in the CMS by just adding the 'Featured Download' tag when setting the wallpaper up. Any wallpaper can be chosen and previewed 'full screen' from the featured download panel in order to take a closer look.

We even included support for multiple languages so wherever people are around the world, the download page offers a friendly and experience - as well as some truly stunning and atmospheric moments from Formula 1!
 

Comment

WhatsApp sharing

Comment

WhatsApp sharing

The line between Social Media and Instant Messaging apps is becoming increasingly blurred these days, and that’s never more true than in the case of the increasingly popular ‘WhatsApp’, which has long been geared up to providing people with simple, personal, messaging in real time (their words, not ours!).

Comment

Tickets / Sold Out Messaging

Comment

Tickets / Sold Out Messaging

For some time now, a number of Red Bull platform sites have had a ‘ticket outlet’ type of content in the CMS. These ticket outlets feature such details as a logo, link (usually to an external site where tickets can be purchased) and other important details. They can even be tailored and assigned to specific geographic locales.

Comment

WebTranslateIt

Comment

WebTranslateIt

Throughout the Red Bull Platform there are many ‘snippets’ of text that fall outside of the CMS usual article, gallery, athlete, video and event content types, among others. A good example would typically be the results pages, where there are many excerpts of text that must be correctly translated.

Comment

Pilot Quotes in the CMS

Comment

Pilot Quotes in the CMS

The Red Bull Platform CMS has always been very open ended and customisable by Blueleaf, in order to suit the specific needs of each website. This is particularly important when it comes to making it easy for content editors to enter certain types of content efficiently in large volumes while at the same time making that content really easy for people to find and enjoy.

Comment

Air Race Banners

Comment

Air Race Banners

The homepage, ‘News’ page, and 'Event' pages are among the most important pages on the Red Bull Air Race website. This is particularly true during an event, when people browsing the website are looking for relevant and interesting content to accompany the action.

Comment

Search functionality

Comment

Search functionality

One of the most exciting pleasures of working on the Red Bull platform is being able to make a real difference to User Experience, not just for one website but often across several, with a single codebase update. 

Comment

Live Page Functionality

Comment

Live Page Functionality

The way that we choose to experience digital media is always evolving, particularly Social Media, streaming video, and countless other digital tie-ins to real world events are more than prevalent in 2015; they are generally essential - and an expected facet of the event experience.

Comment

Homepage Featured Content / Bar

Comment

Homepage Featured Content / Bar

The X-Fighters website design has included homepage Featured Content items for some time now. These items can be fully managed from within the CMS, and appear in a vertical list next to the homepage lead item - super visible and right in a visitor’s field of view.

Comment

Social Engagement using Wayin

Comment

Social Engagement using Wayin

All Red Bull sites have the ability to use Wayin to increase social engagement, and we've implemented it in a number of different ways, on Cliff Diving, Red Bull Racing and X-Fighters.

Comment

X-Fighters About Page

Comment

X-Fighters About Page

How can you present important information about a sport, in a compelling way, without overwhelming the viewer? Take a look at the X-Fighters About page which does a great job of displaying facts, statistics and videos.

Comment