Order Summary component
Design System
Problem Statement
While designing a new commitment feature for one of my products, I identified a gap in how pricing impact and potential savings were displayed during the order flow. One of my fellow Product Designers had previously tested a custom summary component on another product. Based on her user feedback and the clear need for better visibility on billing, I initiated the design of a reusable Order Summary component. At the time, there was no standardized solution in the Design System, and existing implementations were inconsistent and not scalable.
Objectives
Design a flexible and scalable Order Summary component that clearly communicates pricing details and commitment savings across all product creation flows. The goal was to ensure consistency across 35+ products, reduce UI debt, and improve user decision-making. The component was created in collaboration with the Design System team and shipped with clear guidelines to support adoption at scale.
Documentation link
