Skip to main content
Version: 2.1

UI and ServiceApps

There are two types of applications in DRAW:

  • UI App: Application which has a user interface and will run on a device which has a screen (smartphone, tablet, laptop). It is used to create frontend applications.

  • Service App: Application which doesn't have a user interface and will run on a device which doesn't have a screen (a server, an IoT device). It is used to create backend applications.

UI App

The UI Application brick can be drag-and-dropped from the Project Editor’s Marketplace. By default, an UI Application automatically gets a Home screen.

All available Screens can be drag-and-dropped from the Marketplace into the Project Editor and they are part of the UI design of the application.

The App can be opened and tested by running it on a smartphone/tablet or in a new tab using the UI App contextual menu items Share or Run in browser.

Screenflow editor

The Screenflow Editor provides a way to create and edit all the Screens used in an App or in a screen, together with their interaction way through transitions defined between the Screens.

Here, the user can define which is the initial screen, known as the Home screen, represented by the blue play button and create transitions between Screens by using the Create transition arrow. Editing an existing transition can be done from the yellow arrow, which will point to the Screen sub-editor. If a transition was defined as a UI action in a Screen, the referenced screen and the transition are automatically reflected in the screenflow.

The App can be opened either in a new tab, either by scanning the QR code with a smartphone/tablet from the upper-right buttons Open App in new tab or Share App. If the App is running, any modifications done in the UI App Editor are reflected real-time in the opened App on the device.

Properties editor

The Theme can be selected from the drop-down menu (if themes are available) from this editor to define the look and feel of the application, together with the Actions and Functions defined for On start and On load options when running the application.

ServiceApp

In contrast with the UI App where the user can define how the application can look, The ServiceApp only runs logic from the backend point of view.

It can be added from the Project’s Editor Marketplace.

Inside the ServiceApp editor, the ControlFlow input and output of an action can be created and defined, tailored for the Application. The ServiceApp can be tested and run inside the Editor through the Play button.

Service Apps run instantly on the instance as NodeJS application and they can be started or stopped from the Editor. Remote Actions are Actions running on the backend, like querying a database which might require specific connectivity not accesible from a browser. Another Editor at the project level provides monitoring information and centralized control: start, stop, logs reading and configuration for the parameters.

service_apps

The user has the possibility to search through the list of the ServiceApps or create new ones from drag-and-dropping the Function brick from the Marketplace. At any moment, a ServiceApp can be removed from the list.