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.
Translating McCormick's Harry Potter™ Collection Into an Immersive Shop Experience
Barrel and McCormick have worked together for years, from unifying McCormick's family of brands on Shopify to seasonal campaigns and new brand launches. Through our ongoing retainer, we support a steady stream of projects for the McCormick team. One of the latest brought a little magic to the spice aisle: landing pages for McCormick's limited-edition Harry Potter™ collection. Licensed collaborations move quickly and come with a clear creative direction. Building on an established design system lets McCormick launch pages for these moments on a tight timeline while keeping the campaign's personality intact.
To support the launch on the ecommerce site, we created distinct landing pages showcasing Butterbeer, the Magical Flavors, and the overall 25 Years of Magic campaign. We launched these pages through a phased approach, to prolong the storytelling of the collaboration. We started with a pre-launch page designed to build excitement and ended with the post-launch page with the full campaign that evolves over time, including the recent back-to-Hogwarts™ season.
Pre-launch & post-launch landing pages
Why Collaborations Work for CPG Brands
A collaboration puts a brand in front of an audience that already cares. Harry Potter™ has a loyal fan base that spans generations, and a limited-edition collection gives those fans a reason to discover McCormick products they might not otherwise reach for, like finishing sugars. For McCormick, that means building awareness with a new audience and giving shoppers a reason to visit their site and try something new. Harry Potter™ is one of many collaborations McCormick is running. Each one needs a home on the site that reflects the partner's world while still feeling part of the McCormick universe.
Customer journey
Bringing the Collaboration's Look to the Shop
The Harry Potter™ collaboration came with its own distinct visual direction stemming from the package design, and our job was to carry it onto the site. Our work with McCormick is always collaborative, starting with a client brief that we expand upon with our strategy and vision to arrive at the final design. We handled the content creation and builds for the pages, working from the design system we built for McCormick. Because the system already includes modules for product spotlights, recipe features, and grids, we could put our time into the strategy and visual layer: applying the campaign's look to each module so the pages feel like part of the collaboration and still fit naturally within the site.
Recipes
Pairing Every Product
The Phase 2 page celebrates the season with six finishing sugars inspired by Honeydukes™ treats, plus a limited-edition vanilla extract. Each product gets its own section with a flavor description, a quick serving tip, and three recipes, so shoppers can go from browsing to purchasing items for a movie night spread in a single scroll. A closing recipe section groups serving ideas by occasion, from breakfast to dessert.
Moving at the Speed of Marketing on Shopify
We built all three pages from the design system we created for McCormick, a shared library of modules, components, and styles behind every McCormick brand site. On Shopify, those modules work like building blocks that can be arranged into new pages without custom development each time. For the Harry Potter™ pages, that meant our time went into the creative layer instead of page structure, and rolling out Phase 2 as the campaign evolved was straightforward.
That flexibility matters for a brand running many collaborations and campaigns at once. With the same modules and components powering every page, McCormick can launch landing pages on the timeline its marketing calendar sets, and every new page stays consistent with the rest of the ecommerce store.