Collection of mockups and cursors depicting cursors from designers and engineers using design system resources to build user interfaces for desktop and mobile screen mockups

Building design systems community

Design systems for finance at Capital One
My efforts to build and maintain design systems resources at Capital One helped define how our enterprise design organization worked together.
Teams:
Multiple enterprise design and cross-functional teams
Users:
The Capital One design organization, Capital One customers
Skills:
Interaction design, systems design, design strategy
Scope:
2 years

IDEA

Bring clarity to the complex ecosystem of product families at Capital One with user-centered design systems practices to help associates build consistent, high quality products.

Design Systems

Starting with basic foundational styles, I helped build a major release of Capital One’s global design system, enabling users across the enterprise to build a new generation of Capital One products.

Sequential depiction of design elements for Capital One interfaces from basic styles to complex templates and experiences.

I translated our atomic design systems philosophy into paired design and code resources, communicating with designers and developers to ensure that these tools fostered cross-functional collaboration.

A designer's cursor and an engineer's cursor having a chat interaction between screenshots of design and code libraries.

Global design refresh

As Capital One prepared a refresh to our design language, I contributed a global design for the web pagination control. I designed this component to adapt dynamically to desktop and mobile web interfaces for internal and external platforms.

Mockups of the web pagination component on a desktop and mobile screen, with callouts for specific component features

Strategy

When I transitioned to a role with a finance data modeling platform looking to implement the global design system, I crafted and socialized a strategy for translating global foundations and components into local platform-specific resources.

Design systems inheritance diagram
Screenshot of the data platform desktop UI with callouts for global and local design system elements

Results

30 feature teams implementing global design libraries

40,000+ weekly component inserts from library resources

Supported delivery of consistent experiences across the Capital One ecosystem, including:

To learn more about my process for building these design systems resources, read the full enterprise design systems case study.