CLIF Bar Goes Direct to Consumer.

As a brand who has built such a strong loyalty within its audience, it was only a matter of time before CLIF Bar would want and need to have some control over how their consumers experienced purchasing online - directly from them.

Our job wasn’t just to spin up a well-designed, exceptionally functional DTC website. We were there to guide teams in understanding the impacts of decision making, learning about new technology, new ways to operate, and build a comfortable knowledge-base in the new world of ecommerce.

Overachieving is a major undertaking

CLIF Bar is one of our longest partner relationships. When they came to us with the revelation that they needed to own their DTC experience, we couldn’t have agreed more. But once the reality of the challenge set in, some natural anxieties surfaced:

  • We’re going to need to flow A LOT of information from one system to the other.
  • Digital, IT, Marketing, Creative, Commerce, Legal, and Finance teams will all have to work together to get this right.
  • We’re talking about multiple brands — each with multiple product lines — that live within one unique brand experience.

It can be dizzying, it can be daunting, but we’re here to make it happen.

"Bukwild has been our digital agency partner for years. They're equal parts beauty and brains and truly engage with us like they're a part of our team."
— John Monteleone
Sr. Digital Director, CLIF Bar

As with any large initiative, we dove right in with requirements for features, integrations, and technical business rules. On the visionary side, the goal of the new experience was to be the most trusted resource for CLIF Bar & Company products and stories by inspiring and helping consumers with every interaction.

The biggest DTC decision of them all

Next up was the choice with the biggest ripple effect of the whole project: the right storefront platform. From a large field of contenders, we narrowed down to a chosen few that were auditioned, researched, and vetted by multiple teams. In the end, ShopifyPlus was the right-fit winner. It’s scale-ability, forward-thinking momentum, user experience, and alignment with company values made it the stand-out choice.

But, of course, even with the perfect-fit platform, we still needed to put it through its paces with a carefully planned sequence of workshopping and prototyping to solve complex technical, UX, design, and workflow hurdles. Displaying multiple brands with multiple product lines within a single storefront experience, connecting to back-office systems, and third party logistics integrations is, shockingly, not as easy as it sounds.

Down to business

We had four months to transition to Shopify Plus, then three months to create the brand platform that seamlessly integrates with the storefront experience. This major coordination takes a high level of partnership and trust, and feels much more like an ‘us’ situation than a client/vendor exchange.

Our responsibilities as partners in these large-scale projects go beyond agency basics to make sure we’re educating our client teams, finding ways to simplify complex technical conversations, creating a communication framework to help maintain alignment within their organization, keeping a prioritization of requirements, and always workshopping our way toward success.

Workshops are a critical tool that, when facilitated well, can be exponentially more powerful than a traditional review/feedback approach. It allows for real-time progress, instant alignment, clear next steps, and unhindered momentum.

Design smart, build smarter

How do we create a scaleable, multi-brand, multi-product line, multi-blog, campaign landing, nutrition fact finding, and otherwise widely multi-purpose storefront experience? Simple, we use the best tools out there. We seamlessly integrated Craft CMS with Shopify Plus to create a high performing, scaleable, mostly headless brand & product experience.

To achieve consistency and scale, we started with creating a digital design system, which then turned into an Atomic design system, and you got it, turned into a component based website build. This gives CLIF Bar the ability to adapt the site to their needs. So, marketing and creative can quickly spin up new pages and entire sections for campaigns, merchandisers can seed product mentions throughout the 600+ page website, and the CLIF Bar & Company story can shine wherever and however it needs to.

Launch, optimization, and beyond

With the platforms implemented, we’ve got the means to deploy the deeper integrations that let CLIF Bar access and analyze useful data. This continuous feedback loop will help them understand the evolving wants and needs of customers, as well as the means to communicate with them at the right time with the right message.

Now, we’d be skipping over a major part of the story if we left out the curveball no one saw coming: COVID. With both the Bukwild and CLIF Bar teams taking early precautions, we had to get this project over the finish line from a distance. But, as with any obstacle, we identified what we needed to do to keep moving, and adapted every other part of the process to serve those needs. In short, meaningful collaboration was a non-negotiable, so we figured out how to make it happen.

The resulting DTC site is something we’re hugely proud of, and excited to serve up to an eager audience. This is only the beginning, stay tuned.

Project Lead


Internal Positioning
User Experience
Web Development
Systems Integration

Unsupported browser

We’re sorry to report doesn’t support your browser. While we could have polyfilled most of the features your browser lacks (CSS variables, canvas Path2D, NodeList.forEach, etc.), we decided to put that effort into juicing the site for modern browsers and keeping the download smaller so we could really blow your hair back.

We suggest downloading Chrome to view the site, it’s our favorite browser. Cheers!