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.”
