Back to Home

Mastercard

Comet UI

Mastercard's Design System

Comet UI Snapshot

The Challenge

Before Comet UI, Mastercard's development teams faced several critical challenges:

  • Inconsistent user experiences across different applications
  • Accessibility issues affecting compliance and user reach
  • Duplicated development efforts and redundant code
  • Lack of standardization in design patterns and components
  • Slow development cycles due to reinventing common solutions
  • Fragmented Angular component libraries across teams

Our Approach

Comet UI Overview

Solution to Scale an Interface Upgrade

Comet UI was created to address the need for a unified, scalable, and accessible design system across Corporate Solutions. Built with Angular, it provides a single source of truth for design, development, and best practices. Comet empowers teams to deliver consistent, high-quality user experiences and accelerate product delivery while leveraging Angular's powerful features and ecosystem.

Foundations and Styles

Foundations and Styles

Comet's foundations offer a visual language and structure that guarantee a consistent application of design principles across all products. These building blocks enable teams to create accessible, cohesive solutions for users.

Reusable Components and Patterns

Reusable Components and Patterns

Our extensive set of components and patterns accelerates the build and experience for all teams. Comet's architecture ensures each component is flexible enough to meet each company's needs while being rigid enough to create structure and cohesion for a user's cross-platform journey.

Guidelines and Best Practices

Guidelines and Best Practices

Comet's guidelines help product designers and developers make informed decisions, ensuring quality and consistency across all products. These include accessibility standards, research, and platform-specific recommendations.

The Impact

Development Speed

40% reduction in development time for new features

Accessibility

100% WCAG 2.1 AA compliance across all components

User Experience

Consistent, polished interfaces across all Mastercard applications

Looking Forward

Comet UI continues to evolve, with ongoing improvements in:

  • Enhanced component customization options
  • Expanded design token system
  • Improved performance optimizations
  • New component additions based on team feedback
  • Integration with emerging technologies and frameworks