<aside> 💡 This tutorial was inspired by another tutorial by Craigo on the Adalo community forums, but I realised there's another way to implement it that worked better for us.
</aside>
If you're living outside of the US like me, the load time for complex action(s) can take a few seconds.
For example, if a button click is supposed to perform multiple actions that update several fields in a few data collections, the button might freeze upon the first tap and the user might end up tapping a few times thinking that the app didn't register the action.
It's bad UX at best and at worst, it would create problems (for eg. double records in data collections) and turn users away.
A simple workaround is to implement a loading screen or modal. So when the button is tapped, it'd only have one action: send the user to the loading screen.
https://lottiefiles.com/28757-hourglass-loading
Upon reaching the loading screen, the complex actions will execute. To give the user some visual feedback that the app is loading to execute the actions, we can use a lottie animation (use one from Lottie Files).
https://www.youtube.com/watch?v=JTaFBb1eytc
The final action in the sequence will then send the user to the success screen. In our case, we used the loading screen for when a user books a yoga class on our mobile app.
There are multiple conditional actions to check if the user is already booked in the class, doesn't have enough credits to book the class, or have expired credits, so the execution typically takes up to 3 seconds. Because of this, we had the issue of double booking and of course, double reduction of credits.
