Blog Measuring the value of our design system
Published on: February 16, 2021
6 min read

Measuring the value of our design system

As our design system matures over the years, we are tracking how useful it is to our product teams.

insights.png

Through the years, GitLab has become one application for the complete DevOps lifecycle. With this growth, I’ve watched GitLab scale from roughly 75 people to over 1,300. As our UX department has grown, so have our workflows and processes. Since I joined in 2016, we’ve hired a department of over 60 world class designers, researchers, and tech writers. We’ve adopted processes that help improve the user experience, such as Jobs to be Done and UX Scorecards, and we’ve begun measuring our System Usability Scale score to track GitLab’s perceived usability.

To ensure we have a foundation that supports our evolving processes, we’ve been actively building our design system, Pajamas, since 2017. Our main goal has been to create a first-class internal product that supports the workflows of product designers, engineers, and product managers, allowing them to more efficiently perform their roles.

Back in 2018, our design system was only just forming. As a product design team, we worked together to define foundational design elements such as our three product typescales, color palette, and spacing scale. We started creating a pattern library that designers could use in Sketch and built out key components such as buttons, form elements, and dropdowns. However, our design system was a blank slate consisting of a skeleton structure for building out fundamental elements, components, regions, and content guidelines. At that point in time, we did not have a robust component library, let alone a useful design system.

Even though we were only at the beginning of where we wanted Pajamas to go, we knew it would be important to track how useful our system was over time. We sent out our first survey in April of 2018 to gauge how product designers were spending their time and how useful our current system was to them.

Since then, we have developed Pajamas to support the workflows that have evolved with our growing UX department. Our design system now includes design principles, guidelines for foundational design elements and components, accessibility audits, usability standards, and more. We’ve included live-coded components and are working towards creating conceptual models for our core objects. With all of the progress that we’ve made over the past 2.5 years, we decided it was past time to send the same survey from 2018 to compare how our system has improved the efficiency of our designers over the years.1

Themes

Comparing the survey results, it was apparent that the increased maturity of our system has resulted in improvements to the efficiency of our day-to-day workloads. We’ve grouped these findings into four themes.

1. Pajamas is referenced frequently and is perceived as very useful in our workflows

We are excited to see that Pajamas is being referenced frequently for most problems by designers. In 2017, designers rarely referenced our system and felt that it was not very useful. When compared to today, over 75% of designers find it very useful to their work.

A chart showing how often designers reference Pajamas when working on design tasks. The chart shows the frequency increasing since 2018. A chart showing how often designers reference Pajamas when working on user experience tasks. The chart shows the frequency increasing since 2018. A chart showing how useful designers perceive Pajamas to be. The chart shows the usefulness increasing since 2018.

2. The number of questions designers receive about the styling and usage of components is decreasing

As we build out more robust usage documentation and live-coded components, designers are being asked fewer questions on average regarding how a component should be used or styled. Our development teams have more autonomy to build out interfaces, allowing teams to be more efficient and iterate faster.

A chart showing how often designs help clarify the styling of a component. The chart shows the amount of time decreasing since 2018. A chart showing how often designs help clarify the usage of a component. The chart shows the amount of time decreasing since 2018.

3. There has not been a significant difference in the amount of time designers are spending writing documentation

Although the amount of documentation has dramatically increased over the years, designers do not feel that they are writing more documentation in an average week.

While we want time spent on documentation to stay relatively low, we also want to ensure the barrier of entry to contribute is not too high. We believe it’s important that both designers and engineers can easily contribute to Pajamas regularly. As a second part to this survey, we asked questions to gauge how people feel about contributing, and are now working to make it easier.

A chart showing how much time designers spend writing documentation. The chart shows the amount of time staying the same since 2018.

4. There is more time to spend on brainstorming and solving real user problems

Designers are spending less time responding to questions and doing feature reviews. One of the most impactful and exciting changes since we sent out our survey in 2018 is that product designers have more time to work on brainstorming and creating solutions to new problems. As we grow our processes and standardize the user experience across the product, designers are spending upwards of 50-75% of their time on solving real user problems compared to 25% on average in 2018.

A chart showing how often designers spend responding to questions regarding components. The chart shows the amount of time decreasing since 2018. A chart showing how often designers spend responding to questions regarding new features. The chart shows the amount of time decreasing since 2018. A chart showing how often designers spend working on solving new problems. The chart shows the amount of time increasing since 2018.

Summary

The qualitative data we collected helps us determine the impact of our design system. Over the years, we have seen Pajamas grow into a robust system that supports cross-functional product teams. From our most recent survey, we can see that product designers are asked fewer questions, engineers have more autonomy, there is more time to focus on real user problems, and Pajamas has become a useful tool that is frequently utilized to help address a variety of UX and UI questions.

While Pajamas has come a long way, we believe there is a long way to go. Check out the direction page of our Foundations team to learn more about what we are working on to improve our system even further.

  1. While this blog post has a primary focus on designers, we are also interested in how the system improves the workflows and processes for all of Engineering and Product. Our surveys also include responses from cross functional partners.

We want to hear from you

Enjoyed reading this blog post or have questions or feedback? Share your thoughts by creating a new topic in the GitLab community forum. Share your feedback

Ready to get started?

See what your team could do with a unified DevSecOps Platform.

Get free trial

Find out which plan works best for your team

Learn about pricing

Learn about what GitLab can do for your team

Talk to an expert