MetLife
Design System

MetLife moved their design library from Adobe XD to Figma. We created the global design system in Figma, along with functional prototypes and system guidelines and documentation. We enhanced collaboration across design and marketing teams at MetLife.

Year
2024

Client
Aquent Studios / MetLife

Roles / Responsibilties
UI Design
Design System
Prototyping

Legacy Library

The existing XD library lacked streamlined components and patterns, usability requirements, and consistency. Hindering usability for both designers and developers.

Design System

We centralized design assets, established a streamlined components library, and organized MetLife design tokens with variables, components, patterns, and templates. Ensuring consistency, simplifies collaboration, and enhances efficiency across design, marketing, and development teams.

Interactive Prototypes

We designed and prototyped several prototypes that demonstrated complex flows including onboarding, dashboards, intake, and more.

Onboarding Experience
Tailored for new policyholders, this prototype introduces users to their health insurance benefits and services through a personalized onboarding experience. It includes interactive tutorials, policy summaries, and guided tours of key features to ensure a smooth transition and promote engagement with the insurance offerings.

Dashboard (Employee, Employer, Manager)
Dashboard for data visualization, incorporating features such as filters, sorting, and dynamic content updates.

Claims Submission
Guides users through the process of submitting insurance claims for policyholders. uploading documents, providing necessary information, and tracking the status of their claims, ensuring transparency and efficiency in claims processing.

Intake Form
Data collection process of gathering patient information and insurance details. Featuring form fields, validation checks, and clear instructions to facilitate accurate data entry and submission for efficient processing.