How Shogun optimized their media pipeline and cut 86% of image bandwidth costs

Shogun is a powerful drag-and-drop page builder for online stores. The company needed a reliable solution for image uploading, optimization, and delivery to provide a seamless digital experience on Shogun-based pages.

Shogun is a powerful page building platform for ecommerce teams and agencies. It empowers brands to create refined customer experiences with faster page-load times while staying no-code.

In February 2020, Shogun announced that it had raised a $10 million Series A Investment for their next product, Frontend, which allows direct-to-consumer (DTC) brands to build fast headless ecommerce sites. In October of the same year, the company closed a $35M Series B.

Finbarr Taylor, Shogun co-founder and CEO
Finbarr Taylor, Shogun co-founder and CEO
Our clients range from aspirational entrepreneurs all the way to Fortune 100 companies. They want to launch campaigns and landing pages quickly and easily online.

Shogun serves a total of 96 terabytes of image content per month, but not a single one of them is full-sized. Without optimization, this would have been 476 terabytes of data-heavy images, increasing page load times and bounce rates. So optimization was a must, but building the infrastructure in-house wasn’t an option:

Developing a file uploading and image processing system from scratch would’ve taken a lot of human resources. Engineers wouldn’t have been able to focus on their main job: iterating, maintaining, and supporting the product. And this would’ve harmed the business in the long run.

To build the desired functionality would have taken a team of 3-4 full-time developers several months. This would’ve required additional investments in the project and therefore increased the total cost of ownership.

Building an in-house image-handling system takes time and could’ve delayed Shogun’s product launch. Also, the company would’ve had to invest time in ongoing infrastructure maintenance and support.

Unavailable image uploads or slow image processing would lead to a poor user experience. Plus, maintaining a DIY tool can be annoying: uploads fail and stall, there are network issues, and slow connections are difficult to manage.

To cope with tons of images and keep up with growing client demands, Shogun set four objectives to bring tangible business benefits to both the company and its clients:

Finding a convenient ready-made solution would prevent burnouts and help in-house engineers focus on the other crucial product features.

Lowering the bandwidth and traffic costs would decrease the total cost of ownership and free up more resources for business development.

Saving on infrastructure development and maintenance would streamline the production cycle and cut down the time to market.

A file handling system with a smart CDN would provide a smooth user experience even during traffic surges.

Having a good sense of ecommerce values and market trends, Shogun started looking for a partner that shared the same knowledge and values. Customer Experience Suite by Uploadcare helped Shogun to reach their goal in a couple of hours instead of several months. The whole process had four simple steps:

Solution: CX Suite by Uploadcare

Shogun used Uploadcare File Uploader, a responsive and mobile-ready solution for integrating uploading capabilities. The file upload widget was implemented as a standard JavaScript library and started accepting images from users right away.

Further customization adjusted the widget to Shogun’s needs and page style. For example, the team allowed users to select and upload multiple files and to edit images after uploading.

Finbarr Taylor, Shogun co-founder and CEO
Finbarr Taylor, Shogun co-founder and CEO
It was a very straightforward integration. Just a line of JavaScript. I think it only took us a couple of hours to get it working initially. The integration was lightweight and didn’t require a ton of work.

Although the widget can be configured to use custom storage, Shogun trusts the built-in Uploadcare storage and smart image CDN. With its help, every uploaded file is rapidly and safely delivered across 288K servers in 135+ countries. Uploadcare automatically scales the infrastructure to handle the increasing pressure caused by Shogun’s ever-growing customer base.

Finbarr Taylor, Shogun co-founder and CEO
Finbarr Taylor, Shogun co-founder and CEO
I remember seeing the way that the on-the-fly CDN worked and thinking it would save us a bunch of time. If we ever changed how we handled images, we wouldn’t have to reprocess our entire image set. We could just change the URLs.

Uploadcare can either convert images to one of the chosen formats (JPEG, PNG, or WebP) or adapt the image format according to the client’s context. Using the latter AutoFormat option, Shogun turned JPEGs into WebPs wherever possible, resulting in a massive image size reduction. Lowering the image bandwidth cut the total cost of ownership of the CDN and traffic costs by 86%.

Savings in traffic costs by lowering the image bandwidth

File size also affects loading speeds and volumes of generated bandwidth. Shogun configured Uploadcare’s platform to automatically adjust the image compression to preserve the visual quality while minimizing the file size.

Optimizing images via Uploadacare’s end-to-end cloud platform accelerated page load times by 1.5x. The improved web performance provides Shogun’s clients exactly what they’re looking for: increased website conversion and online sales growth.

 Image optimization led to a 1.5x page load time boost

Page speed is an essential factor in the digital experience, but it’s equally important to adapt content to the user context. To provide customers with unhindered website interactions, Uploadcare developed Adaptive Delivery, a full-stack image optimization solution included in the CX Suite that:

  • Adapts images to fit the device and browser through responsiveness
  • Increases page load time at no loss in visual quality through smart image compression
  • Renders only the images the user scrolls to through lightweight lazy loading
  • Serves high-resolution images for high-density screens with retina support
  • Serves next-gen WebP images through WebP support

CX Suite by Uploadcare automated every aspect of Shogun’s media pipeline, from uploading files to delivering them adapted to the end-user context. This resulted in:

Result: Better performance & lower costs

With Uploadcare, Shogun reduced image bandwidth costs by 86% compared to serving the equivalent unoptimized traffic. This resulted in infrastructure cost savings of just over $200,000 per year.

For a company like Shogun, image content delivery costs mount quickly. Firstly, all Shogun’s users serve images through the application. Secondly, ecommerce stores are image heavy. Multiply these two factors, and you get hefty bandwidth usage.

Finbarr Taylor, Shogun co-founder and CEO
Finbarr Taylor, Shogun co-founder and CEO
The CDN image transformations are very helpful. Ecommerce retailers upload all kinds of images, and then we just hand them to Uploadcare, add the appropriate flags, and it automatically optimizes the images’ format, size, and quality so we’re not serving up massive files.

Shogun drastically reduced initial development costs by avoiding building the infrastructure in-house. This would have required 3 or 4 developers working full-time for at least three months. At an estimated fully loaded cost of $125,000 per year per developer, this comes out to over $200,000 in direct development cost savings.

In addition to the initial development expenses, Shogun cut down on ongoing maintenance and non-technical support. Bug fixes and minor feature development would have required at least one full-time developer and significant ongoing costs.

Using Uploadcare saved Shogun not only money but also time. The team was able to bring Shogun to market faster and ensured they wouldn’t have to spend time in the future developing additional functionality as their needs expanded.

Finbarr Taylor, Shogun co-founder and CEO
Finbarr Taylor, Shogun co-founder and CEO
Using Uploadcare, we’ve basically taken a shortcut. We haven’t had to build any uploading or image-processing infrastructure ourselves, so we’ve saved a bunch of developers' work. This part of our software is just handled. It’s not something we need to worry about.

Uploadcare is an end-to-end cloud platform that provides a next-gen infrastructure for file handling. It can cover any part of the media pipeline or all of them at once:

  • One of the world’s fastest File Uploaders
  • Automated secure Smart Storage
  • AI-driven Image Transformations Engine
  • Proprietary designed Visual Intelligence Algorithms
  • Adaptive Delivery solution