Design System for Columbia Sportswear & Sub-brands
I could talk about Design Systems for days. Not only are they my favorite thing to build, but I passionately believe in their ability to transform and streamline an entire organization - and I don't just mean the design team.
I was brought into a team of two at Columbia and tasked with building an entire system from scratch, not only for the mother ship but for sub-brands such as Mountain Hardware and Sorel.
Design Systems are massive projects taking many months to complete. Deciding what to show here is a challenge because there is just so much, and all of it is interesting. From the most fundamental elements like type and color, to the most complex components, a fully built system incorporates every aspect of a company's digital existence.
Starting with those foundational elements, you begin to build out the next and increasingly more complex layers. Form elements, buttons, accordians, etc. You are building a system that will be used by an entire organization that must be pixel perfect, as it serves as the single source of truth for every digital element of the site. This process requires extensive collaboration with stakeholders, the design team, and dev and constant communication is imperative.
The end result is not only a set of colors, buttons and components, but an entire library of dev-ready pages completely built out with both design and dev teams in mind. We ended up building every existing page of columbia.com using our system, thereby creating a robust collection of highly flexible templates that would allow the design team to quickly and easily iterate on the product.
Using those page templates, I further constructed entire flows of certain sections of the site. Having complete flows, all built with proper components, allows the UX team to have a complete view of complex systems such as order tracking, that they can then refine with ease.
I absolutely love building this stuff.
