Build LARGE Multi-Step Forms for Onboarding in Bubble FAST! - Part 1

Creating an effective and seamless onboarding process is crucial for capturing user interest and collecting essential data for any new application. However, building multi-step forms from scratch in Bubble can be a cumbersome task, as it involves careful planning, design, and multiple iterations. In this blog post, we will explore how you can simplify this process using Tally, a third-party form builder, and seamlessly integrate it with your Bubble application through webhooks.

Introduction to Multi-Step Forms in Bubble

Building multi-step forms in Bubble can be incredibly time-consuming. While Bubble allows for sophisticated form functionality, achieving that comes at the cost of spending extensive hours customizing, testing, and updating the forms as your MVP evolves. Given the potential need for numerous adjustments to gather user data effectively, an easier approach can save time and ensure a more efficient workflow.

Tackling Form Building Challenges with Tally

Why Use Tally? Leveraging a third-party form builder like Tally offers a simplified and intuitive way to create multi-step forms. Tally's user-friendly interface resembles Notion, making it accessible even for those who may not be heavily invested in coding. The ability to construct forms quickly, complete with advanced features like conditional logic, without the need for deep technical know-how, sets Tally apart.

Key Features of Tally

• Conditional Statements: Create dynamic forms where certain fields appear based on user responses.
• Multi-Step Functionality: Seamlessly incorporate multiple steps and pages to avoid overwhelming users.
• Input Controls: Include a variety of input controls such as linear scales, rankings, and more to capture detailed user information.
• Free Version: Most features in Tally are available on the free version, although integration with a paid Bubble account is necessary for webhooks.

Building Your Form in Tally

Initial Setup Start by setting up your form in Tally. First, give your form a relevant title, such as "Onboarding," and begin adding form elements. Tally's interface allows easy addition through commands similar to those in Notion.

Creating Form Elements Let's imagine you are working on an onboarding form for a startup support platform:

1. Question with Input Block
2. : A basic yet essential element is a text input where users describe their startup. Example:
3. "Tell us about the startup you are creating."
4. Linear Scale
5. : Evaluate user familiarity with Bubble using a linear scale. Example:
6. "How experienced are you with Bubble.io?"
7. Ranking
8. : Ask users to rank different no-code website builders to understand their preferences. Example:
9. "Rank these no-code website builders: Webflow, Bubble, Wix, WordPress."

Multi-Step Navigation To prevent overwhelming users with too much information at once, split the form into multiple steps:

• After adding questions, segregate them across different pages by choosing the "add new page" option.
• The initial setup will automatically replace the submit button with a next button for easier navigation.

Integrating Tally with Bubble via Webhooks

Setting Up the Webhook Connecting Tally with Bubble is the next pivotal step:

• Use webhooks to send form data from Tally to your Bubble application.
• Ensure you have a paid Bubble account to activate this feature.

Configuring Webhook in Tally

1. Create a webhook in your Bubble app and copy the URL.
2. Go back to Tally, navigate to the form settings, and add the webhook URL.
3. Map the Tally form fields to your Bubble database fields to ensure all collected data is appropriately stored and accessible.

Testing the Integration Before going live, thoroughly test the webhook integration:

• Submit sample data through the Tally form.
• Verify that the data accurately populates the intended fields in your Bubble app.
• Adjust field mappings if necessary to ensure a smooth data transfer.

Conclusion

Using Tally for building large multi-step forms saves significant time and effort in the development phase of your Bubble app. By outsourcing form creation to a specialized tool, you can focus more on other essential components of your MVP. With the easy set-up and powerful integration capabilities, Tally simplifies the onboarding process without compromising the quality of user data collection.

For more in-depth tutorials, courses, and a special Black Friday bundle to accelerate your Bubble app development journey, click the link in the description and head over to our website.

Stay tuned for our next video where we'll delve deeper into integrating your Tally forms with your Bubble app using webhooks.