The ROI of Design Systems: Executive Summary

Managing the complexities of large digital portfolios is never easy, and this is particularly true when on-time, on-brand delivery is imperative. But for leaders, managing complexity is only part of the challenge. The other part is sustainable ROI.

As inflation and global instability add headwinds for many organizations, finding a sustainable approach to product development has never felt more urgent. Are Design Systems part of the solution?

To determine if a Design System is right for your organization, this whitepaper outlines the business case for Design Systems as well as the key inputs you need to calculate ROI. This will provide everything you need to make the case, obtain funding, and start building.

Getting Started



Benefits multiplier represents employee benefits such as insurance, vacation, pensions, etc.

The ROI of Design Systems: The Business Case

Introduction

Great ideas delivered sustainably at speed and scale win markets. Whether your goal is to win an existing category or to invent an entirely new one, the research is clear, first movers dominate. To sustainably deliver at scale, a Design System are necessary. 

To understand why, let's examine how Design Systems power the three domains of modern Experience Design.

 

The first domain deals with the role of branding (the distinguishing narrative behind what you do and why you do it). The second domain is the customer experience (a customer's perception of your brand based on their cumulative interactions with your employees, systems, channels, and products). The third domain is the employee experience, (how well employees are able to efficiently and effectively produce the intended experience). 

To power each of the domains simultaneously, high-performing organizations use Design Systems to:

  • Ensure brand consistency across all digital touchpoints
  • Continuously improve the customer experience
  • Provide employees with the tools they need to deliver on-time and on-brand

With this in mind, let’s take a look at the specific challenges Design Systems solve in each of the three domains.

Previous Chapter

 Executive Summary

The ROI of Design Systems: Brand Management

Brand Consistency

As your organization scales, maintaining brand fidelity across all digital channels is challenging. Oftentimes, these challenges are the result of outdated brand usage guidelines or ill-suited for use within omnichannel digital environments. 

In such cases, off-brand design patterns can proliferate across the portfolio and affect consumer perception of your brand. 

 

Remediating off-brand experiences at scale typically requires spending valuable time and resources on bugs rather than new and improved experiences. To address this and to avoid future harm to the brand, a Design System ensures brand consistency using a systematic approach. 

With a Design System, your organization's design standards, as well as its brand assets and guidelines for implementation, become atomized, centralized, and version controlled. In effect, the Design System becomes a curated hub of evolvable brand assets.

 

Naturally, this systematic approach not only counters the manifestation of off-brand design across the portfolio, but also alleviates much of the unnecessary churn and rework that prevents product teams from focusing on what really matters. 

Ultimately, from a branding perspective, the business case for a Design System boils down to protecting the brand while gaining efficiencies to:

  • Create a single source of truth and maintain brand fidelity across all digital touchpoints
  • Reduce off-brand remediation effort (rework and churn)
  • Enable the automation, propagation, and evolution of renewed brand assets en masse

The next step involves estimating the cost savings a Design System creates through improved brand consistency and automation.

Cost savings from reduced off-brand remediation effort:

This formula estimates the potential cost savings your organization can realize using a Design System to reduce or eliminate branding inconsistencies.

 

Your Organization Today



Estimated Rework Cost

$2,180,250.00


Potential Savings Using Design System

$114,750.00
Assuming 5% cost reduction with a Design System

How it works:

This formula uses the inputs entered in Chapter 1 to calculate the benefit of spending less time on brand-remediation using a Design System. It assumes the following:

Digital team size x Estimated Average Salary x Benefits Multiplier x Estimated % of Time Spent on Unplanned Brand Rework x 5% Design System Cost Reduction

† Benefits multipliers represent employee benefits such as insurance, vacation, pensions etc. 

Brand Evolution

Refreshing your brand across an entire digital portfolio is daunting. At scale, it's nearly impossible to do efficiently and effectively without a centralized system to deploy brand updates.

To manage this, Design Systems use versioning and automation to deploy and propagate updates in a systematic way that product teams can easily adopt. This systematic approach will significantly reduce the time, cost, and effort required to evolve your brand experience.

 

Your Organization Today



Estimated Brand Update Cost

$2,180,250.00


Potential Savings Using Design Systems

$114,750.00
Assuming 5% cost reduction with a Design System

How it works:

This formula uses the inputs you entered from Chapter 1 to calculate the benefit of spending less time on brand-remediation using a Design System. It assumes the following:

Digital team size x Estimated Average Salary x Benefits Multiplier x Estimated % of Time Spent on Brand Updates x 5% Design System Efficiency Improvement

† Benefits multipliers represent employee benefits such as insurance, vacation, pensions etc. 

So what?

Managing brand assets and ensuring consistency across a large digital portfolio is arduous without the right systems in place. As the first formula demonstrates, the cost of remediating off-brand experiences can be significantly reduced by implementing a Design System. 

And as the second formula illustrates, Design System automation can significantly reduce the cost and effort required to deploy a new brand experience across your digital properties.

Want to run your own estimates? Download our free DS ROI spreadsheet. 

 

 

 

Previous Chapter

 The Business Case

The ROI of Design Systems: Customer Experience

Consumer expectations have evolved considerably over the past thirty years. Amid a vast array of choices, today’s consumers eschew generic products and services that don’t live up to their brand promise. 

For many customers today, a great product or service may get their attention, but it will not win their loyalty. Instead, what consumers really want for their loyalty are experiences – the more personalized, the more memorable, the better. 

But for many organizations, earning that loyalty means creating customer experiences that are on par with those of leading CX organizations like Apple, Adobe and Google. To meet that bar, your organization must continuously improve on two fronts.

The first is the interaction experience, which anchors on three key questions: 

  • Is it easy to connect with the company? 
  • Does it seem like the company knows me? 
  • Does this experience match other best-in-class services I use? 

The second is the product experience and your customer’s perception of:

  • How well the product works
  • How easy it is to use
  • And most importantly, whether it made life better in a meaningful way  

It’s important to note that customer perceptions of what good looks like and what good feels like will continue to evolve with technology acceleration and emergent CX trends. To better manage this continuous evolution, modern organizations use Design Systems to test new experiences while they simultaneously refine what exists now.

 

 

To power this self-sustaining approach, Design Systems provide two key capabilities that every organization operating digital-at-scale needs to stay ahead of an evolving CX curve. 

The first capability is speed. In our experience, Design Systems strongly correlate with the Pareto Principle, also known as the 80/20 rule. As depicted in the diagram below, delivery times typically improve 40% to 80% as UI component coverage reaches 20%.

 

The second capability is adaptability. As depicted below, Design Systems create the atomic design elements product teams need to continuously adapt the customer experience as technology trends change without reinventing the wheel.

 

These efficiency gains can be reinvested into new revenue-generating business outcomes. By reducing the cost of production and improving time to market, Design Systems provide product teams with the capability to simultaneously test multiple experiences at the same time. As a result, teams can learn quickly what works and what doesn’t rather than going all-in on one solution.

 

From a customer experience perspective, the business need for Design Systems is clear. They are the only way to:

  • Consistently improve both interaction and product experience
  • Speed time-to-market by removing 80% of the effort (the Pareto Principle)
  • Reinvest efficiency gains into new revenue-generating opportunities

To estimate these benefits in the context of your organization, we’ve included the following formula to estimate the potential revenue generated through reinvested time savings.

 

Your Organization Today



Design System Multiplier

This field assumes 20% UI coverage = 80% delivery time improvement. This field is customizeable. You can edit the default 80% to any number you choose.



Potential Benefits

9.60
13.00
$429,000.00

How it works:

This formula estimates time saved using Design Systems to power your Customer Experience. It assumes the time saved can be reinvested into new experiences that generate revenue. 

To calculate the Delivery Weeks Saved, we've assumed an 80% improvement in build time as 20% of your most commonly used UI elements are componetized as follows:

Average Project Delivery Time in Weeks x 80% Time Improvement = Weeks Saved

To calculate the Added Project Capacity, we've... 

Finally, to calculate Potential New Revenue, we've applied the following formula:

Delivery Weeks Saved x Revenue Generating Experiences

where

Revenue Generating Experiences = Freq. of Experiements Per Year x Total Lines of Business x Experiment Success Rate x Experiment Impact x Product Business Size

† For Experiment Success Rate, we've assumed x%

† For Experiement Impact, we've assumed x%

So what?

When product teams are chronically overloaded with work, finding enough time and capacity to improve CX, test new experiences and generate new cash flows can be daunting. As the data in the calculations prove, Design Systems have the potential to regain the time and capacity your organization needs to develop a best-in-class CX practice. 

Now what?

Want to run your own estimates, download our free DS ROI Estimates spreadsheet. 

Previous Chapter

 Brand Management

The ROI of Design Systems: Employee Experience

Employee experience matters. If you want great CX, pay attention to EX. 

High-performance cultures understand the value of a high quality employee experience on organizational performance. To improve the employee experience, these high performers make significant investments in core enablers like Design Systems to increase focus and flow and remove many frequently occurring impediments that diminish productivity.

At a workflow level, Design Systems improve the employee experience by automating or at least reducing common product development challenges that create excessive wait times and lead to increased multi-tasking and decreased motivation. 

In essence, Design Systems help teams pull value whenever they need it, exactly how they need it, so that work starts and finishes sooner, with less wait time in what is often called a single-piece flow. 

Sample text

edit

For employees and product teams, working in a single-piece flow has many advantages. As shown in the diagram above, a single-piece flow eliminates the need to multitask which in turn reduces the harmful effects of continuous context switching on quality and morale. Similarly, for product leaders, operating in a single-piece flow enables the consistency needed to reliably meet commitments, and accelerate the feedback loops that improve time to learning. 

Naturally, these benefits extend to the organization as well. In our experience, when employees and teams attain focus and flow, overall throughput, or the rate at which an organization monetizes its products and services will also improve. As shown in the diagram below, improving the employee experience to increase throughput can have a big impact on an organization's top line.

To complete this section, we’ll now translate the qualitative benefits described above into quantitative values using two formulas. 

The first formula demonstrates how Design Systems improve time to market by reducing “wait time”. The second formula builds on the first, by demonstrating the impact of reduced wait time on Throughput and Revenue.

Estimating the impact of wait time reduction on Throughput

Our first formula estimates the impact of reducing wait time on throughput. As depicted in the diagram below, wait times in product development typically account for 90 to 95% of the total time required to transform a customer need into customer value. 

To apply the formula for your own calculations, you can either use the default values provided or enter your own estimates into the Average Waiting Time in Product Development field.

 

Your Organization Today

66.67%


Design System Multiplier

Our default value assumes Design Systems increase workflow efficiency by 20%. You can edit the default to any number you choose.



Potential Benefits

21.95%
108.00
$1,463,414.63

How it works

This formual estimates the impact of improving Flow and Throughput in your organization. It assumes Design Systems help teams "deliver sooner" by reducing waiting time in the workflow. Reducing waiting time is a key lever to increasing Throughput. 

To calculate Organizational Throughput, our formula divides the Estimated Number of Projects Delivered Last Year by the Average Project Delivery Time.  

The Design System Efficiency Improvement then removes 20% of waiting time from the workflow to calculate an overall increase in Throughput, Production Days Saved and Financial Throughput using the original Estimated Number of Projects Delivered Last Year and Average Project Delivery Time.

So what?

High-performing organizations understand that improving the employee experience provides a lot of upside. Qualitatively, happier employees are easier to attract and retain. Quantitatively, improved productivity and throughput are the keys to increasing revenue. 

Now what?

Want to run your own estimates, download our free DS ROI Estimates spreadsheet. 

Previous Chapter

 Customer Experience

The ROI of Design Systems: Calculating ROI

In the previous section we introduced several formulas your organization can use to approximate the return side of the ROI equation. The calculator below summarizes those returns. Moreover to help approximate the cost to build a Design System, we've included a rough cost estimate to complete the investment side of the ROI equation.

ROI and Payback Period

 

Potential Value Gains Using Design Systems

$229,500.00
$429,000.00
$1,463,414.63
$2,121,914.63


Estimated Cost to Build a Design System



Estimated ROI

54.32%
0.65
Assuming that the revenue gained per year remains consistent

 

Summary

Now that we’ve clarified how to calculate the ROI and the Payback Period, the next step is to think about the implementation and determine whether or not it makes sense to engage a vendor. To help navigate that process, Part 3 provides a pragmatic and adaptive approach to partnering.

Previous Chapter

 Employee Experience

The ROI of Design Systems: A Pragmatic Approach to Partnering on Design Systems

Why Partner?

Implementing a Design System from the ground up can be challenging. To deliver quickly and avoid waste, you'll need experienced design and engineering expertise and a battle tested approach to delivery.

And while those capabilities no doubt exist within your own organization, finding enough internal capacity to shape, prioritize and deliver the work may be difficult. 

To solve for this, many organizations choose to partner with experienced vendors like Rangle. Partnering provides the capacity, experience and specialized skills needed to reduce waste, accelerate delivery and derisk the initiative. 

On this point, it's important to point out that partnering doesn’t have to mean committing to a long, complex and costly endeavour. In fact, it’s quite the opposite. In our experience, the best way to partner is by committing to shorter engagements that emphasize responding to change.

To better understand how adaptive partnerships work in practice, we’ve included the following summary.

Adaptive Planning, Budgeting, Reporting

In a traditional plan-driven delivery model, scope, schedule and cost are defined upfront as "deliverables or outputs". In theory, the plan-driven delivery model assumes risk can be mitigated through extensive and detailed planning. In practice however, this approach is flawed because it attempts to define and measure scope, schedule and cost performance at a point in time where uncertainty is extremely high. This uncertainty leads to significant buffering of the time and cost variables which in turn escalates risk, requiring more detailed analysis, planning and reporting.

To avoid this, Rangle recommends a value-driven delivery model.

In the value-driven model, delivery teams manage risk using iterative test and learn strategies to remove uncertainty. Over time, this test and learn strategy creates enough artifacts to deliver an increment of deployed business value.

From a planning, budgeting and reporting perspective, this adaptive approach to working provides several benefits which we've summarized here:

Adaptive Planning:

To successfully manage a Design System implementation, there are two key variables you must manage as part of the Technology Adoption Curve. The first is adoption and the second is utilization.

(show tech adoption curve)

To effectively "cross the chasm" and achieve broad adoption and utlization, its important to take an adaptive planning approach rather than attempting to define the entire solution upfront.

It also places an emphasis on outcomes rather than outputs. Outcomes focus on what we need our customers, users or stakeholders to do differently in order to produce a desired business benefit. Outputs focus on producing artifacts that rarely provide learnings or business benefit. Outcomes provide the frame teams need to understand the why and the what so that they can define and prioritize the how. From there, teams run their testing strategies and frequently revisit the why, the what and the how based on what they've learned.

Adaptive Budgeting:

From the budgeting perspective, working adaptively provides organizations with the ability to budget increments of development rather than committing to a large upfront cost. Moreover, where uncertainty is high, adaptive budgeting provides leaders with the opportunity to purchase options for further discovery. 

Adaptive Reviews, Reports and Forecasts:

From the reporting perspective, adaptive working shifts the focus of reporting away from adherence to scope, schedule and cost. Instead, adaptive reporting examines and compares progress made toward desired business outcomes.

Frequent progress reviews provide teams and stakeholders with the opportunity to examine and validate or invalidate the the working hypothesis. If the working hypothesis is still valid, the review cycle provides teams with the opportunity to describe their next steps and forecast the future value they expect to create. Alternatively, an invalidated working hypothesis can be pivoted quickly toward a new hypothesis based on what was learned to date.

Summary:

The adaptive planning, budgeting and reporting approach outlined in the article provides significant benefits for organizations looking to manage a design system implementation. By taking an incremental and iterative approach to development, teams are able to focus on outcomes rather than outputs and manage risk using test-and-learn strategies. This allows for greater flexibility and adaptability, which is essential when trying to cross the chasm into broad adoption and utilization.

Previous Chapter

 Calculating ROI

Next Chapter

Conclusion 

The ROI of Design Systems: Conclusion

The ROI of Design Systems: Downloads and Resources

Previous Chapter

 Conclusion