19.94. DD 94: Discounts & Passes Wallet UI#
19.94.1. Summary#
This document describes the design and behavior of all wallet screens related to discounts and passes. It defines a unified way to present, manage, and display these entities across the wallet, including their states, structure, and visual representation.
19.94.2. Motivation#
Merchants can provide users with discounts or passes that apply to specific products or services. The wallet must support:
Clear presentation of available discounts and passes Ability for users to review and apply them during checkout Overview of all owned items, including: Currently active Not yet active (future validity) Available for use
A consistent design ensures users can easily understand what benefits they have, when they can use them, and how they affect their purchases.
19.94.3. Requirements#
19.94.4. Proposed Solution#
19.94.4.1. Discounts & Passes Pages#
19.94.4.1.1. Available#
|
|
Inside card next information is displayed:
Name of the discount or pass
Description
For discount card: “Redeemable at:” with the merchant name. For pass card: “Provided by:” with the merchant name.
Validity section:
For active items: “Valid until” with the expiration date. Background color is SecondaryContainer. Text color is onSecondaryContainer.
For future items: “Valid from” with the start date.
Badge used to indicate number of items of the same type. If only one item of the same type is owned, the badge is not shown.
For active items: badge background color is Primary. Text color is onPrimary.
For future items: badge background color is SurfaceVariant. Text color is onSurfaceVariant.
19.94.4.1.2. Expired#
|
|
Inside card next information is displayed:
Name of the discount or pass
Description
For discount card:
Redeemed: “Redeemable at” + merchant name + “on” + redeemed date. Text button Primary color “View order” with the link to the order details page.
Not redeemed: “Was redeemable at:” with the merchant name.
For pass card:
“Provided by:” with the merchant name.
For used pass show text button Primary color “View orders” with the link to the orders list.
Validity section: “Validity period” and date range.
Badge used to indicate number of items of the same type. If only one item of the same type is owned, the badge is not shown.
19.94.5. Test Plan#
(If this DD concerns a new or changed feature, describe how it can be tested.)
19.94.6. Definition of Done#
(Only applicable to design documents that describe a new feature. While the DoD is not satisfied yet, a user-facing feature must be behind a feature flag or dev-mode flag.)
19.94.7. Alternatives#
19.94.8. Drawbacks#
19.94.9. Discussion / Q&A#
(This should be filled in with results from discussions on mailing lists / personal communication.) Got it — here’s a design document–style description aligned with your previous DD format and written for implementation.
—