Add Custom States to Your Web App

In the video below you’ll learn how use Custom States in your Bubble app, providing you a powerful way to either show or hide Groups (or any Elements) in your app. Custom States can save you a lot of development time and improve your app’s performance.

When I first started creating web apps with Bubble, my app’s account setup process took users thru multiple web-pages. So each process step was a page load which created a performance hit. Then when I started looking into creating mobile apps, I learned that my designs needed to be on the “Index” page which meant I needed to use “Groups” instead of “Pages”. So then I started using Groups for different functions in my apps. For instance, I’d have a Group for creating an account, then another Group for editing user’s profiles. For each Group, I would have Buttons that would start a Workflow to show or hide the relevant Groups similar to the image below. Before long, with more Groups being used (and corresponding Buttons), these Workflows started to get long. And for performance purposes, you want to keep your Workflows short. There had to be a better way and there is – Custom States!

While you’ll learn how to implement Custom States in the video, the two images below show the two Workflow steps from the demo design that control the colors of 3 Buttons and the visibility of 6 Groups. Since there are 3 Buttons there are three Workflows needed (one for each Button) which is shown in the video.

If the equivalent functionality of using the “Show” and “Hide” steps a shown in the image above was used, you would have still needed 3 Workflows – but each Workflow would need 9 Steps! Using 2 Steps instead of 9 is a great design simplification and performance improvement.

To see the rest of the implementation on how to use Custom States, check out the detailed video. Custom States are a great addition to your Bubble “toolkit” and use in your Bubble apps. Once you start using them and add multiple Groups to your pages, you’ll see just how fast and efficient this approach is compared to creating lots of Pages. In turn, your app will provide a better customer experience and value to your users.

Submit the form below and I’ll give you FREE ACCESS to this and many other designs in Bubble.