Published on October 26, 2022 (over 1 year ago)

The modern shopping stack: how Commerce-UI marries video and ecommerce to drive results

Eric Elia
By Eric Elia4 min readPartnerships

My father-in-law used to sell vacuum-sealed storage bags on QVC. Space Bag. Maybe you’ve heard of it. When I first met him, he was on his way to West Chester, PA (Go Phils!) for one of his first QVC live sales. He did great — and Space Bag became a big hit.

It’s surreal to look back and remember the other side of that experience from the perspective of a shopper. To see a product demonstration, you had to tune in to a linear TV channel at just the right time. Product education was word of mouth, perhaps a printed review, maybe in Consumer Reports. So much has changed since then.

LinkBuilding the modern shopping stack

Today, retailers of all sizes are leveraging live and on-demand video to increase sales conversion. Mux has partnered with a number of platforms and solutions to empower retailers and the developers who bring their storefronts to life. Commerce-UI is one of those development studios, focused on building cutting-edge headless e-commerce experiences.

Commerce-UI recently built a headless Shopify Plus storefront for apparel company Aether that elegantly blends editorial content with product information. Video is woven throughout to further engage users, with Mux handling all playback and delivery and the new Mux Player utilized nicely on the front end.

"To support this extensive need for video content, we decided to use Mux video platform for advanced video optimization and infrastructure. This cutting-edge technology allows for the level of optimization so far available only for giants like Netflix. Results exceeded everyone’s expectations — Aether’s videos load faster than traditional images on the website.”
- Commerce-UI

LinkLeveraging next-gen tech for next-gen experiences

On some sites, the speed at which a video player loads can be a turnoff to viewers. That’s one thing Mux (and Mux Player) takes particularly seriously — and I was excited to see the new Mux Player used in different ways to achieve Aether’s goals.

First, the player is used to present a documentary-style video (above) about the origin and collaboration behind Aether’s Italian boots. The player is styled cleanly, keeping in line with their brand, and adapts smoothly to any window size.

Second, Commerce-UI uses a “player-less” experience on product pages to automatically load videos that show off their goods and apparel in the wild, literally. At first I thought these were GIFs because of the unique size, aspect ratio, custom controls (a simple pause button), and load speed.

Experiences like these set a bar for how a video-shopping experience can look, feel, and perform. The overall experience wouldn’t be possible without a number of complementary Mux partners under the hood. It’s like an Avengers of developer-oriented platforms, all on a mission to deliver modern content experiences.

  • Sanity, the popular headless publishing platform, manages editorial portions of the website, including video publishing via the Mux-Sanity integration.
  • Sanity + headless Shopify Plus is behind the product pages themselves.
  • Netlify (Mux integration) is leveraged for fast access around the world.
  • The Next.js framework (check out the new Mux component) is used for prefetching content and static site generation.

With this foundation in place, we are excited to see where Commerce-UI and other partners take these experiences. Live video, real-time shopping advice, and creator-published content are just a few natural opportunities. Check out the full case study here to learn more about how Commerce-UI built the experience and helped deliver impactful results for Aether.

Written By

Eric Elia

Founding team at Brightcove, cut teeth at Comcast and @Home. Once held the ceremonial title VP of Tacos. Will take friends of Mux on dive tours of Monterey.

Leave your wallet where it is

No credit card required to get started.