Guides & tutorials
Guides & tutorials
Need to create a custom KYC verification flow? Save time and resources by building and iterating it, add automations and custom logic at any stage, and easily adapt it to your brand guidelines with the form and flow editor.
In this guide we will show you the key steps to build a completely custom KYC form, using Passbase for ID verification, although you can totally adapt it to your needs.
First, go to the form editor and create a new form. You can select and edit one of the templates or start from scratch. In this case, we will opt for the latter.
Add the steps you need by clicking the green plus button, and give each one a descriptive name in the right column.
Distribute the fields you need in the steps you have created. Remember to keep it simple and not overload them with too many questions. Just drag and drop the fields from the menu on the left, and click on them to open their settings.
To configure these fields settings is as easy as:
As KYC documents vary by country, we need this information. We have added the Google Address Autocomplete widget to allow users to easily fill in the address and validate it with Google Maps. This will also allow us to know the country without asking the user.
To configure the widget is also as easy as:
If you don't need the user's address, instead of using Google Address Autocomplete, you can include a country field to ask the user directly.
Next, add the ID verification service of your choice. In this case, we have used Passbase and its native widget, but you can embed other services using the 'Custom field' feature.
To configure the Passbase widget:
Note that the Passbase widget uses the 2 character ISO code (ES, US, GB, etc.), so just remember to send the data in that format.
If you need to request more documents, we recommend that you do it once the user has been verified. Passbase will request and verify the ID card, but you should check which KYC documents are requested in each country.
You can make fields display dynamically using conditional logic or JavaScript rules, depending on your coding skills. If you need it, you can request a demo of these features.
Finally, add your Terms & Conditions. Just drag and drop the field and add the corresponding link. Rich text is supported in this field, so you can format the text.
If you want to make them more understandable and accessible, you can divide them into two or three sections with an explanatory text, in the style of N26.
To add logic to your form, click on the 'Flows' tab in the light gray menu. You can add flows with custom logic at any step of the form and also after it is submitted.
You can use step flows to create a dynamic form, whose steps change based on user responses, or to get data from external services like Clearbit or your own APIs.
After-submission flows are used to send data to external services and trigger notifications. For example, you can send form data to your CRM and notify a specific salesperson or channel in Slack. Then add an ‘If/then condition’ action to trigger different behaviors on each of the branches.
Finally, configure the ending screen, which is displayed after form submission. Here you can define a thank you message, set the redirection URL, and run custom JS scripts.
None of these operations is mandatory, simply activate the ones you need by clicking the ON/OFF button. You can check all the details on the ending screen docs.
Once everything is ready, click on the ‘Preview’ button to test the form and the flows. You can see if everything has worked correctly in the ‘Submissions’ tab.
Thanks to our JS SDK, Arengu forms can be embedded in every frontend framework with two simple lines of code. Check all the possibilities and methods in the embed docs.
There are 2 ways to change the look and feel of your form, depending on your coding skills and how you want to edit it.
Easily modify fonts, colors and buttons, by clicking on the ‘Design’ tab of the form editor.
If you have coding skills, you can fully customize the form using all these CSS variables.
Haven’t you tried Arengu yet? Feeling like this use case is what you need but don't know where to start? Sign up free or book a demo with us. We’ll be happy to help you!
Arengu allows you to build all your user flows connected to your current stack, and avoids coding all the UI, complex integrations, validations or logic from scratch. Try it for free and start building faster and scaling your application needs as they grow.