Inspirato Design System

Morgan Fuller

Product Designer
Design Systems
UI Designer
Figma

Context

Inspirato is a luxury travel subscription focused on creating a memorable and unique member experience. As a member of the Product Design team, we were a team of 4 designers supporting 80+ engineers shipping consistent products.

Problems & Opportunities

I believe design systems should streamline the design process and focus on 3 goals: flexibility, accessibility and productivity.
When I joined in 2021, I hosted a workshop with the team to align on the problems we wanted to address and these were the highest priority items:
The existing components weren’t built out in a flexible way so designers were constantly breaking them.
The naming conventions weren’t consistent with production code.
Components were missing documentation for new team members.
Accessibility issues were overlooked.

Solutions

1. Optimize components with auto layout and property variables

We went component by component reducing the number of variants, fixing auto layout issues, and improving overall usability.
When variables became an option, we could better align with our code. It unstuck us from work arounds we were using to increase consistency and better match what developers were referencing.

2. WCAG Accessibility audit of our design system

In the fall of 2022, I completed a full accessibility audit of our design system. This involved taking a UX accessibility course, testing each component against WCAG standards, putting together recommendations based on priority and level of effort, and presenting those recommendations to stakeholders.
After getting sign off from leadership, I created a Trello board with all of the recommended updates to improve our accessibility. Designers worked on an individual task, got sign off from the design team, and handed final designs off to developers.

3. Enhance document usability and celebrate wins

Improve design system structure by adding contextual documentation to help find-ability, clean up page structure and remove any pages we didn’t find critical.
Start tracking progress of the tasks being worked on, the types of fixes for each tickets, and celebrate the wins often.

Outcome & Results

By creating a more formal process for our design system and bridging the gap with developers:
13 tickets to improve accessibility have been designed, approved and released to production.
A dedicated team with designers, developers and product managers was formed to meet every month and discuss new design system topics and tickets.
112 items were worked on and published in the design system from the Product Design team since November 2021.

Partner With Morgan
View Services

More Projects by Morgan