Booking Management App for scuba dive operators
Last year, something different made my eyes light up, and it was about the discovery of the power of No Code / Low Code platforms for software development.
I’ve been studying these technologies in depth and every day I get more impressed with their power and ease of use. Without depending on software programmers and only with a business vision, I can put ideas into practice, creating complex systems in a practical, agile and very low cost way.
During the last 3 weeks I focused my studies into AppGyver, a tool acquired by SAP for building native mobile applications. In this article, I will report on my first project and lessons learned.
In the last year, 2 partners and I, created the Ikigai Experience company, a national scuba diving scheduling platform. After a few months of its creation, we have already become the largest diving marketplace in Brazil.
Official Website Ikigai Experience
We offer a mobile app to all ikigai’s partner operators, which allows them to manage all their bookings on any mobile phone. It is a competitive advantage that we seek to make available to our partner suppliers.
In this first cycle we used a mix of tools, such as wordpress, google spreadsheets, apps script and appsheet.
Currently, we are looking for ways to build a platform with greater technological structure and scalability. Thus, after a lot of research, we came across Appgyver, which is perfect for this purpose.
The purpose of this text is to report how my first experience with the tool was. I will explain step by step how I built, in just 5 days, a prototype application for my business: An app for diving operators to manage their reservations.
I will also be posting this text on SAP’s No-Code / Low-Code Platform challenge. Challenge details are here.
Regarding its functionality, the app must perform basic functions, such as:
- Add new bookings and customer information;
- Edit and delete existing reservations;
- View bookings in a simple way;
- Connect with a structured database;
- Have a nice UX and UI.
3. My App
To build the app prototype, I performed the following steps:
1. Visual UX Design – Creation of the screens:
- Look for design references;
- Create screen flow;
- Create wireframe of the main screens;
- Create screens in AppGyver.
2. Structure database:
- Design of the main tables;
- Study about low code backend database – Choose a tool;
- Build tables;
- Connect tables to AppGyver via API.
3. Building Flows in the app:
- Create reservations;
- View reservations;
- Edit reservations;
- Delete Reservations.
3.1. Creation of the screens
In order to create the flow and content of the screens, I did a quick study on interesting references. So, using the Miro tool, I connected references together with the flow that the user will have when interacting with the app.
As the idea was to create only the main screens, a complete flow of all the screens oft the app was not carried out, only the essential ones.
Despite not being a web designer, I tried to create visually beautiful screens, with official Ikigai colors and improved UX to optimize the user experience for dive operators owners.
The hardest part here was creating the screens in AppGyver, as I had to fully understand the “containers” logic well and the way to edit each block. As I already had experience with Elementor, I was able to learn quickly, but I know I still need a lot of practice to get really good at the tool.
So, this was the result of the app’s visual presentation.
3.2. Database structure
To build the database, first I research current tools for the backend of mobile applications. The most studied were Xano, Backendless, Airtable and also Firebase.
After my research, I chose Xano as it is a well-reviewed tool, with a scalable PostgreSQL database, full API integration, and a relatively fast learning curve. Xano, in this case, acts as the backend API and the database itself.
Using the Xano tool, creating the initial tables was easy and the settings via API also proved to be an equally easy and logical connection.
3.3. Building the flows in the app
To perform the data flows, I had to first configure some methods via API to obtain communication with the database. The following are the configured methods:
- GET (collection): Show reservations in a repeater list;
- GET (record): Show details of an individual booking;
- PUT: Edit reservations;
- DELETE: Delete reservations.
Using the methods was relatively simple. Sometimes I got confused just in creating app variables and data variables. Communication via API has always been very fast.
About the appgyver logic part, it was my first contact with the tool. In general, it seemed quite robust to me and everything was quite simple and didactic. I still haven’t had the opportunity to create more complex logics, but little by little I’m learning more and more.
So, I connected all the logic points of the app and adapted some details. There are still many features I would like to implement, such as:
- Login and authentication area;
- Smart filters to vary views according to the user;
- Connection between relational tables;
- New screens and general UI and UX adjustments;
- Publication in the official iOS 14 and Android stores.
I already have an idea of how to do such features, I know that despite not being so simple, they are features that I can implement quickly and with my own abilities and tools.
4. My experience with AppGyver
In general, the development of apps with AppGyver tool impressed me a lot. The platform is robust, and although it is not simple, it is possible to learn how to do it and the creation ends up becoming automatic. The points I liked the most were:
- Quickness to create a complete app, without using one line of code and the fact that it is with a 100% free plan (great differential);
- Possibility to create design with professional layout in an agile way;
- Practicality in the integration of APIs;
- Functional connection with other databases;
- Well-structured logic.
On the other hand, there are some missing points to improve my experience with AppGyver, which I would like to list:
- Creating a backend and database in SAP code – Xano was excellent, but sometimes with just simple tests I hit the APIS call limit (10 calls every 20 seconds) which makes it impossible to launch for a few users in real life.
- Creation of a library of design blocks ready for the most varied uses;
- Greater flexibility and practicality to create web apps;
- Easily create push notifications.
In the future, my plan is to improve this app, creating something more and more robust, professional and scalable. Also, I will definitely create new applications for the business. The speed and practicality of tools in code is something incredible and never seen before.
Official Video about the app:
To view my app, you can access it here. As it involves part of my business, I removed the actions from the buttons and made a visual-only version. Note: Only view mobile for now.
About The SAP Learning Journey
Check out the SAP Low-Code/No-Code Learning Journey – designed to increase low-code/no-code skills and teach citizen developers the basic concepts of software development including SAP AppGyver, SAP Process Automation, and SAP Work Flow and learn how to build mobile apps for free.