Maintaining and evolving a design system is a significant undertaking. Fundamentally, design systems are meaningless if they don’t get adopted and used by people. As Brad Frost called out in a recent talk, “A design system needs to help build real software products.” It’s crucial that the design system is actually linked to product design, to the websites and applications that are shipped and live for customers to use.
Stephanie Poce, a UX manager on the Shopify Polaris design systems team, agrees. “A lot of the time it seems design systems start with a very component focused view, and I think we should really be starting with people. Who is this for and how are they going to use it? How are they going to understand it as their own? And most importantly, how are they going to contribute back to the system?”
These are all questions that come into play as a website design system matures, and as an organization tries to scale and steward the design system to being a successful service. We asked designers at Shopify, TELUS, AirBnB, and Google about their experiences. Here are their top tactics for tackling this challenge.
Building versus stewarding
Building a design system is a different mindset to stewarding it. Building mode is craft focused, whereas stewarding mode requires people who can evangelize, promote, and support the design system in use. “Now that Polaris is two years old, system health is one of our major initiatives. When you’re building a design system you want deeply knowledgeable designers, developers, and content strategists who can think from a systems perspective. Maintaining it requires a different set of skills, like education, promotion, and marketing skills sets,” says Poce.
At Shopify there’s currently a 60:40 split in the work that takes place on Polaris. “Sixty percent of the work is helping the community to use Polaris, for example monitoring the Slack channel, holding office hours, and managing Github issues. There’s a service focus to the work. The other forty percent is evolving the system itself, for example updating components,” shares Yesenia Perez Cruz, a senior UX manager on the Polaris team.
Part of this service focus is making sure that the design system lives as a central part of a company culture. When Gavin Harvey (now at Google) was working at Adobe on the Spectrum design system, he tackled this challenge by hiring someone to focus on it. “Design systems teams have to absorb all of the marketing, support, product strategy, and product management efforts. One of the best things we did with Spectrum was hire a product manager, Veda Rosier. Veda really helped us to know who our customer is, and she helped us to develop onboarding, and marketing materials for the design system.”
Adobe Spectrum serves the many design and product teams at Adobe. Hiring a product manager helped the team to understand their user, and create onboarding and marketing materials that drive adoption of the system. Image by Spectrum.In terms of tactics, Harvey recommends looking at the communication channels you have available within the organization. “At Google we ensure that design system knowledge is a part of every new employee’s onboarding experience. We also rely on internal marketing tactics such as posters, email newsletters and talks to raise awareness about our design system. You can also create videos and posters to put on the wall to spread the word and internally ‘market’ the system.” Similarly, onboarding employees to their design system is also part of the process for new Airbnb team members when they join the company.
In essence, all of these tactics are about embedding the UX design system into the company’s way of working, and providing support for people to use it effectively.
Contribution models and incentives
Once a design system has a baseline set of components, you need to figure out how to support its evolution. Ideally, people across the organization are able to contribute back so that the design system stays relevant for a range of use cases. However, product teams are busy with their own day-to-day work of building and shipping products. Encouraging an active contribution model that draws on the insights of many designers and developers across the organization is a challenge.
At TELUS (one of Canada’s largest telecom companies) the design system team has gamified the contribution model. Varun Jain is the senior technical product owner for the TELUS design system (TDS). “A lot of design systems like Shopify and Atlassian support third-party application builders. TDS is focused on the 400 plus digital designers, developers and content practitioners who are building TELUS customer experiences. We need people from across the outcome focused teams to be contributing to the system. We’re constantly looking at ways to scale the design system, and TDS community was our solution to that.”
A really important part of encouraging the TDS community to contribute to the system has been gamifying the contribution process. “We’ve created something called TDS Community Heroes, where we’ve added gamification to the design system contribution model. When you contribute to the design system you get power levels, and once you have enough power levels these can be translated into tangible swag items like socks, mugs, and lanyards.”
For Jain, the success of the TDS Community Heroes model is a highlight. It’s a testament to how the TDS team has been shifting their focus to enabling users of the design system. “It’s really cool to see the team evolving our contribution model. TDS heroes also means that, in addition to our original core components, we have community contributed components. This is making it an inclusive design system, for everyone.”
The TELUS design system Community Heroes program encourages contribution to the design system by gamifying ‘power levels.’ At certain milestone power levels, people receive custom swag as a thank you for their contributions. Image by Telus.However, one consideration with community components is making sure that the quality and consistency is at the desired level.
The Shopify Polaris team explores concepts like eliminating the spinner component during team ideation and prototyping sessions. These sessions help to keep Polaris fresh and exploring new directions. Image by Shopify.At Shopify, ideation sessions allows the team to explore new directions. These ‘Frideation’ sessions are bi-weekly 5-hour sessions where the team can work together on concepts for evolving Polaris. So far, the team has looked at topics like mapping the Polaris ecosystem, evolving Shopify’s iconography, and how to expose experimental features in the product.
In addition, Polaris Next helps to create a sort of holding place for contributions to the system, while allowing teams to take the time to ensure they are at the right standard. Sara Hill, a senior product designer on the Polaris team explains: “Polaris Next is a way to keep things we want to consume back into the system adjacent to the system for a while. There’s a vetting period. We’ll let people know that it’s there, they can take it and use it, but it’s not yet available publicly. And then over a period of a few months, depending on the size of the component, we’ll consume it back into the main system.” The advantage here is that it allows the team to make tweaks and adjustments and ensure any new components are at their best before getting fully consumed into Polaris.
Education and support for the design system
“Your design is only as strong as your relationships with the teams who use it.” Hayley Hughes, now UX manager of the Polaris Design System at Shopify, was a design lead for the Design Language System at Airbnb, and has given a presentation called ‘Systems Thinking Unlocked.’ We can think of design systems as a platform or service, intended to make life easier for designers and developers. Keeping that system alive is dependent on how well the models of maintenance and support are working.
The Airbnb Design Language System adoption model considers all aspects of the adoption cycle. Image by Hayley Hughes. The central question for the Airbnb Design Language System (DLS) team is, “How might we become a customer-centric DLS stewardship team?” In her presentation, Hughes articulated the distinction between the DLS offering, which is “A living system of reusable assets: guidelines, designs, code, and tools,” and DLS operations, which is “Stewardship to enable the adoption of DLS across all brands and businesses.”
The Airbnb Design Language System partnership program invites people from around the organization to participate in the design system. Image by Airbnb.New hires get a one hour onboarding to the design system, and the team hosts weekly office hours where people can come for Q&A sessions. The team also does research to check in on user sentiment towards the design system. Hughes shared videos of users reading the “love” and “breakup” letters they had written to the design system as part of a research effort.
Meanwhile, at Shopify, providing support to the users of Polaris is also crucial to its success. This is done through the Polaris Air Traffic Controller (often referred to as the ATC). “People can reach out to us directly, or there are dedicated Slack channels where colleagues can submit questions or ask for help. The ATC monitors those and tries to ensure that team members are getting the support they need,” explains Hill, a product designer on the team. “We also offer ninety minute workshops and office hours, where we’ll work through specific issues. If someone feels they want to contribute something back to the system, we’ll work with them to do that too.”
The TELUS design system team has also worked on a lot of education and awareness building. “The team holds monthly workshops. We have sessions for designers and developers where we get people up to speed on the tooling and process of the design system,” says Jain. “A challenge we faced was making sure we had consistency and we were talking to each other across the outcome focused teams. To enable sharing and better communication we created digital platform ambassadors (DPA) across various outcome teams like mobility, business, and home solutions. These are tech leads, design leads, content practitioners, accessibility primes from each outcome focused team along with the core design system team. They meet weekly and come up with suggestions on improvements to the system, or components that they want to add.” The DPA system ensures that components that might otherwise stay as private components in individual business teams’ repositories get surfaced and contributed back into the system.
What all of these teams share in common is a commitment to supporting the design system users, through awareness building, education, and empowering them to contribute their own improvements.
A living system
With a design system, the work is never done. These are living systems that require thoughtful growth, evolution, and planning to keep them living and relevant to teams that are building and shipping digital products.
In the end, knowing how to scale and evolve the design systems of today is a big challenge. There are tensions between how rigid and flexible to make the system, how to be efficient in scaling the system, and how to serve all of the different parts of an organization. “Design systems is such a new concept in general that no one has figured out the right mix. It’s a new territory,” says Hill.
Like any product or service, you have to be people-centered in how you evolve, maintain, and use the systems. For Hill, it’s been exciting to work on a design system that is used across Shopify. “I really enjoy seeing how many people are consuming the design system. It’s been very interesting having an internal audience of designers and developers, and shifting the way you design and think about problems. I’m passionate about design, so to serve designers has been exciting!”
Thank you to all of the people who participated in research, interviews and surveys, and shared their deep knowledge and expertise. For more on design systems, download the Adobe and Idean e-book ‘Hack the Design System.’
Header illustration by Andreea Mica.