REI.com Responsive Redesign

I recently participated in the launch of a new site for REI.com. As a design lead within REI’s internal team, I worked closely with internal stakeholders, our own design team, and an outside agency to develop a new experience.

Ultimately, we wanted a design that simplified navigation and highlighted our unique position and expertise in the outdoor space. We also needed a responsive solution that would work across a majority of platforms.

  • Role Senior Interaction Designer / Design Lead
  • For REI
  • Date 2015 / Ongoing
  • Type eCommerce
  • URL REI.com
Before Redesign

The old site was dated, and more importantly, not responsive.

Agency Work

I worked closely with the agency to develop a simplified, activity-based navigation and a more photographic, editorial design presentation that works responsively.

Sample category-level hub page from the agency. Note the visual connection between navigation and editorial content.

Interpretation + Execution One of my key responsibilities was leading the creation of a brand new elemental design system. That guide extended and revised most aspects of the initial agency-provided concepts. It documenting new visual UI elements, ranging from typography standards to button and link styles (among many other things). Our development team used the visual guide to create a global code pattern library currently used across the entire site.

I guided the design team in adapting the agency-provided designs into an extensible system of styles that could work across all responsive breakpoints.

Real-life branded page I designed post-launch using the new design system elements.