Herschel Supply Co.

A modern commerce experience for the ubiquitous bag brand.

Herschel Supply Co.

Herschel Embodies Beautiful Simplicity

Client

Herschel

Year

2021

Role

Strategy, UX, Design

Ask

Herschel needed to modernize their existing site design system to allow for a more effortless shopping experience and a better way to display their products.

Solution

We reworked their current architecture to allow for intuitive shopping, while implementing brand storytelling to pay homage to their brand identity.

Herschel's product collections are timeless staples - they needed a site that could keep up. We took their existing brand structure and developed a design system that made shopping easier while opening up moments for brand and product storytelling. By designing this new architecture, we enabled the visual design system to work across all their products and offerings.

Desktop screenshot of Herschel homepage

Contextualizing Product Throughout

Orange Herschel Supply Co backpack
Person on the beach wearing a Herschel backpack
Orange Herschel Supply Co backpack

One of the primary complaints from the site experience was the lack of context around the size of Herschel’s most iconic product - the backpack. The lifestyle imagery was beautiful, but the product imagery lacked the context shoppers needed to make an informed buying decision.

To tackle this issue, we created a design system that allowed their product assets to be contextualized across the experience with clever use of a combination of iconography, guided shopping, and on-model videos and photos - keeping the user educated throughout the entire journey to checkout.

Person by a pool with a Herschel bag
Lifestyle image with a Herschel backpack

Restructuring the navigation and Product Listing Pages

Herschel came to us with a challenge to design a user experience that was easily shoppable and still showcased their products and education. We implemented a visual navigation for an easy-to-use menu system that allows customers to quickly locate what they came for. We also reimagined their product listings and tile; what started as a simple redesign resulted in an overhaul of their product listing taxonomy structure.

Desktop screenshot of Herschel menu
Desktop screenshot of Herschel PLP

Herschel For the Little Ones

It's unfair that only adults can use these iconic bags and backpacks. That's why we teamed up with the Herschel team to create a digital brand language that promoted their Little Herschel products. We created a destination just for the kids through bright colors and energetic illustrations.

Desktop screenshot of Little Herschel menu
Desktop screenshot of Little Herschel page
Purple tie-dye Herschel backpack above a text module Mobile screenshot of Herschel page for new parents
Mobile screenshot of Herschel PDP with blue bag Mobile screenshot of Herschel PLP
Mobile screenshot Herschel shoppable blog Lifestyle imagery of Herschel blog
Mobile screenshot of Little Herschel page Mobile screenshot with Herschel lifestyle imagery
Mobile screenshot of Herschel gift guide Mobile screenshot of Herschel categories
Display of Herschel bags Images of a woman wearing a pink Herschel backpack
Two people on a dock wearing Herschel gear Two people on a sandy beach throwing a Herschel bag
Herschel backpack with Bart Simpson pattern Person in a pottery studio with a Herschel backpack
Four different Herschel card holders
A person with a bright Herschel bag
A display of Herschel bags under fake clouds Herschel ad with a person and a purple backpack
A tennis player sitting next to a Herschel bag
Pink Herschel backpack
Herschel bag full of belongings
Kids wearing Herschel backpacks runnings up stairs Bright orange Herschel bag hanging on a fence