// context_&_my_role
| company | REI Co-op — outdoor retail cooperative with a major e-commerce presence across web and mobile |
| team | Design team of 15 |
| my title | UX Designer → Senior UX Designer, Design System |
| tenure | Feb 2016 – Oct 2018 |
| contribution scope | Design system UI library ownership; design/development distribution model; UI/UX strategy for REI Garage e-commerce |
| link | view docs → |
// the_problem
REI's design team had grown to 15 people working across multiple digital properties with a shared HTML/CSS library. Design decisions were being made independently across teams, creating inconsistency across REI's digital surfaces and slowing the handoff between design and development.
The opportunity was to build an updated UI library that created efficiency and consistency gains across the full team and simultaneously apply that design rigor to measurable e-commerce outcomes.
// system_architecture
Component Taxonomy
The REI Cedar was structured around the core interaction patterns powering REI's digital properties: navigation, product display, promotional content, and checkout flows. Components were designed to be reusable across properties while allowing property-specific customization within defined constraints.
Distribution Model
Along with the lead, we established the distribution model for new UI designs and the execution strategy between design and development teams, defining how components moved from design to production, how updates were communicated, and how the library was maintained across a 15-person team.
Education & Adoption
Adoption required more than a component library. I facilitated a full education effort with written walkthroughs and workshops to ensure the team could use the library effectively and consistently.
// contributions
- Built and managed the Cedar UI Library — produced broad efficiency and consistency gains for a 15-person design team; owned the library, the distribution model, and the ongoing education effort
- Established design/development handoff standards — defined the execution strategy between design and engineering that reduced friction and improved consistency across digital properties
// reflection
What worked: Leveraging the use of symbols within Sketch opened up a governance and ownership method that did not exist in the initial system.
What I'd do differently: Start the education and adoption effort in parallel with building the library, not after. We lost some early momentum because the library was ready before the team knew how to use it effectively.