By clicking “Accept”, you agree to the storing of cookies on your device to enhance site navigation, analyze site usage, and assist in our marketing efforts. View our Privacy Policy for more information.
Barrel's Director of Strategy and Design Director hosted a live optimization session deep diving a brand who submitted their site for review, including a roadmap of fixes to implement before BFCM.
How We Made Waterloo’s Non-DTC Site Feel Shoppable
As Waterloo prepared for a full packaging relaunch, it partnered with Barrel to redesign their website on Shopify around its "Water Down Nothing" identity, creating an elevated, premium presence online.
Waterloo Homepage
Waterloo doesn't primarily sell direct to consumers (DTC) online today. The brand's sparkling waters reach customers through retailers nationwide, both online and in stores, including Costco, Walmart, Whole Foods, Target, Safeway/Albertsons, Aldi, and Kroger, along with same-day delivery through Instacart, DoorDash, Walmart, and Amazon.
That raises a fair question for any retail-first brand: if customers can't buy on the site directly, why invest in it at all?
For Waterloo, the answer is that the site is the brand's digital flagship. It's where Waterloo tells its full, bold flavor story, increases product discovery, then points people to exactly where they can buy, even when the transaction happens somewhere else. It’s also where the post-purchase experience begins, with engagement tools like their mocktail and recipe blog, for customers to come back and interact with. We rebuilt the product experience so it works the way an ecommerce site would, minus the cart.
Waterloo Product Detail Page (PDP)
Product cards and product pages that do more of the work upfront
We redesigned Waterloo's product cards to surface the details a shopper needs before they click through, so flavor, packaging, and availability read clearly at a glance. From there, the product detail page (PDP) gives people room to go deeper: comparing flavors side by side, learning what makes each one distinct, and finding exactly where to buy it. The goal throughout was to shorten the distance between "I'm curious" and "I know where to get this," while making sure people actually discover the range Waterloo has to offer along the way.
Waterloo Product Selector
A product selector built for a full flavor lineup
With a lineup as flavor-forward as Waterloo's, finding the right can should be a fun experience. We built a product selector in the PDP that lets shoppers discover and move between flavors quickly, while displaying where each flavor is available for purchase in store and online.
Waterloo Store Locator
A store locator that closes the loop
The store locator provides another avenue to purchase. Shoppers enter a zip code and see both nearby stores and online retailers carrying Waterloo, down to which products are available at each location or channel. From there, it's a direct path to Instacart, DoorDash, Walmart, or Amazon for immediate delivery, or to a nearby shelf.
The takeaway for retail-first brands
A site doesn't need a checkout to earn its place in a brand's marketing mix. For Waterloo, it's the digital flagship acting as the connective tissue between discovery, inspiration, and purchase. The site carries the brand's bold flavor story in full, then drives people to the right shopping channel.
Curious how this fits into the bigger picture? Read the full Waterloo case study to see how the site's identity, storytelling, and shopping experience came together.
If your brand is ready to build a digital flagship of its own, let's talk.