In my case, the free plan works fine, especially since the app I'm building is very basic, with just three screens. The app is designed to keep track of projects I'm working on, appointments I have scheduled, or just things that catch my attention that I might want to explore later. There are only five fields for each item: key words (product name, company name, item subject, and so on), date added, "target date" (such as meeting date or due date), item description, and item reference (URL, etc.). If I use this same layout on other platforms I'll probably add an image field too.
Once you sign up on Adalo you can choose to make a desktop web app or a mobile native app, then you pick whether you want to start with a blank app or one of a half dozen app templates. For my project, I wanted to build the entire app myself so I started with a blank layout. The next step is to name your application (I named mine "Lest-I-Forget") and to pick the color scheme you want to use (green and blue-green in my case).
Adalo takes you straight to the design canvas when your initial setup is complete. At that point you'll see three screens already created for your project, a "signup" screen, a "login" screen, and a blank "Home" screen. Since I wanted my app to be public, I went ahead and removed both the signup and login screens. To do that, I clicked on the "Screens" icon on the left side of the design window, chose the screen I wanted to remove, clicked on the 3 dots up by the screen name, and selected "Delete". Note: If you wanted to restrict who can use your app, these two screens are fully functional and connect to a "Users" database that Adalo supplies automatically.
At that point, I decided to set up my "Items" database or "collection", so I clicked the "Database" icon on the left side of the design window and selected "+ Add Collection". I named the collection "Items" and added the five fields (key words, date added, target date, item description, and item reference). Note: After you add the first field in your database record you need to click "+ Add Property" to set up each of the remaining fields.
With the database created, I went back to "Screens" to work on the app design. A quick note at this point: Adalo has some keyboard shortcuts that can be really useful. As you add screen layouts the new ones are going to start disappearing off the right side of the design area. To move them back into view, press the right arrow and the CTRL key (CMD key on a Mac). Later, as you move back and forth between app screens, press the CTRL (or CMD) key and the left or right arrow, depending on which screen you want to bring back into full view. You can also press the CTRL (or CMD) key and the "+" key to zoom in or the "-" key to zoom out.
The only screen I had at this point was the "Home" screen, so I decided to use it as my main menu for the app. I clicked on the "Screen" icon on the left side of the design window, selected the "Home" screen, and clicked on "+ Add Component" to add a button element. Once I dragged and dropped the button onto the home screen, the button properties manager displayed on the left side of the window, with the name "Button 2". I changed the name to "Add Item Button" by clicking on the pencil icon next to "Button 2", then I changed the button's text to "Add Item". Scrolling down further, I selected "+Add Action", clicked on "Link" and "New Screen", and named the new screen "Add Item".
I'll get into the details of creating the different screens for my app in Part 2 of this post...
No comments:
Post a Comment