Estimated reading time: 5 minutes Updated: 3/12/2026 Created by: Botmaker Team

How to create and design a Webchat form?

In this article you will learn what Webchat Forms is, how this new interface for data collection and validation works, and the necessary steps to configure it within your bot.



What is Webchat Form? 

It is the native Botmaker step-by-step tool designed exclusively for the WebChat channel.

  • It allows for the creation of surveys, appointments, and forms in a structured way, prioritizing user experience (UX) through a modern and precise interface.
  • It allows for the unleashing of human potential by letting technology resolve repetitive and complex processes.
  • It offers a more efficient and scalable service without losing communication quality. There is no additional cost for its use.



Key concepts and benefits Guided interactions: 

Offers real-time validation of the information entered by the user. 

Data management: The collected information is automatically saved into variables within the platform. 

Convenience: Access to pre-designed templates based on different business objectives. 

Customization: Adaptation of the visual identity (styles) to match the aesthetics of your website.


How to configure a Webchat Form 

Step 1:

  • Create the form Go to the Webchat Form section in the botdesigner. 

  • Click on “Create” 

  • Define a Title and select a visual Style (based on your Webchat settings). 

  • Select a template: You can start from an "Empty form" or choose one of the pre-created options:
    • Log in 
    • Sign up 
    • Register event. 
    • Survey 
    • Get feedback. 
    • Get support. 
    • Update preferences 
    • Register for an account. 
    • Book a table. 
    • Get a quote. 


Step 2: Customize the design and logic Within the editor, you will be able to see a live Preview on the right. 

  • Designer: Allows you to edit texts, add screens, and new components.

  • Variables: Configure where the information for each field will be stored. Keep in mind that the variables will change according to the form you are creating. 

  • Advanced editing: Although it is a no-code experience, you can make manual adjustments within the code for specific changes; each change will automatically impact the preview.

  •  Style: You can choose the color palette the form will have, based on the Webchat designs you have already created in the project. 

  • Screens: Each form has different screens as it progresses. You can modify each of them. 

To be able to use the form, you must click on “Publish”. Once published, you can return to the editor and modify whatever you need.



Step 3: Insertion in the Botdesigner 

  • To activate the form in a conversation: In the Botdesigner, select the block where you want to request the information. 

  • Click on Add user input. Select Webchat Form from the list of options. Choose the form you previously created. 

  • Write the accompanying text and the button the user must click to open it. You can add an image to accompany the form header. 


Keep in mind that a branch will automatically be created to differentiate whether the channel is Webchat or not. It is only supported by this channel, so you can route the flow in a different way.



Frequently asked questions (FAQ)

Which channels can it be used on?

It is supported only on the Webchat channel. If your bot is multi-channel, you must configure a branch in the flow to offer an alternative on channels like WhatsApp.


Do I need to know how to code to use it?

No. The pre-created templates offer a 100% no-code experience. Touching the code is only required if you wish to perform edits that are not in the visual designer or texts.


How is the data completed by the user saved?

It is saved automatically in the platform variables you defined during the form configuration.


Can I change the colors so it looks like my brand?

Yes. When configuring the form, you can choose the visual style based on the styles you have already created for your Webchats in Botmaker.


What happens if the user closes the chat halfway through the form?

The interface is designed to prioritize user experience and precision, but the final data saving usually occurs upon completing the defined screens.



Remember to visit our Help Center for further information.