Cloudinary Blog

Reformation Designs Engaging Shopping Experiences With Cloudinary

Reformation Designs Engaging Shopping Experiences With Cloudinary

Reformation is a Los Angeles-based fashion brand that designs and sells sustainable, eco-friendly women's apparel and accessories in a small fraction of the time that more traditional fashion houses take. And while the company runs several brick-and-mortar stores across the United States, its business is conducted mostly online, with over half of its visitors accessing its content on mobile. A major challenge Reformation faced was how to display images and videos optimally for every user and device. Enter Cloudinary.

With Cloudinary, Reformation was also able to simplify its media workflow, deliver a much-enhanced shopping experience, and boost its conversion rate. Specifically, the company—

  • Reduced its overall page-load time by 31 percent.
  • Shrunk its image payload by 60 percent.
  • Lowered the bounce rate by 67 percent.
  • Raised its Google PageSpeed score by 26 percent.

The Challenge: Limited Control Over Rich-Media Experience

Reformation’s eCommerce site is where visitors can look through multiple images of the latest designs and make purchases. The company works on a tight schedule for producing images—typically only three days—from photo shoots to launch.

Before adopting Cloudinary, Reformation served images through Workarea, its eCommerce platform, and generated thumbnails with a customizable RubyGem. Issues abounded, however.

“There were problems that we didn’t even realize were problems,” recounted Jessica Chappell, director of product management at Reformation. “We were delivering the same image to customers shopping on a desktop and to those on mobile devices but not on WiFi.” Quality and bandwidth glitches were the norm.

As for videos, frustratingly, integrating clips through Vimeo produced unsteady playbacks.

The Cloudinary Solution: Optimized Image and Video Delivery

In October 2018, Reformation integrated Cloudinary into its workflow. After the creative team has uploaded the images to Cloudinary, the development team regularly identifies them with a cron job, which then creates the database connection for upload to Reformation’s Amazon server. Behind the scenes, Cloudinary uploads high-resolution originals and delivers an optimized, responsive version to visitors, on desktop or on mobile. The turnaround is speedy and seamless.

Additionally, Cloudinary eliminates the manual task of specifying breakpoints for the Reformation site’s images by automatically adjusting the images’ resolution and pixel density according to the device pixel ratio (DPR) and viewport of the viewing device. “We want to generate 20 images every 100 kilobytes,” said Matthew Wicks, software engineer at Reformation. “If visitors are on a high-definition monitor, we set it to be two times of the required display resolution. Cloudinary then figures out which version to serve.”

Separately, through its content management system, Reformation manipulates the images, often with text overlays, as a marketing tool. A versatile Cloudinary feature makes that task fast and painless.

Furthermore, Reformation takes advantage of Cloudinary’s automated process for optimizing videos. The eCommerce merchandising team needs to only upload them into Workarea and Cloudinary then does the rest, including delivery with smooth streaming and no buffering interruptions regardless of the viewing device or bandwidth.

The Results: Engaging Shopping Experience and Improved Performance

By switching to managing rich media with Cloudinary, Reformation has seen a significant leap in its eCommerce performance, particularly in mobile browsers. A case in point: the images on the site’s category page have shrunk by 48 percent.

“What’s so cool is that our tech team can leverage Cloudinary to make ongoing improvements to our site,” Chappell beamed. “It’s not a one-and-done solution, and we can now effortlessly evolve with the latest trends and technologies.”

Recent Blog Posts

Create Lightweight Sites With Low-Code and No-Code Technology

Consumers expect modern websites to be mainly visual. But, the more compelling and complex the related media is, the more data is involved, compounding the site’s weight. In today’s content-craving world, delivering unoptimized media can cost you because it leads to sluggish page loads, resulting in visitors abandoning your site in search of a faster alternative. In fact, a page load that takes more than three seconds can cause as many as 40% of your visitors to bounce. Given this competitive, digital-first environment, you can’t afford to lose page views, for time is of the essence.

Read more
A Blueprint for AWS-Secured Webhook Listeners for Cloudinary

tl;dr: An AWS-secured and optimized Cloudinary webhook listener for extending the Cloudinary service

Code: Github

A webhook is a communication medium for sending notifications from one platform to another about events that occurred. In place are user-defined HTTP callbacks that are triggered by specific events. When a triggered event takes place on the source site, the webhook listens to the event, collects the data, and sends it to the URL you specified in the form of an HTTP request.

Read more
New Accessibility Features for Cloudinary’s Product Gallery Widget

Cloudinary’s Product Gallery widget, which launched in 2019, has enabled many brands to effectively and efficiently showcase their products in a sleek and captivating manner, saving countless hours of development time and accelerating release cycles. By adding Cloudinary’s Product Gallery widget with its customizable UI to their product page, retailers reap numerous benefits, often turning visitors into customers in short order.

Read more
Why Successful Businesses Engage With and Convert Audiences With Visual Media

Most business buyers prefer to research purchase options online, as do many shoppers. No wonder online retail sales in the U.S. rose by 32.4% in 2020—an impressive gain of $105 billion.

For B2B and B2C businesses, text-heavy websites are no longer adequate in attracting shoppers. Instead, engaging visual media—spin images, videos, 3D models, augmented reality—are becoming a must for conveying eye-catching details and differentiators about products or services.

Read more
Making User-Generated Content (UGC) Shoppable With Cloudinary

User-generated content (UGC) is a powerful marketing tool. Not only does video complement marketing efforts for e-commerce by enabling customers to explore products in greater detail, but UGC also adds an element of trust. As a bonus, user-generated video is an exceptional opportunity for e-businesses to attract website traffic without their marketing team having to create promotional videos from scratch. User-generated content drives conversions and brand loyalty as a direct result of authentic interaction.

Read more