Application flow
This page describes the end-to-end user flow within the embedded myFlowpay application and how to simulate it for development and testing.
Overview
-
Service activation — The flow starts within the host application. After initialisation of the embedded myFlowpay, registration number, country of registration, as well as other data are sent to Flowpay and the service is activated.
-
Representative identification — On the first screen, the user identifies themselves as one of the company representatives. The user can:
- choose among listed representatives, or
- manually enter a representative.
-
Contacts verification — In the next step, the user verifies their contact information: telephone number and email address.
-
Analysis — After successful contacts verification, the user reaches the ANALYSIS screen. Normally, the user can see graphs showing their past and future (forecasted) revenues. After the business data analysis:
- If qualified for the offer: the user sees a click-to-action button to view the offer.
- If not qualified: a dedicated banner is shown.
-
Choosing product — After the user clicks to open the offer, the first step is to choose a product. There can be up to 4 products to choose from (1M, 3M, 6M and 12M) with their maximum offered amounts.
-
Deferment period — On the next screen, the user can choose the deferment period (optional).
-
Application submission — The user then enters the application submission screen. The user must:
- have verified contacts (typically already done in step 3),
- complete KYC verification,
- connect their business bank account (used for disbursement of the funds),
- fill in additional information:
- purpose of the loan,
- politically exposed person (PEP) declaration,
- ultimate beneficial owner (UBO) declaration,
- consent to T&Cs.
-
Underwriting — After the application is submitted, the underwriting process begins. It can end in 3 possible scenarios:
- Rejected — Application has been rejected by Flowpay's risk team.
- Approved — Application has been approved by Flowpay's risk team.
- Changed terms — Application has been approved under different conditions (e.g. different amount, fee, repayment period). The user can:
- refuse these new conditions, or
- accept these new conditions.
-
Contract — If the application is approved, or accepted after changed terms, a contract is generated and sent for signature.
-
Disbursement — As soon as the contract is sent, the funds are disbursed.
Diagram
flowchart TD
A[Service activation] --> B[Representative identification]
B --> C[Contacts verification]
C --> D{Data analysis}
D --> E[OFFER]
E --> F[Choosing product + deferment]
F --> G[Application form]
G --> H[KYC verification]
H --> I[Bank connection]
I --> J[Submit application]
J --> Ja[Reject]
J --> Jb[Approve]
J --> Jc[Change terms]
Jc --> K[Refuse]
Jc --> L[Accept]
L --> M
Jb --> M[Contract sent for signature]
M --> N[Signing the contract]
N --> O[Signed]
O --> P[Auto-disbursement]
P --> R[Loan disbursed]
R --> S[Pay upcoming instalment]
D --> X[UNQUALIFIED]
Simulation mode
Development Only
The simulation mode is intended for development and testing purposes only.
The simulation feature allows you to emulate the behavior of the system without interacting with the APIs or running any processes. When enabled, a toolbar appears in the embedded app (in non-production environments only) with buttons that perform actions to move through the application process, such as creating offers, setting identity verification status, connecting bank accounts, approving/rejecting financing applications, signing financing contract, and paying installments.
To enable or disable the simulation toolbar, send a fp:SIMULATION event to the embedded app:
// Enable simulation toolbar
const iframe = document.getElementById("fp-embedded");
iframe.contentWindow.postMessage(
{
channel: "flowpay-embedded",
version: "1.0",
event: "fp:SIMULATION",
payload: { enableToolbar: true },
},
"https://my.flowpay.io"
);
// Disable simulation toolbar
iframe.contentWindow.postMessage(
{
channel: "flowpay-embedded",
version: "1.0",
event: "fp:SIMULATION",
payload: { enableToolbar: false },
},
"https://my.flowpay.io"
);
Using the SDK:
If you're using the @flowpay-io/embed-core SDK, you can use the dev_simulation method:
import { createFlowpayDomController } from "@flowpay-io/embed-core";
const controller = createFlowpayDomController({
embedOrigin: "https://my.flowpay.io",
// ... other config
});
// After attaching and authenticating
iframe.addEventListener("load", async () => {
controller.mount(iframe);
await controller.client.waitUntilReady();
await controller.login({ launchPayload });
controller.dev_simulation(true);
}, { once: true });
Note: The toolbar state is stored in a cookie and persists across page reloads until explicitly disabled.