Work with an interface

Depending on the chosen template, your working area can be either blank or already include some UI elements.

Builder interface

The UI Bakery project is live in edit mode. That means that you can edit your app and test it right away. By click, you can execute triggers and load data.

Header contains an App state modal button, an indicator of Actions execution, Undo and Redo buttons, Publish button, and Preview button that hides all the sidebars.

Left sidebar includes the menu with the following elements:

  • "Components" including the list of all the UI components that you can drag-and-drop to the working area.

  • "Pages" containing the list of your app pages, and allowing you to create or update any page.

  • "Navigator" showing the current page element structure.

  • "Data sources" – a place where you can connect your databases and APIs to your UI.

The left sidebar also has a Pin button allowing you to pin the sidebar or unpin it. When unpinned, it will hide automatically once you click on the working area.

Working area is a part of the interface where you can assemble your application page from UI components.

Right sidebar displays the settings of the currently selected UI component. It includes 3 tabs:

  • General settings.

  • Appearance.

  • Triggers.

Bottom area contains the Actions panel with all the application Actions. There, you can create and edit Actions, run them, debug the result, and check the action results and errors.