Prefill Form Fields Using Information from A Business Card Image

This guide will explain how to automatically extract contact information from business card images using the “AI OCR Prefill” field. When you upload a business card image, the system analyses it, and prefills form fields with the extracted data. This streamlines contact management and reduces manual data entry.

INITIAL SETUP:

Drag and drop an "AI OCR PreFill", a "Hidden", and an "API Prefill" field onto your form.
Rename the fields as needed.
The "Hidden" field will store the OCR response data.
The "API Prefill" field is used to map the OCR response data to form fields.

Drag and drop the required fields inside a Repeat Group to display the business card data. In this example, we are using four “Text” fields and one “TextArea” field inside a “Repeat” field to show the extracted business card information in rows.
Rename the fields as needed.

2. CONFIGURE THE "AI OCR PREFILL" FIELD:

Click the pencil icon of the "AI OCR PreFill" field.
Add OCR Prompt: Contains instructions to extract name, designation, company, phone, email, address, website, and social media.
Add OCR Response Field ID: Set to the ID of the “Hidden” field.
Enable the Run on File Upload: Enabling this option automatically triggers OCR processing when a business card image is uploaded.

Here is an OCR Prompt example we are using:

Optional: Please enable the following options if you want to use the mobile app camera to capture images through the app.

add Image/* under the “Allowed File Types” option.

Enable Camera Button.

3. CONFIGURE THE "API PREFILL" FIELD:

Click the pencil icon of the "API Prefill" field.
Set API Type as "Get".
Add “Repeat Group Field ID” option: Add the Repeat Group field ID from your form.

Set “Yes” to the “Disable API Call on Page Load” option.

Add “Local Data Field” option: Add the “Hidden” field ID (where OCR data is stored).

Create Prefill Mappings that match OCR response fields to form fields:

Form Field "Name" → Data Key "name"
Form Field "Designation" → Data Key "designation"
Form Field "Email" → Data Key "email"
Form Field "Address" → Data Key "address"
Form Field "Company" → Data Key "company"

4. TEST YOUR FORM:

Try your form.

Upload/capture a clear business card image to the "AI OCR PreFill" field.
Wait for automatic OCR processing to complete (usually 2-4 seconds).
The form will automatically extract business card data using AI OCR and populate the Repeat Group fields with the extracted information.

You can upload multiple business card images in a single upload.
The OCR will extract each business card as a separate entry.
Each business card will appear as a new row in the Repeat Group.
All entries can be edited, added, or deleted as needed.

Example Form.json10.1 KiB

Here are some examples of Business cards we used in this guide.

For any questions, please contact us - [email protected] or the Formyoula in-app chat.

You are a business card data extraction assistant. Analyze ALL provided business card images and extract all visible information into a structured JSON format. Extract the following fields from EACH business card (use null if a field is not present): - name: Full name of the person - designation: Job title/position - company: Company/organization name - tagline: Company slogan or tagline (if present) - phone: Phone number(s) - can be an array if multiple - email: Email address(es) - can be an array if multiple - address: Full physical address - website: Website URL (if present) - social: Social media handles/links (if present) Return ONLY a valid JSON array with no additional text, markdown, or explanation. Format: [ { "name": "string", "designation": "string", "company": "string", "phone": "string ", "email": "string ", "address": "string ", "website": "string " }, { "name": "string", "designation": "string", ... } ] Rules: 1. Process ALL images provided - each business card should be a separate object in the array 2. Extract text exactly as shown (preserve formatting of phone numbers, etc.) 3. If a single image contains multiple business cards (front/back or multiple cards), extract each as a separate entry OR merge front/back of the same card into one object 4. Do not infer or guess missing information - use null 5. For addresses, combine all address lines into a single string 6. Maintain the order of cards as they appear in the images 7. If the same person's card appears multiple times, still extract each occurrence separately Important: The output array length should match the total number of unique business cards across all images.