case study

Knapsack heals a sick design system to reduce digital production time and costs

How Knapsack repaired digital production for a global ecosystem

CUSTOMER PROFILE

  • Fortune 500 pharma company
  • 69,000+ employees
  • Operates globally in 160+ national markets
  • Maintains 80+ major brands and 120+ websites

IMPACT

  • Projected over $10M savings annually
  • QA time reduced by over 30%
  • 60 days to value

Overview

This global pharmaceutical company with market presence in 160 countries struggled with a fractured toolset leading to confusion and disconnects across a global team supporting dozens of brands and website properties. Despite investment in design system tooling over the past 12 months, they continued to face challenges operating at scale.

The Challenge

Disconnects across design and engineering resulted in inefficient website delivery, jeopardizing roadmaps for projects that directly impacted patients and caregivers across brands and markets. With both internal and external stakeholders involved in production, changes were needed to update tools and processes. Desperate for a way to get back on track, the organization's Digital Product, UX and Engineering Leaders chose to partner with Knapsack.

The Solution

With strategic guidance from Knapsack, the design system leadership team established a roadmap to support the vision of a unified design system platform. The initial migration from their existing tool suite – including Supernova, Confluence, Storybook, and custom tools – took two weeks and provided a new foundation to move forward.

As a new design and code system was implemented, Knapsack unified design assets, usage guidelines, and interactive code playgrounds that helped to align expectations across all stakeholders and functions. In addition, to deliver a scalable model for the organization’s ever-growing roster of brands, Knapsack worked with Design and Engineering teams to implement a theming solution that unites design (Figma + Tokens Studio), code (Git), documentation / playgrounds (Knapsack) and end user experience (Adobe Experience Manager) through a single connected pipeline.

The Impact

The partnership between Knapsack and the organization’s Design and Engineering teams helped to align web delivery team capabilities with the company's strategic global priorities and produce exceptional bottom line results and wins for everyone involved.

60 Days to Value

Migrated and enhanced design documentation site within 60 days.

Reduced QA Time

System-level testing via Knapsack reduced analytics team QA time by over 30%.

$10M Cost Savings

A focus on unified and reusable components is estimated to save over $10M annually in external agency spend.

Increased Visibility

Speaking and education opportunities to highlight the team’s success within the design system community.

Create a design system you can trust