User-presented Mode Payment
With User-presented Mode Payment, the merchant scans the payment that the consumer presents to initiate a payment. Generally, the payment code is displayed on a digital wallet app owned by an Alipay+ Mobile Payment Provider (MPP).
Basic concepts
The following key terms are used in this document:
Term (Abbreviation) | Definition |
Acquiring Service Provider (ACQP) | An Acquiring Partner participating in Alipay+ Core or other acquirer cooperating with a member of Ant Group to enable payments. |
Alipay+ | Alipay+ solution is a collaborative effort along with all partners to provide more open, digitalized, and inclusive financial services to worldwide consumers and merchants. |
Mobile Payment Provider (MPP) | A Mobile Payment Partner participating in Alipay+ Core or other user- or issuer-facing payment service provider cooperating with a member of Ant Group to enable payments. |
User-presented Mode Payment | Payment scenario that the merchant scans the consumer presented code with a device to initiate the payment. |
payment code | Also known as business-scan-consumer (B-scan-C) code. QR codes or barcodes presented by consumers for merchants to scan with their reading devices to initiate payments. |
User experience
The following figure illustrates the user experience with the User-presented Mode Payment product:
Figure 1. User experience of User-presented Mode Payment
The user experience consists of the following steps:
- The consumer opens the MPP's app (normally a digital wallet), and then presents the Alipay+ payment code to the merchant.
- The merchant scans the payment code that is presented by the consumer.
- The MPP presents the payment result page to the consumer.
Notes:
- In the MPP app, the entry for the Alipay+ payment code is the same as that for the MPP's local payment code.
- When the user opens the Payment Code Page in the MPP app, if the MPP app can detect that the user is abroad, the MPP app can automatically display the Alipay+ payment code.
For more information, see Page detail requirements.
Product functionalities
The Alipay+ User-presented Mode Payment product provides several capabilities to facilitate your business.
Payment
- Accept a payment: The MPP takes a series of integration steps to ensure the user completes the payment.
- Automatic code generation: When the customer opens the Alipay+ payment code page and selects a country/region in the MPP app, a QR code is automatically generated by Alipay+ to support payments in that country/region.
- Standardized payment code: The standardized payment code can be used across the globe, which helps the MPP easily reach out to worldwide merchants.
- Promotion provided: With this product, the MPP can directly offer promotional discounts that are provided by Alipay+ to consumers who use the MPP app to pay.
- Multiple currencies supported: With cross-border settlement supported, the MPP can make payments in multiple currencies across the world, as well as allow its consumers to pay in their local currencies.
- Payment result inquiry: The MPP can send the payment result to Alipay+ on Alipay+'s inquiry about the payment status.
- Payment result notification: When the MPP confirms that the payment is successful, Alipay+ actively pushes the payment result to the ACQP, who can then relay the result to merchants.
Post payments
- Refund: MPPs support both full and partial refunds.
- Cancellation: MPPs support transaction cancellations that are requested by ACQPs within the cancellable period.
Business operations
- One-stop settlement: Alipay+ provides a unified funds clearing and settlement service for the MPPs. Instead of mutual settlement, the MPPs only need to settle with Alipay+, which greatly simplifies the funds processing and improves the settlement efficiency.
- Alipay+ Partner Workspace: Alipay+ Partner Workspace is a platform where the MPPs can execute operational tasks related to the Alipay+ business, which includes transaction management, risk management, account management, dispute handling, and integration.
- Alipay+ Center: Alipay+ Center is a value-added module that can be added to the MPP app to enhance users' cross-border payment experience. It consists of Alipay+ brand introduction, payment-related services, and user incentives.
How it works
Figure 2. Alipay+ User-presented Mode Payment workflow
After the merchant places an order, the workflow consists of the following steps:
- The MPP app requests a payment code from the MPP server, which calls Alipay+ to get the payment code. Then, the consumer presents the payment code to the merchant.
- The merchant scans the payment code and sends a payment request to Alipay+.
- Alipay+ decodes the payment code to obtain the customer ID, and then sends the payment request with the customer ID to the MPP.
- The MPP debits the payment amount from the consumer's account according to the customer ID.
- The MPP presents the payment result to the consumer on its app.
Page detail requirements
This section describes the design requirements for the three main pages for User-presented Mode Payment.
- Alipay+ Payment Code Page
- Payment Result Page
- Transaction Detail Page
Alipay+ Payment Code Page
The following figure illustrates the fields that can be displayed on the Alipay+ Payment Code Page for User-presented Mode Payment.
Figure 3. Fileds for Alipay+ Payment Code Page
For the QR code and the barcode on the Alipay+ Payment Code Page,
- Display the"Alipay+ icon" at the center of the QR code.
- The QR code and barcode are clear and scannable.
- By default, mask part of the barcode number to protect the user information.
To obtain the assets of the Alipay+ icon, see Alipay+ Brand Mark Assets.
Open the Alipay+ payment code page
When the user opens the payment code page in the MPP app, the app must ensure that the user can use the Alipay+ payment code. The MPP app can either open the Alipay+ payment code page automatically or let the user select the Alipay+ payment code.
Automatically open the Alipay+ payment code page
You can use the location-based service (LBS) or other methods to check if the user is abroad. If the user is abroad, when the user opens the payment code in the MPP app, the MPP app must automatically open the Alipay+ payment code page.
Manually select the Alipay+ payment code
You must let the user select the Alipay+ payment code manually. For this, provide an apparent entry for the Alipay+ payment code on the MPP app's payment code page.
It is recommended to use a tab switch or a button as the entry. See the following figures for examples:
Tab switch
Button
Payment code related functionalities
Screenshot prohibitions
On Android, use technical methods to prohibit users from taking screenshots of payment codes.
On iOS, invalidate the code if a screenshot is taken, and notify the user of the prohibition. After the user closes the notification, generate a new code.
Barcode numbers
When the user clicks the View numbers button below the barcode, pop up a security message to warn the user not to share the number with anyone but the cashier. After that, show the unmasked number under the barcode.
Code refresh
The Alipay+ payment code must be refreshed automatically in a periodical manner (one minute). The MPP app can also provide an entry for the user to manually refresh the code. The entry to refresh the code can be set in the "more" option list in the upper right corner of the screen.
Payment Result Page
The following figures illustrate the fields that can be displayed on the Alipay+ Payment Code Page for User-presented Mode Payment.
The payment succeeds:
Figure 4. Fields for Payment Result Page - payment succeeds
The payment fails:
Figure 5. Fields for Payment Result Page - payment fails
The following table lists additional information about the fields in figures 4 and 5. Information on all of the fields in the table can be obtained from the related APIs.
If the fields in the following table are available, the fields must be provided on the Payment result Page.
Field | Description |
Merchant name | The display name of the merchant. |
Order amount | The order amount. |
Exchange rate | The exchange rate. Used when the order currency differs from the user's payment currency. |
Payment amount | The amount that the user pays. |
Alipay+ discount | The amount of the discount from Alipay+. |
Transaction Detail Page
The following figure illustrates the fields that can be displayed on the Transaction Detail Page for User-presented Mode Payment.
Figure 6. Fields for Transaction Detail Page
The following table lists additional information about the fields in figures 6. Information on all of the fields in the table can be obtained from the related APIs.
If the fields in the following table are available, the fields must be provided on the Transaction Detail Page.
Field | Description |
Merchant name | The display name of the merchant. |
Order amount | The order amount. |
Transaction No. | The transaction number assigned by the merchant. |
Alipay+ discount | The amount of the discount from Alipay+. |
Optional design standards
Follow the optional standards to ensure an optimal user experience.
Display a country/region list
By regulation requirements, some MPPs might have to display the exchange rate between the order currency and the payment currency on the Alipay+ payment code page. In this case, the MPP needs to display a list of the countries/regions that the user can select.
In addition, if the MPP app can detect the user's location, the MPP app needs to use the user's country/region by default.
See the following figure for an example:
Design of the QR code & barcode
Barcode design
- Recommended width: 40mm to 60mm.
- Recommended height: No less than 14mm.
- The barcode must be displayed in full and not be obscured in any way.
QR code design
- Recommended height and width: 25mm to 40mm.
- Recommended height and width of the Alipay+ icon: around 15% -25% of the QR height and width.
- Leave some empty space around the QR code.
Screen brightness
Automatically increase the screen brightness for the Alipay+ payment code page to improve the scannability.
Dropdown list as the Alipay+ QR code entrance
Condition: The Alipay+ code is generated on the same page as the MPP local codes.
You can use a dropdown list to let the user select the Alipay+ payment code manually on the payment code page:
For standard Alipay+ code entrance design, see Manually select the Alipay+ payment code.
Get started
To get started with the integration of the User-presented Mode Payment functionalities, see Integration overview for User-presented Mode Payment.