2.4 Making a Pay-out
A comprehensive guide for building an effortless user experience for your customers to convert their crypto assets into fiat with Yellow Card's API.
Introduction
We allow your customers to withdraw their funds in their local currency using their preferred payment method, including mobile money and bank transfer (View the coverage map to see which payment methods are available in each relevant country)
User journey overview
Build out a simple front end in your app to allow your customers to seamlessly withdraw their funds.
Disbursement UX & Integration Overview
A guide of the user journey steps for making a disbursement.
User journey step | What to show on the UX | What to ask the user for | API reference | What's returned from the API |
---|---|---|---|---|
1. Initiates off-ramp | Withdraw capability from customer wallet | Request withdraw | n/a | n/a |
2. Chooses a preferred payment channel | List of payment channels available to them eg: Bank Transfer, mobile money, P2P transfer | Their preference of payment method | Get Channels | A list of available payment channels for the given country |
3. Choose the amount (USD) wanting to withdraw. | A place for the user to nominate how much USD the customer wants to withdraw, and the limits thereof | The amount (USD) they are wanting to withdraw | Get Channels - Get Rates | - Limits for a given payment channel - Rate of USD/ Fiat currency conversion |
4. Enter recipient details | 1. Bank transfer/ P2P - Bank name (Select the bank of the beneficiary) - Account holder name - Account number - Reason for sending 2. Mobile Money - First name - Last name - Mobile number (code +string) - Mobile provider - Reason for sending | Please add recipient details: | Bank name/ mobile provider= Get Networks Reason for sending = Payment Reasons | Get Networks - A list of available networks Payment Reasons - Pre-defined list of reasons to select. |
5. Review withdrawal request. | Show Transaction details including: - Payment Channel - Payment Network - Recipient details entered - Total USD amount - Rate - Total local fiat amount 2. Ability to confirm or cancel. | To confirm or cancel the requested transaction. | Submit Payment Request | A quote to make the exchange |
6. Initiate withdrawal request. | Confirmation the exchange is being processed | n/a | Accept Payment Request Deny Payment Request | Confirmation or rejection of the transaction |
7. Receive local fiat in bank account or mobile wallet. | Confirmation that transaction was successful. | n/a | n/a | n/a |
8. Retrieve information about a specific payment | View transaction details | View transaction details | Lookup Payment | Information about a specific payment |
To get started, open the recipe below:
UI Flow Reference
This is a guide to showcase a proposed UI/UX framework that can be followed to best build out the required flows.
To begin, a customer will initiate a withdraw
For cross border disbursements or disbursing to another person's account or mobile wallet, a country selector will be necessary for a customer to select between all supported countries where the recipient is based. If a customer can only disburse to their own saved account, then the country saved can be passed through to the api only.
The supported and enabled payment channel of the chosen country will be shown to the customer for them to select their preferred method of payment.
Once the preferred payment channel has been selected, the customer can now enter the amount they would like to withdraw. The USD amount will be entered and the api will provide the rate conversion to the local fiat of the country selected. To show the local currency conversion on the same screen will require the calculations to be handled by partner.
The api will also provide the any relevant min and max transaction limits relevant for the transaction which can also be displayed to alert customers upfront.
It's now time to add the relevant recipients details to which the customer wants to make the withdraw. If the recipient is different to the customer, then the following input fields will be necessary for the relevant payment method/network selected:
5.1 P2P or Manual Bank Transfer
-
Bank Name - A dropdown that will contain all bank networks passed through by the api
-
Account holder name - A text field for the customer to enter the account holders name (the bank verification api endpoint will allow a response with the verified account holder name)
-
Account number - A text field for the customer to enter the specific account number of the recipient.
-
Reason for Sending - A dropdown that will contain the relevant pre-defined reasons here.
5.2 Mobile Money
-
First name - A text field for the customer to enter the first name of the recipient
-
Last name - A text field for the customer to enter the last name of the recipient.
-
Mobile number - A text field that contains the dialling code and number of the recipient.
-
Select provider - A drop down field that will show all the supported networks passed through by the api.
-
Reason for Sending - A dropdown that will contain the relevant pre-defined reasons here.
This screen will show the customer all of the transactional details for their withdrawal request for them to review and confirm that it is correct. The details that you will get from the SubmitPaymentRequest endpoint will include:
6.1 P2P or Manual Bank Transfer
-
Payment channel - payment method
-
Payment Network - selected bank name
-
Account holder name
-
Account number
-
Total Amount in USD
-
USD/Fiat Rate
-
Total Amount in Fiat
-
Fee - this will need to be built in by partner if fee's or any other costs are passed on to customers for transactions.
-
Total Amount Received - this calculation will need to be built in on the partner's side.
6.2 Mobile Money
-
Payment channel - payment method
-
Payment Network - selected mobile network/ provider
-
Mobile number - mobile number to be in format of country code and number.
-
Total Amount in USD
-
USD/Fiat Rate
-
Total Amount in Fiat
-
Fee - this will need to be built in by partner if fee's or any other costs are passed on to customers for transactions.
-
Total Amount Received - this calculation will need to be built in on the partner's side.
Once a withdrawal request has been initiated, a customer should be directed to a screen communicating that the withdrawal is being processed and include any relevant timelines to manage expectations (this is more important for manual bank transfers which can have a lead time of T+2.)
Confirmation screen showing customer that the payment was successful and funds were sent to recipient's mobile wallet or bank account.
Updated 1 day ago