# Checkout with merchant card on file
source: https://developer.mastercard.com/unified-installments/documentation/experience-design-guide/installments-solutions-for-existing-cards/designs/checkout-with-merchant-cof/index.md

At checkout, the cardholder selects the saved card on the merchant's store website. Eligible offers are displayed to the cardholder. They select the preferred installment plan, review the terms and conditions, and place the order. Once the purchase is completed, they receive purchase confirmation from the merchant.

## UX Journey {#ux-journey}

For the best viewing experience of the UX journey, click the **full screen mode** option or **zoom** using the controls located on the right.

## Flow Diagram {#flow-diagram}

Note: Mastercard APIs used in this experience:

* [Installments Offers API](https://developer.mastercard.com/unified-installments/documentation/use-cases/mastercard-installments-payment-services/post-purchase/index.md#installments-offers-api)
* [Installments Plan API](https://developer.mastercard.com/unified-installments/documentation/use-cases/mastercard-installments-payment-services/post-purchase/index.md#installments-plan-api)
* [Installments Notification API](https://developer.mastercard.com/unified-installments/documentation/use-cases/mastercard-installments-payment-services/post-purchase/index.md#installments-notification-api)

Next: [Convert credit card purchase into installments](https://developer.mastercard.com/unified-installments/documentation/experience-design-guide/installments-solutions-for-existing-cards/designs/convert-cred-card-pur-into-instlmnts/index.md)