Cloudinary Blog

Bleacher Report Scores with Real-Time Video Highlights Delivered by Cloudinary

Bleacher Report Scores with Real-Time Video Highlights Delivered by Cloudinary

Bleacher Report is a global digital destination for sports fans, creating and collaborating on content at the intersection of sports and culture. Owned by Turner, a division of Time Warner, Bleacher Report's website and social channels focus on sports culture for the next generation of fans. Bleacher Report also has a five-star mobile app and popular email newsletters, which are part of the company’s strategy for instantly delivering in-depth articles, results and video highlights personalized for users’ favorite teams, players and leagues.

The Challenge: Delivering Video Highlights in Real-Time Via the Web and Mobile App

Bleacher Report was seeking a way to further enhance its content offerings by delivering short video highlights while games were still in progress. But with nearly 85 percent of users accessing Bleacher Report content on mobile devices, the company needed to ensure that short video highlights could be created quickly and streamed flawlessly, regardless of the viewing device or bandwidth.

"Sports highlights are valuable to fans, but delivering these videos can be a significant challenge given the diverse ways fans interact with our website and mobile application,” said David Marks, senior director of Engineering for Bleacher Report. “We wanted to make sure that our users had an optimal experience, no matter if they were in an arena, riding the bus, watching games at a local bar or on a computer in the comfort of their own home.”

Delivering video content to users across different devices is not a trivial task. To do so, Bleacher Report would have to manipulate and optimize each video to suit every viewing device, viewport and bandwidth.

"Another challenge we faced was the speed at which we could get the content to our users,” said Marks. “Delivering highlights during game time is crucial to Bleacher Report as that’s when our users are hyper-engaged. The manual approach just wasn’t efficient enough for us to achieve the necessary speed to market.”

The Cloudinary Solution: Automating Video Optimization and Distribution

When the development team began to work on its video highlights offering, Bleacher Report had been managing images with Cloudinary for nearly a year. The Cloudinary solution offered a rich feature set that Bleacher Report used to optimize and manipulate images by simply changing the parameters in the image URL, and deliver them responsively to users – capabilities that were not possible with the company's homegrown image management system.

“With our previous system, it was a challenge to create images for every device, browser, resolution and bandwidth,” said Marks. “We wanted a solution that would enable us to do that without having to think too hard about it. Cloudinary was a perfect fit, quickly integrating with our backend systems and enabling us to improve page load time, which was critical for our mobile users.”

After seeing how quickly and easily integration and implementation was for the image solution, Bleacher Report decided to extend its relationship with Cloudinary for video management, as well.

Bleacher Report automatically extracts interesting moments from the live footage based on specific criteria. The raw file is then uploaded to Cloudinary, which processes it in real time to deliver a video, enhanced and optimized for viewing on any browser or device, at any bandwidth.

Behind the scenes, Cloudinary eliminates many of the technical complexities that content producers like Bleacher Report experience when trying to optimize the video experience. Cloudinary automatically adapts the video resolution and quality, transcodes it into a streamable format, implements adaptive bitrate streaming and delivers the videos through a fast, reliable content delivery network. This ensures that viewers experience a smooth playback irrespective of device requirements or internet connectivity.

The Results: Speed to Market and Increased Video Viewership

Cloudinary’s seamless integration and ease-of-use accelerated the development process, enabling Bleacher Report to go from concept to an automated video highlights offering in under five weeks.

"Speed to market is paramount for our video highlights solution, and it was a huge consideration in choosing to work with Cloudinary for this project," said Marks. "Not only were we able to implement the full solution in a matter of weeks, we are now able to deliver sports video highlights within minutes."

Though just recently implemented, Bleacher Report is already seeing a 25% increase in total video views per month, and a 350% increase in video views within their gamecasts experience. In addition, Bleacher Report said that it has been able to increase its monthly 3-second video views by 35 percent and grew the monthly highlight video views in the app by 20 percent.

“We initially looked at Cloudinary only through the lens of image management. But we also were able to learn a great deal about how they could support our video requirements,” Marks concluded. “As opportunities and new ideas have arisen, we've taken advantage of what Cloudinary can offer on the video side, as well, and achieved significant benefits.”

Download Case Study here

Bleacher Report Case Study

Recent Blog Posts

How to Make Boomerang Video Effect With Cloudinary

When you see the term boomerang, what is the first thing that comes to mind?

A thrown tool made of wood that returns to its thrower? Another definition is reversal, logically portraying the aim of the tool itself. Based on this definition, the term boomerang videos” came into play to depict videos that loop back and forth.

Read more
Shortening the Development Cycle of Media-Related apps with Cloudinary

Currently, the Android platform boasts the highest demand for mobile solutions, as evidenced by Google’s announcement in 2017 that there were two billion monthly active Android devices, a number that is likely to increase in the years ahead. For app developers like you, now is the right time to build and release solutions for Android. you might have also noticed that a higher percentage of apps being developed nowadays are filled with visual media: images and videos.

Read more
Build Your Own Image Storyboard Android App

Globally, approximately two billion people now own smartphones, which also feature cameras capable of capturing photos and videos of a tonal richness and quality unimaginable even five years ago. Until recently, those cameras behaved mostly as optical sensors, catching light that determines the resulting image's pixels. The next generation of cameras, however, can blend hardware and computer-vision algorithms that apply to an image's semantic content, spawning creative mobile photo and video apps.

Read more
Cloudinary Delivers Simplified Image Management Workflow for Fairfax Media's Digital Transformation

Fairfax Media Limited [ASX:FXJ] is one of the largest media companies in Australia and New Zealand that engages audiences and communities via print and digital media. It includes recognizable mastheads including The Australian Financial Review, The Sydney Morning Herald and The Age. Fairfax Media operates numerous news and information websites, as well as tablet and smartphone apps, for online news sites.

Read more
Best Practices for Responsive Web Design

Responsive design turns 8 this year, and to celebrate, we asked experts from across the web industry a simple question: what does responsive design mean to you and your work, in 2018?

I’m fascinated by their answers. As many state, the technical aspects of responsive design – flexible grids, flexible media, and media queries – are more-or-less well understood, eight years in. But those simple-sounding ideas about CSS are still having far-reaching effects, which extend far beyond code. Below, you’ll read about responsive design’s impact on how individuals, teams, and entire organizations work and think. How should we model our content, now that it is responsively adapting to fit new and different contexts? How in the heck should we be prototyping and testing responsive designs? How can our teams and workflows be structured to better accomplish this new kind of work?

Read more