Creating the onboarding experience
We start off this no-code build by creating a one-of-a-kind onboarding experience. I wasn’t sure how this would go but as I started building it out I was surprised at how flexible Adalo was.
Here’s how it went:
As you can see, Adalo allows you to get creative with screen transitions and the user-flow.
Customizing your home screen
Next up we have the home screen. This is where the user experiences the meat and potatoes of the app (no pun intended). They have completed the onboarding and are now met with a custom greeting using their name and avatar.
Here’s how I did it:
Nice! This video showcased how to connect data and link multiple screens together. When users click on a recipe category they are taken to an app page containing all the recipes in that category. This data connection is done via relationship fields in the database as demonstrated in the video. Neat! Let’s move on.
Creating the details page
When a recipe is clicked you are taken to a details page for the recipe you clicked. For example, when clicking on the Pot Roast recipe, the user is taken to the recipe page displaying all the relevant information for that recipe. The details page contains the Ingredients, Instructions, recipe image, etc.
Here’s how I did it:
There was a lot to unpack in that video but this is where the app starts coming together. I love the database design in Adalo. It is effortless to use and easy to understand. Alright, next!
Creating the User Profile page
Let’s give the user a special place in the app to change their avatar, and name, and view the mouth-watering recipes they love.
Let’s build it:
In conclusion
I wanted to push the limits of Adalo using its built-in technologies and I have to say I’m quite impressed. The database experience was a treat and connecting all the screens was very similar to using a design software like Figma. It was a very intuitive and enjoyable experience.
I highly recommend Adalo to anyone looking to create their first app and encourage you to explore its possibilities.
