Introduction

In today's digital landscape, creating efficient, user-friendly forms integrated with automation workflows is essential for streamlining data collection and enhancing user experience.

This guide provides a detailed overview of building a mini app that generates customizable web forms, triggers workflows upon submission, and seamlessly integrates with chatbots or other platforms.

Whether you're a developer or a non-technical user, this step-by-step tutorial will empower you to craft mini apps that simplify data collection, automate follow-up actions, and improve overall operational efficiency.

Step-by-Step Breakdown of Building a Form Mini App

1. Setting Up Your Workspace and Creating a Mini App

• Navigate to "My Contents": Access your workspace and locate the Mini App section.

• Create a New Mini App:

  • Choose Mini App Version 2.

  • Name your app, e.g., Form Generator.

  • Click Create.

• Initial Progress: You're approximately 20% through the setup process at this point.

2. Generating a One-Time URL for the Form

• Access "One-Time URL":

  • Click New One-Time URL.

  • Name it, e.g., New Form Submission.

  • Save the URL.

• Configure URL Parameters:

  • Use the Edit button to add parameters if needed.

  • For this tutorial, focus on form inputs rather than data mapping.

3. Designing the Web Form Inputs

• Adding Basic Inputs:

  • Use Add Item to insert form fields.

  • For each input:

    • Set Type (e.g., Text, Select).

    • Mark as Required if necessary.

    • Provide Title (e.g., First Name).

    • Create App Fields:

      • Example: first_name, last_name, email.

    • Add Placeholders for user guidance:

      • Type your first name here.

• Example Inputs:

  Field Name	Type	Required	Placeholder	App Field
  First Name	Text	Yes	Type your first name here	first_name
  Last Name	Text	Yes	Type your last name here	last_name
  Email	Text	Yes	Type your email here	form_email
  Business Type	Select	Yes	Let us know if you are an agency or freelancer	business_type

• Creating Select Options:

  • Define Sources for dropdowns.

  • Example: Business Type options:

    • Agency

    • Freelancer

4. Creating and Managing Sources for Dropdowns

• Add New Source:

  • Name: Business Type.

  • Type: Static.

  • Add Items:

    • Label: Agency, Value: agency.

    • Label: Freelancer, Value: freelancer.

• Link Source to Input:

  • Edit the Business Type input.

  • Select the created source.

  • Save changes.

5. Configuring the Confirmation Web Page

• Set Up a Thank You Page:

  • Title: Thanks for submitting.

  • Content: Thank you for submitting the form.

  • Optional: Add images or customize the message.

  • URL Expiry: Set between 5 to 60 minutes.

• Save the page configuration.

6. Creating a Trigger for Form Submission

• Define a Trigger:

  • Name: Form Submitted.

  • Type: Form Submission.

  • Save.

• Map Form Data to Custom Fields:

  • Use Add Context to map each form input:

    • first_name → First Name.

    • last_name → Last Name.

    • form_email → Email.

    • business_type → Business Type.

  • Add a brief description for clarity.

  • Save the trigger.

7. Setting Up Actions Post-Submission

• Create a New Action:

  • Name: Create New Form.

  • Type: Create.

  • Generate a One-Time URL for the form.

  • Save and note the output as form_url.

• Generate the URL:

  • Use a subflow to Get One-Time URL.

  • Save the URL into a custom field (form_url).

8. Building the Workflow to Generate the Form URL

• Create a Subflow:

  • Name: Generate New Form URL.

  • Action: Get One-Time URL.

  • Map the output to form_url.

  • Save the subflow.

• Link Workflow to Trigger:

  • Connect the subflow to the Create New Form action.

  • Ensure the URL is stored for later use.

9. Enabling the Trigger and Finalizing the Workflow

• Create a Workflow:

  • Name: Submitted Form Details.

  • Action: Fire Trigger.

  • Select the Form Submitted trigger.

  • Enable the workflow.

• Test the Setup:

  • Submit a test form.

  • Verify data is captured and workflows are activated.

10. Installing and Testing the Mini App

• Publish the Mini App:

  • From My Contents, select your app.

  • Click Publish or Save Draft.

  • Copy the Draft URL.

• Integrate into Chatbot or Platform:

  • Use the URL in your chatbot flow.

  • Example: Send a message with a button linking to the form.

• Test the User Experience:

  • Open the form.

  • Fill in details.

  • Submit and observe the confirmation message.

  • Check that data appears in your system.

Summary

Creating a custom mini app for forms and automation workflows is a powerful way to enhance data collection and user engagement. This process allows you to design tailored forms, trigger automated actions, and seamlessly integrate with chatbots or other platforms—all within minutes. By following this comprehensive guide, you can build efficient, user-friendly forms that reduce manual effort, improve data accuracy, and deliver a superior user experience.

Remember, the key steps involve designing the form, setting up sources for dropdowns, configuring triggers and actions, and integrating the mini app into your communication channels. With practice, you'll be able to customize and expand these workflows to suit various use cases, from lead generation to customer feedback and beyond.

If you encounter any challenges or have questions, don't hesitate to reach out. Embrace the power of automation and mini apps to transform your data collection processes today!