Cerulean Design System
I created and managed Cerulean, the design system used across all Gooten products. It was designed in Figma and implemented in React.
Outcome
We were able to ship soooooo much faster— in many cases our time to ship was cut in half. Sprint planning became more accurate and the working relationship between design, dev, and QA was strengthened. User adoption of new features increased, they were able to complete new tasks by using interaction patterns they were already familiar with.
Why Create a Design System
Increase velocity of design and development.
Consistent interaction patterns and visual queues.
Reduce QA workload.
Research & Auditing
I performed an audit of our software products to identify activities and tasks that could share interaction patterns and user flows. I also created a list of every design and development component with a description of its current state and future state. I used this list to plan and prioritize our transition to Cerulean.
Principles
Intuitive
Embrace complexity and make it inclusive and easy to use
Transparency
Create magical moments but let the user see behind the current
Beauty
B2B software should be beautiful and enjoyable to use
Respect
Assume the best in our users, maintain a direct tone, be honest and approachable
Prototyping
User Testing
DevKarl Rodulfo
Product ManagerChaz Giese
Gooten
Date2021