Brooks_1.jpg

Brooks.com

 

The ask

Transform Brooks online experience from an ecommerce site into a runner-led experience.

 
 
 

A major insight was uncovered during our discovery with Brooks. No two people run the exact same path. And Brooks can become your partner along that path. So our design imperatives for the site were simpleK To understand your needs as a runner, improve your experience and in turn create brand loyalists.

Following the Brooks credo of ‘Run Happy’ we had our work cut out for us. The current experience had too much of an ecommerce and conversion focus and lost some of the core of the brand in the design. To be runner led we needed to always bring content back to a runner truth and to be more playful, fun while encouraging people connect with that side of the brand.

Here a is a showcase of the work that my team at Huge created to solve these user and brand challenges.


We wanted to bring the authentic Brooks brand to life. “Run Happy” is how Brooks differentiates from what is refered to as ‘Big Sweat’. This is the idea that other brands expect elite athleticism from their customer, while Brooks understands that everyone runs to their own path. We helped bring this concept to life through brand campaigns and products that brought this expression to life.

 
 
 
 
 

A fresh look and feel for the Brooks website.

After a few months of research and vision initiatives, we got to work. We started by finding ways to bring the brand expression to life within the site. The Brooks signature unique style embodies the delight of the brand and the imperfections of the ‘real’ runner.

The team found new ways to express this using unique interactions, developing tools to help Brooks follow you on your journey while developing exciting content opportunities to support their commitment to diversity and building authentic running communities.

 
 
 
 

Mobile first, always

With a 65% mobile use rate for site visits for ecommerce, our entire experience was built with a mobile first philosophy. Every design component and element, every interaction and all content was tested on on all viewports to make sure there was a 1:1 consistent content thread between platforms devices.

 
 
 

Ecommerce with personality.

We went to sell this vision to the client in person in Seattle during a two-day workshop with the executive leadership. While there, we partnered with their amazing internal design team to start a complete rethink of the experience. Empowered to infuse this new energy into commerce from the existing marketing work, we were able to infuse the brand with best-in-class UX to encourage consumer action and business growth opportunities.

 
 

The new system and refreshed design principles became the north star that was infused throughout the site. A unique, impactful design that was highly usable, while creating an envigrated focus on brand affinity for the customers and fans of the brand.

 
 

A truly reimagined design system.

One of the challenges we had to solve early in the process was maintaining their existing design system, which was already built and coded.

Determined to evolve the brand, we spent two sprints in person, working hand in hand with the internal team and stakeholders to ensure we understood the constraints and how we could push without breaking the pre-coded system.

In the end, we were able to evolve the system at the atomic level, from typography, updating grid systems, and ‘reskining’ existing tokens. In the end, we were able to seamlessly deliver a complete redesign on a “molecular level” with bespoke components, page templates, and layouts.

 
 

Bringing digital experience to the physical world.

We sold Brooks on two augmented reality experiences:

Brooks only has one physical branded store which is their flagship in Seattle in the same building as their HQ. So most of their sneakers are sold in SRA (Think Fleet Feet, Dicks or Pacers) where it becomes difficult for Brooks to know who actually bought their sneakers, and in turn have no way to connect with these customers.

Our solution was to create AR markers on the sneaker boxes so that when the customer takes them home they are prompted to ‘scan and register’ the sneakers via AR. By doing this, we can create a value exchange with offering loyalty programs so that Brooks can connect and communicate with their customers. A win-win.

 
 
 

Another AR concept, which we designed, built and delivered, was for an in person experience for Dicks Sporting Goods, where Brooks has no in person employees advocating for the brand.

With this product we can educate and entertain prospective customers around the halo of the Brooks brand. They simply scan a marker at the point of purchase in the store where they learn more about the nuances of the shoes on site, with a focus on tech specs and performance.

 

Agency: Huge

Role: Executive Creative Director

Huge product team:

Patrick Quill – GCD
Nour Tabet – CD
Alex Safchuck – CD/UX
Irina Moiseenko – Sr Design lead
Jen Doyle – Sr Product Designer
Rene Arvizu – Sr Product Designer
Chris Sullivan – Product Designer