Meet the Platform: UI Builder, Data Models, and Actions

So you know exactly what kind of application you want to build. You can visualize the whole thing in your head and damn is it sweet. Congratulations, you’re most of the way there. Now, let’s take a look at the specific platform features you’ll use to make your application a reality.

MTP-blog

User Interface (UI) builder

The UI builder is everyone’s favorite feature when first creating applications. Why? Because it’s the most tangible (and shiny…) feature to start working with. This is how you’ll create everything your users will interact with, from forms and searches to multimedia. As you add components, features, and styling you’re creating what we refer to as an ‘object.’.

The sky’s the limit with the UI builder and spending time perfecting your objects’ visual style can have an impressive impact on engagement. Web and mobile objects do also come with some extra options for customization. Specifically, the ability to add in HTML, CSS and JavaScript frameworks.

It’s important to consider who will be using your application and on what devices. Try to design and add functionality to best target your audience. Having the best looking mobile app in the world doesn’t mean much if it lacks functionality.

MTP_UIbuilder

Data models

Data models are like that friend who remembers everything. Every piece of data entered by you or customers is stored right here. Here you’ll define all the information and information types (properties) you want to store. You’ll be able to call upon the information at any stage or even create temporary properties.

So how do you make a data model? Like most features in our platform, it’s a drag-and-drop visual interface. As a citizen developer or someone new to data modeling, this has the added benefit of maintaining a clear overview of how data sets, tables and queries relate to each other.

An example of a common individual data set (or ‘model’) would be a username and password. Pretty important stuff, better let your friend know to keep it secret. Jokes aside, please remember to keep your user’s privacy in mind.

MTP_datamodel

Actions (workflows)

What happens if you push the big red button (assuming you made one)? Well, actions are your way of telling your application exactly what to do. For example, sending an email when a user clicks a button. Unlike traditional programming, actions with Betty Blocks are built with a visual editor. Designing an action this way is far faster and even the most complex tasks are easy to follow.

Actions are created at two places in your application: in the back office and web module. Actions in your back office are called 'model actions', because they always involve a specific model, such as ‘Order’. Actions in the web module are called 'endpoint actions' because they are always created in a post endpoint. Actions always contain variables to execute the action events with. Variables could be objects or collections from your stored data.

MTP_actions

Ease-of-use features for citizen developers 

If you’re new to development then the features above will give you everything you need to build your first application. However, the Betty Blocks platform is designed by humans and for humans, so we’re always looking for ways to make development even easier.

So let’s take the example of your own first mobile application. Your new application (made with the tools we just covered) connects a database of personal trainers with clients. You’ve got all the data, actions, and a great looking UI.

So what if, later in the development process, you decide you want to make changes to a particular action or data model? That’s where the integrated module switcher comes in. It gives you a handy visual representation of your app's structure, meaning you can find any module at a glance.

The finishing touches

 As you get a little more experience with developing you’re going to want to add all the polish that you can. No matter what the purpose of your application is, there are always features that you can use to add value for your user base.

Web service integration is an excellent example of an ‘added value’ feature. It enables the use of external services such as Google Maps in your own application. In the example of the fitness app, having a location feature will not only people find trainers, but trainers near them. It’s an easy to connect feature which can make all the difference for your user.

The tools below are a good starting point if you’re looking for new features to add:

  • Web services integration
  • Mailbox integration
  • Templates (everything from text to javascript)
  • Custom variables
  • Public files
  • Changelogs

Ready for more?

First off, thanks for reading till the end! I know we covered quite a few features but now you’ve hopefully got a better understanding of the tools available on our platform. The question now is: do you think you’re ready to test it out?

If you are, then we offer free demonstrations here. If you’d prefer to learn a little more before diving in, then you should definitely check out our no-code whitepaper.

New call-to-action