New User Interface & Navigation on 123FormBuilder

We always strive to provide an intuitive user interface and fluent experiences. Here are the highlights of the enhancements that we made with our user interface and navigation on our form builder.

---

Navigation

Once you start creating a form, you will notice that we have 4 important navigation steps: Create – Set up – Publish – Results.

We will take each section one by one to explain them better, but the important thing is that each section has its own purpose in creating and defining your form better in order for you to make the most out of it.

---

Create

You can easily switch between Fields (to add fields to your form), Design (to apply design changes to your form), Thank you (to configure the Thank you screen shown after submitting the form) and Payments (to add & enable a payment processor on your form)

By default, Fields section is the one selected when you start creating the form as it represents the core structure. This contains the list of fields that are organised under different sections for your Form Editor. This section has seven categories: Essentials, Contact details, Media & Structure, Uploads & Consent, Date & Time, Rating scales, E-commerce & Calculations.

All the fields can be dragged & dropped to the form and customised as you wish. Once you have added a field on your form, a right side panel will open up. From here, you can customize the newly added field.

You can modify its label (question text), add any instructions that might help your respondents to provide an answer to your question, mark the field as required and creat any validation. In order to customize each field, all you have to do is simply click on the field you are interested in bringing changes to and the right side panel with the field’s settings will open up.

By navigating to the Design section, you can change just about anything on your form, from text font and color to the style of the submit button. Expand the section you are interested in applying changes to in order to find more design settings. From the Design section you can also change the theme of the form, by clicking on Browse other themes.

If you want to change the screen your respondents see after they submit the form, then you have to go to Thank you section where you can find multiple options.

Maybe one of the most important sections, especially if you are creating an order form, is Payments. From here, you can choose the payment processor that fits your need. Once added on the form, from the right side panel, you will need to provide additional information in order to enable the payment processor.

---

Set up

After you have the structure of your form, it is most likely you are interested in making it more powerful. The Set up section offers you multiple customisations for your form.

By default, Emails is selected. From here, you can create & customise the emails you want to send out after the forms is submitted.

The Integrations section offers you multiple options of connecting with over 30 third-party app integrations. You will find 3rd party apps specialized in email marketing, CRM, Data management, Utilities and social. We also included our Zapier most used connections.

You can make your form more dynamic by changing the behavior of your form based on the input provided by your respondents. By navigating to the Rules section, you can apply field rules & form rules.

You can even create a sequence of steps that are required to mark a submission as accepted according to established approval rules by going to Approvals.

In the More options, you can set up languages/translations, apply extra security measures and advanced settings such as adding a JS script to your form.

---

“More” options

In the More options, you can set up languages/translations, apply extra security measures and advanced settings such as scripts and Google Analytics for tracking your form’s activity.

Languages offers you the option of creating a multilanguage form by adding translations for each language. If you want to create a password for accessing your form or set a limit for your submissions, Security is the place to do it. Advanced is the section from where you can add scripts to your form, allow users to edit and save for later their entries, and many more.

---

Preview

You can preview the form by clicking on the Preview button. Here you can switch from a desktop view to either tablet or mobile view. Additionally, for Tablet & Mobile view, you can check two different views: Portrait & Landscape. These features are really helpful for you to test how the form would look like on different devices in order to make sure your respondents have the smoothest experience when completing the form.

Extra tip: based on your form, we are calculating an estimated time it would take your respondents to complete the form. Pay attention to it and make sure your forms are easy and quick to fill out in order to make the best out of them.

---

Publish

When you are satisfied with how your form looks like and you have applied all the configurations that you needed, all you have to do is Publish your form and share it with your respondents.

By default, Share form is the first section of Publish. From here you can copy the link of your form, quickly share your form on social media, create a QR code for your form or even download it as a PDF. The option that brings the best personalisation to your form is adding a custom domain.

Embed form section offers you multiple embedding options: you can use the classic JavaScript code or switch to an iFrame. If you want your form to simply pop-up on your website, simply select Auto pop-up and copy the provided code. A more modern approach would be embedding your form as a Floating button – just customise the text, color and alignment and there you go: the code ready to be copied and embedded.

Platforms section acts as a quick sharing method on one of the most popular platforms.

If you want to add Google Analytics on your form in order to track its performance, click on Tracking and provide your information.

---

Results

After you have made a test submission or started to gather real submissions, the next step would be to check your Results.

In the Results section, you can find all the collected data. This is divided into three sections: Insights, Submissions and Reports and you can easily navigate between sections.

By default, Insights is selected. Here you can find quick information related to your form’s performance, such as the number of views & submissions your form gathered, submission rate and how much it took your respondents on average to complete your form.

Additionally, you can find information related to the devices, referrers and locations your respondents viewed and submitted the form from.

By navigating to Submissions, you can check out the submissions table – all submissions your form has gathered in one place. Reports, on the other hand, offers you the possibility of creating custom reports, besides the standard one, where you can easily visualise the data your form has gathered under charts and graphs.