Patagonia

A branded commerce experience

iStock 1314820096 scaled

Patagonia is a family-owned apparel and outdoor sporting goods outfitter, rooted in sustainability. As a leader in eco-friendly business models, they’ve paved the way for others to reimagine their practices with sustainability in mind.

A brand that lives its values

For Patagonia’s flagship experience, we were tasked with crafting a design solution that brought its massive product and content library to life in a simple yet insightful way. For a brand that truly lives its values, it was vital that the user experience echo that; our challenge was to create a digital shopping experience that tells a brand story at every touchpoint.

A brand hub for activism & content

Being no stranger to storytelling, Patagonia has always maintained a strong voice. Our approach was to elevate this voice and bring it to life in a clear, simple execution while striking a balance between culture, business, and the environment. One that begs consumers to consider the impact of their choices—right down to the clothes they wear. The reimagined eCommerce platform serves as a brand hub for both activism and content, through a cohesive digital style guide, UX principles, and a consistent narrative. The experience invokes human emotion and rational understanding and is entirely driven by the brand’s mission. Most importantly, it serves both function and storytelling by not only selling clothes but transforming value systems.

Relationship

This project called for a deeply collaborative process—one that demanded a unique agency-client partnership. We quickly embedded the Patagonia design team into our San Diego HQ and worked in tandem from concept to completion. This set the foundation for a longstanding, successful relationship that extends beyond the traditional boundaries of agency-client servicing.

Our team spearheaded the broader user experience while closely consulting with the in-house team at Patagonia on art direction, design systems, user testing and scripting. As the project progressed, we were given an additional opportunity to own the visual and strategic redesign of Patagonia’s brand initiative, The Footprint Chronicles. In doing so, we achieved a simple, cohesive design system that complemented the larger site.

Visual Light 159 2 scaled

Navigation & information architecture

A new navigation system considers the full scope of the consumer journey—from initial interaction to finding exactly what they’re looking for. We transformed the experience by organising content in a clear, logical way, and integrating relevant stories when appropriate. This gives products more context while seamlessly injecting the brand voice throughout the entire journey.

The new navigation prioritises the overall design’s larger goal for product and purpose-led storytelling through a simple curation strategy. An extensive library of cultural initiatives like Patagonia Action Works, The Footprint Chronicles, and more are properly showcased for easy discovery.

Product filtration

To maintain the simplicity of our design, we needed a powerful filtration tool that could optimize a complex product catalog. The end result was a floating, contextually aware action button that becomes the most prominent prompt on any page. This responsive UX pattern is designed for approachability and progression and successfully helps users browse.

Product education

It was essential that this experience was personalised and always relevant to the consumer. Our goal was to ultimately guide users to the best product for their needs in one simple flow. By implementing an in-line Q&A and product comparison overlay, we were able to help customers decide which product is right for them, saving them the hassle of toggling between product detail pages. As a result, users are directly routed through the sales funnel in one seamless UX flow.

Content strategy

The delicate balance between purpose and product truly came to life throughout our overall content strategy for this redesign. We set out to create a central system that could not only serve as a shopping platform but a brand initiative as well. In doing so, we were able to weave Patagonia’s passion and purpose right into each product story and keep consumers engaged in the brand, even if they were just looking to shop.

Since the launch of Patagonia mobile revenues have grown by over 25%

Visual Light 158 1 scaled

Design system

The delicate balance between product and purpose was the driving force behind our entire design system. Focus, clarity, and simplicity became our guiding UX principles, which allowed us to help Patagonia tell compelling stories—while maintaining both emotional feeling and rational understanding. We set out to strip away any excess that did not support our larger goal of one, centralised digital experience.

Constant collaboration between Patagonia’s team and ours—both designers and developers—resulted in a refined digital style guide, with a technical solution to support it. Each element of the redesigned system, from the homepage to navigation to our new product filtering system, was built into the style guide to the highest fidelity. As the project progressed, our development team was embedded into Patagonia’s tech team to offer seamless support in building out The Footprint Chronicles and Patagonia.com. From this, we built an intuitive content model within the Salesforce Commerce Cloud, while our frontend efforts produced a highly interactive site with meticulously rendered motion to tell The Footprint Chronicle story.

Project considerations

Designing at scale

Responsive code

Documentation

etzel k 1375 cc WEB

The Footprint Chronicles

What started as a partnership to reimagine a digital storefront soon became a collaborative consulting engagement. Our team was asked to help revive one of Patagonia’s transparency-driven brand initiatives—The Footprint Chronicles.

This story of sustainability needed to be told in more than one place, so we developed a system that would surface it in the shopping experience. An informative card structure highlights key details about a product’s carbon footprint to educate the consumer and drive brand purpose, perspective, and conversion.

Footprint Overview3 scaled

Give people pause

In an effort to shift the consumers’ mindset, we used product detail pages as an opportunity to invite a bigger brand purpose. By gently educating shoppers on how products are made and the impact it has on the planet, we’re able to give them a moment to pause and consider their habits. In doing so, we can convert product seekers into purpose-driven shoppers, while telling meaningful product stories.

An immersive story

Our goal with The Footprint Chronicles was to first build empathy with customers, then drive action. Our content strategy and component design allowed us to tell rich, dynamic stories through interactive content that allows users to explore and learn. The flexibility of this design lets us not only educate consumers about the brand mission but impacts real change in the cultural mindset.

A call to action

Our overall strategy and goal for The Footprint Chronicles culminates into one simple storytelling structure. We start with why each aspect of our mission is important—why these points need to be made and stories be told. Consumers are then given an honest explanation of where we stand in this journey to make and see change. Finally, the brand’s commitment to what’s next. Where does Patagonia progress from here and what can consumers and every brand do to play a role in this shift.

Experience the website

1x

Webby Award – Fashion & Beauty 2021

1x

Webby Award – People’s Voice Winner 2021

Questions?

paul thomas hero e1627476371152

Client Development Director

Paul Thomas

Stay in touch!

To make your website user experience as easy and personal as possible, we make use of cookies. We also use them to ensure we and third parties can serve advertisements that are relevant to you.