09–28–15

Scaling The North Face

Early this year, we were invited to help pitch a truly iconic American brand – The North Face.

We knew it would require a huge effort with an aggressive timeline and pit our work against the biggest digital agencies in the world. So of course, we said yes.

The goal of the pitch boiled down to designing a UI that was fresh, exciting, and captured the adventurous spirit of the brand. The design we created is both timeless and technical to position The North Face as a leader in product, lifestyle, design, and technology.

Storefront

In our view, the best way to communicate the brand’s personality was to use their incredible photography to immerse users in the stories behind the products and the athletes that rely on them. With a library of adventure photography at our disposal, we chose to highlight the moments when The North Face products are at their best. A shoe mid run. A jacket keeping a climber warm and dry. A backpack filled with everything an explorer could need.

Our storefront was focused on getting users into the brand stories, innovations, and activity categories most interesting to them.

Product Detail Page

The product detail page (PDP) was one of the biggest challenges. Our goal was to forget everything we knew about PDP pages and create something completely new. To do this, we killed the typical silhouetted studio model shot and showed the products as they’re meant to be used – in the wild. Not only did this better showcase the product, but it gave much more emotion to the page. In this instance, the intensity felt in the athlete’s eyes was undeniable and deserved to be the star of the page.

We also stripped down the product UI and details to rid it of any clutter. The fixed bar at the top of the page forced us to boil down the options to just the essentials. By keeping this fixed, it also kept the call-to-action visible and made purchasing simple. Instead of clicking through thumbnail images, users could simply explore the page to see alternate views, watch videos, and learn more about the product. Finally, we incorporated reviews through a timed social presentation as a fresh way to describe the product. The final page includes all the content you’d expect to see, but in a remixed way.

The North Face Experience

With world-renowned action and extreme photographers shooting for The North Face, we decided to pitch a section of the site where users could fully explore these photo sets. But this is more than just a fancy image gallery. Even though the story is the focus, every photo was shoppable through our “Shop this Scene” feature.

Product Driven Adventure

One of the major themes was that The North Face products can only be fully understood when seen in their natural habitats. For this campaign idea, we created an experience around product innovation. A compass interface was used to parallel the brand campaign and product promise – Never One Place, Always One Jacket. We were able to insert users into incredible geographic settings and show how this one jacket can stand up to different temperatures, terrains, and elements.

Putting it All Together

Process is an interesting thing. On one hand, it’s often helpful to have a set structure for working. On the other hand, that can sometimes be limiting. The more large projects we work on, the more we realize that while certain pieces of our process remain the same, workflows can and should evolve and be altered to fit each project. As our work becomes increasingly dynamic, we find ourselves thinking in motion rather than static wireframes and design. And we’re finding that by exploring proofs-of-concept, HTML mockups, animations, and thorough documentation, we get to a more exciting destination, faster.

For this project, we created motion pieces so The North Face team could experience the site as it was intended. Instead of having to hear our intentions explained, they could see it for themselves.

So, how did it turn out? Like the ’92 Blazers, we made it all the way to the final two. As exciting as it would have been to take home the trophy, we see this as a hugely beneficial process that pushed us to explore new ideas and give a lot of enormous digital shops a run.

On to the next one.

Pitch for The North Face main e-commerce site

tnf_home
tnf_category
tnf_category1
tnf_pdp1
tnf_pdp2
03_tnf_home_gen_7_lrg_hotspot
tnf_gallery
tnf_mobile

*All Photography is property of The North Face except for “Climbing & Hiking” FPO photo which was shot by a great photographer named Tony Czech (http://www.tonyczech.com/). All images are used solely for the purpose of discussion, comment or visual aid. All images are not intended for any commercial use or distribution.

Up Next: Building the Baseball Factory
Back to journal.