StubHub Finds Ticket to Effective Digital Asset Management

As StubHub evolved from a lightweight website to one that was rich with images, videos, and custom views from seat locations at event venues around the world, it sought a way to streamline image management. The company implemented Cloudinary, which enabled it to significantly reduce the time required to manually edit images, while ensuring that the key focal points of each image were viewable in more than 30 viewports on a multitude of devices. Cloudinary’s digital asset management (DAM) capabilities also helped StubHub better protect its content. The StubHub team created a single repository that ensures developers and designers have access to the most current images and understand brand guidelines.

ABOUT

StubHub

StubHub is the world’s largest ticket marketplace with tickets available for more than 10 million live sports, music, and theatre events in 40+ countries. The company enables experience-seekers to buy and sell tickets whenever and wherever they are through its desktop and mobile interface. Owned by eBay, StubHub reinvented the ticket marketplace in 2000 and continues to lead it through innovation. StubHub’s industry firsts include the introduction of the ticketing application, interactive seat mapping, 360-degree virtual views of seating, innovative price recommendation technology and an algorithm that determines the best value on tickets. StubHub has expanded into more than 40 additional markets with the acquisition of Ticketbis in May 2016.

THE CHALLENGE

Optimizing Digital Assets for Image-Rich Site

When Susan Stieglitz joined StubHub in 2015, the site was lightweight and had few images associated with the events being promoted. As Head of Imagery, Stieglitz was tasked with making StubHub’s portal more visually engaging, as the company expanded into more than 40 countries around the world.

That’s where the challenges began. First, she had to ensure that the photos, video, views from seats, and virtual views could be easily accessed and properly displayed on multiple devices, such as desktops, tablets, and smartphones, and from more than 30 different viewports. Stieglitz also had to address digital asset management, since StubHub worked with licensed content from partners and often had requests by third-party marketers to use the site’s images.

StubHub also had to contend with the sheer scale of managing more than 120,000 active events on the site at any given time, and between 800 and 1,200 new ones published every day. StubHub’s catalog included more than 54,000 entities with multiple images that needed to be selected, edited and updated continually.

“Delivering quality images at scale is a daunting task, particularly since our catalog has a single image for each event, that we need to ensure displays well across all viewports,” says Stieglitz. For example, an image of Billy Idol cropped to look good on a desktop might end up showing only his armpit when viewing it from an iPhone, or Pink’s face may be cut in half when moving from a laptop to a tablet.

“All of our images required manual editing, severely limiting the potential for innovation in experience design,” she adds. In 2017 alone, Stieglitz’s team manually edited more than 17,000 images in Photoshop to fit in the event cards in the desktop design, which was then used in native and other viewports. “We prioritized editing for a desktop view, so the images may or may not look good in other viewports.”

When getting images from partners, like the National Basketball Association, National Football League, or others, the StubHub team also wasn’t sure which image to request, since they needed one that would look good in various shapes, including checkout, review and buy, grouping pages, desktop banners, event cards, native apps, and the mobile web.

And finally, Stieglitz notes, it wasn’t just about the way images displayed. As they did a deeper dive, the StubHub team wanted to improve the overall user experience by making the images as small in size as possible without any perceptible loss of quality, so the site would load faster.

THE CLOUDINARY SOLUTION

Versions for Every Viewport and Improving Access to Media

Cloudinary enables StubHub to use one high-resolution source image, then optimize it in endless end-user configurations with simple parameter changes. Cloudinary dynamically selects the most efficient format, based on the end-user’s device and browser. The solution also optimizes images so StubHub pages load three to four times faster, which is particularly important as StubHub has moved into international markets where devices may be slower or broadband access less prevalent.

Facial recognition capabilities in Cloudinary also ensure that dominant face(s) stay within all viewports, while images that do not include faces can benefit from edge detection and entropy detection. “These features ensure that we deliver the important part of the photo, no matter the viewport,” adds Stieglitz.

Other Cloudinary features that StubHub has found useful include:

• Transformations that teams use to apply artwork styles, incorporate logos, remove backgrounds, and add tints, color enhancements, or borders.
• URL customization to improve SEO ranking with meaningful image file names within the URL.
• Analytics to learn where end-users are clicking.

StubHub also uses Cloudinary’s platform for digital asset management. Through Cloudinary, StubHub can maintain better control over partners assets, host brand identity guidelines and logos, provide buildable templates for asset creation and establish permission-based folders with access determined by group roles and individual user types. Cloudinary’s digital asset management capabilities enable StubHub to have a single location where it can keep all updates in sync and add metadata to images to identify protected assets.

“Cloudinary has created a no-fail, self-service system for brand, partners and event teams to use our content correctly,” notes Stieglitz. “This is critical. Our images previously were not safe, because they were available through an open developer portal accessible by anyone with an API key.”

THE RESULTS

Improved Image and Page Load Times

Using Cloudinary, StubHub was able to reduce an image of Tim McGraw from 1.2 MB to 8kb, significantly improving page load performance. Similarly, StubHub reduced an image of Shakira from 25kb to 10kb, speeding download from 336ms to 51ms.

On average, StubHub achieved page weight reductions of up to 60%, and improved image load times by up to six times.