Setting up your design system for success.

We interview stakeholders, set goals, measure, test, and gather insights through tried and true research methods to make informed design decisions. This human-centered approach to design has become a standard for creating outstanding user experiences, and we also need to apply this same rigor to planning and implementing design systems to ensure we are set up for success.

Design systems strengthen creativity and motivate teams to focus on creating lasting, desirable, useful digital products and services. As the name implies, the system facilitates more flexible workflows and solves communication gaps our field encounters, such as collaboration between designers or design-to-development handoff. Ultimately, what you do when making a design system is support a community.

This community includes all of the people that will use the design system, that will find value from it, and in most cases, this reaches beyond specific teams, silos, and business units.

Let’s start with a simple definition of what a design system is.

A design system equips designers and engineers with a shared language for creating digital products. Design systems are reusable components in both design and code, governed by a set of standards that allows teams to collaborate and communicate across different roles and responsibilities. They provide an essential set of tools and practices that support an organization’s goals for improving the customer experience across a portfolio of digital products and services, all while reducing costs through efficiencies of scale.

Composed of reusable assets, functional code, guidelines, and processes shared across groups, organizations use design systems as a source of truth when deploying new digital products and services. They are a natural evolution of traditional brand guidelines, providing the framework for how a brand behaves across the digital ecosystem.

The use of patterns in digital product design dates back to the 1960s. More recently, the Atomic Design structure, coined by Brad Frost, focused on deconstructing web interfaces into smaller parts as a means for creating repeatable patterns and promoting ease of development. By improving designer-developer collaboration, teams can make end-product features with greater velocity and minimal rework.

But design systems are more than a means to enforce standardization; they are an essential tool to empower product teams to be creative while contributing to scalable products. These teams can spend less time styling individual components and more time on the overall product experience. They can leverage existing patterns and establish new ones as needed. The design system encourages teams to spend more energy on higher value tasks like defining unique experiences, solving specific user needs, and creating more thoughtful and robust solutions.

– IBM’s Carbon Design System

Organizations that have largely led the way in making design systems a critical part of the business have roots in technology. Examples such as IBM’s Carbon, Shopify’s Polaris and Google’s Material Design show how these brands have defined the rules of their digital ecosystems through a set of rules on color, typography, animation, and more. Material Design, first released in 2014 and now in its 3rd version, still guides internal and external teams after nearly a decade of use and feedback from the community. This added benefit of constant improvement and evolution is lost within organizations that haven’t yet instituted a design system approach.

Improving the customer experience, reducing redundant costs, enabling innovation – design systems have numerous benefits that translate directly to business. See our post on Making the Investment Case for your Enterprise Design System to learn more.

How do we know if a design system is successful?

The successful implementation and management of a design system is largely reliant on the team responsible for maintaining its content, processes, and evolution, and their ability to invest the necessary time. The most advanced organizations have instituted methods to track adoption rate, consistency, and user feedback to provide stakeholders and future design system users with insight into the benefits of the design system to the team, and its value to the business.

To drive the greatest value, design systems should be considered products that must be nurtured and improved over time, and not simply a means to an end. Through this lens, teams can evaluate the structures they create and offer better solutions as the design system evolves with time.

At the most basic level, organizations should find increased efficiency in both the design and development process for new digital products, services, and experiences. Along with decreased time spent in quality assurance testing, more advanced measurement around accessibility and usability are metrics to strive towards.

There are many considerations at the early stage of planning a design system that will help steer your team towards success. This includes the organization and its overall buy-in to design (ideally from the C-suite down), the team responsible, system architecture, technology, tools, and frameworks. This starts by clearly articulating what matters most to the business and the team, and will always be unique from organization to organization. We developed our Design System Playbook to provide those leading the charge with the tools and resources needed to elicit and build interest in design systems across the business.

If you’re getting started down the path of putting a design system in place, consider the following initial steps:

Define your first principles–

• What business objectives will be supported by a design system?

• What goals does your team expect to achieve by implementing a design system?

• What are the known barriers and roadblocks to getting a design system in place?

Define the stakeholders, needs, and impact –

• Who are the primary users/teams of the design system and what are their requirements?

• What is the expected scale of the system to start?

• What areas of the business might be immediately impacted?

Define the governance model and processes –

• Will there be a dedicated design system team, or will product teams be responsible?

• How will we onboard users/teams across the organization to the design system?

• Who will be invited to contribute, maintain, and subscribe to this system?

• What is the realistic cadence for updates and improvements?

• How will changes be communicated?

Like most efforts, the approach you take will largely impact the success of the initiative, and a design system is no exception.

• Audit – Evaluate the brand, current digital ecosystem, existing assets, and stakeholders to gain a clear idea of the playing field, as each organization’s needs will be unique.

• Define – Establish the program’s principles, goals and objectives, expectations, and governance model to provide the necessary structure of the engagement and the system.

• Build – Iterative approach to establishing design language, production of tokens, components, patterns, modules, pages, and templates, and implementation of performance tracking.

• Test – Evaluate the system against user needs for ease of use, test and optimize performance of components, and where possible, test with end users within the context of a product.

• Document – Organize resources, guidelines, processes, and key metrics into an easy to use, searchable platform that aligns users and stakeholders on how the system works.

• Publish – Onboard and introduce the ready to use design system with product owners, design teams, engineering groups, and all other necessary parties.

• Maintain – Develop a cadence for regular reviews on user feedback and design system performance, deploy improvements as needed, and clearly communicate updates with users.

Understanding the success of your design system means taking a health check on a recurring basis. This should focus on a review of the KPIs you defined in the planning, design, and implementation process. Running a quarterly product analysis will help bring clarity to how teams are engaging with the design system and will gauge their relative level of satisfaction – a critical measure of success.

More specific quantitative considerations include:

Adoption: How many teams are utilizing the design system? When updates are deployed, are teams making use of these improvements? It’s also insightful to track which users and what roles are utilizing specific assets to understand which documentation each group uses most.

Component Usage: Which components are most used, how frequently, and in what ways? While the best approach is to simplify components so that they can apply across projects even as contexts change, in some instances, the features of certain components may need to be specific. Tracking component usage is one way to identify your system’s most and least popular parts, helping design system teams optimize the system over time.

Adaptability: Are contributors adding new components and notes? What is the number of requests for new additions? As your design system evolves over time, is your team making adjustments and improvements and noting their activity to provide visibility to other users? The level at which the system begins to support its users will be a meaningful measurement to keep an eye on.

Reliability: Is production code and design documentation in sync? This metric might be best used to understand how up-to-date the design system is. If the code and design documentation aren’t in sync, this isn’t the end of the world. However, the more code and designs deviate, the more difficult the system will be to manage, and over time this may erode trust in the system and lead to abandonment.

Velocity: How long does it take to implement a change? Measuring the speed at which it takes to design, build, and deploy a feature before and after the design system has been implemented is helpful in tracking if the system is improving workflow and overall efficiency. Note that speed is not the end goal but an indicator. To understand the context of velocity, compare this metric with qualitative insights (below).

Some goals are harder to measure and require a qualitative approach. User experience (UX) research methods like interviewing, conducting surveys, testing, and recording your team’s perspectives might be enough to understand the baseline for how people feel about the system.

– Google’s Material Design

On the qualitative side, you may also want to evaluate the following:

Efficiency: Do adopters feel more or less efficient when using the system? Defining and analyzing efficiency takes a lot of work to measure quantitatively. Examining velocity might provide hard numbers on the effectiveness of your team, but that might only be part of the story. Talk and trial the design system with its users and ask about their workflow and how it might have changed. Continuing to have these conversations will lead to insights into how the design system is working for them.

Satisfaction: How do teams/users feel about using the system? Like any product, setting up a feedback cycle, conducting interviews, or running usability tests is beneficial to get a read on the perceived value that a design system provides. Ask primary users and teams to rate their experience around how they use information from the design system, what processes and assets are most valuable to them, whether or not it meets their needs, and possible improvements to consider.

Growth: What improvements are requested and which ones should be considered? As people use a design system, expect suggestions for improvements over time. Getting feedback is an excellent sign that your design system is able to evolve. Remember, a successful design system requires ongoing management beyond the initial deployment. Like any digital product, a long-term roadmap will ensure your design system remains relevant into the future. Keep receiving feedback and keep the information relevant to the community.

Design & Technical Debt: What did we overlook, over-simplify, or skip during the initial production cycle? Debt in a design system is the cumulative result of the priorities we agree to in order to reach a deadline. For example, forgoing user interviews that may seem unnecessary may reduce time up front, but will create noticeable gaps later. Inconsistencies in UX, operations, visual design, and architecture can lead to a poor result and an undesirable end user experience. Debt can be measured and tracked through some of the suggestions previously mentioned. Have a plan to prioritize and act on these shortfalls.

These insights should be cross-checked against questions asked at the start of the project to compare how close the end result lived up to expectations. While qualitative insights may seem less direct, they often carry more weight. Soundbites from users will help inform and motivate your design system’s constant evolution.

Challenges to keep in mind.

Like any large-scale initiative, and especially those that impact many different areas of a business, putting in place a design system can come with certain risks and challenges.

Whether your team is as small as three users or as large as an entire global enterprise, a design system will require long-term commitment and ongoing maintenance to stay relevant to the communities it serves. That is why, even after all the work of organizing and building, any design system will have flaws.

• Context changes and documentation can become out of date if not properly managed

• It can be unclear who has what level of access and ability within a design system

• Without recurring review of the system, KPIs, and without feedback from users, success can be unclear

As just a few of the possible challenges to consider, addressing these concerns at the beginning of a design system project will help your team plan for success.

It’s no secret that good design is good for business. And the importance of embracing design as a lever from the top of the organization is becoming standard for high-performing organizations. Competing in crowded, consumer-driven marketplaces requires an ability to both stand out and deliver on customer needs in a substantial way.

While organizations scale up their design teams and continue to invest into digital products, services, and experiences, the design system provides the critical foundation to create alignment, drive efficiency, and to establish the business as a leading brand. It also allows for teams to avoid rework and instead focus on solving the larger, more complex needs of the business. That is the underlying value a design system provides.

If your team is exploring what a design system might do for your business, or starting to evaluate how to approach putting a design system in place for your organization, reach out to us. We’d love to share our process and how we’ve helped our clients deploy design systems at the product and organizational level.