The User Interface Editors are all organized in an hierarchical structure containing 4 levels. The top level is called a Tab. Beneath the tab, you can create one or more Groups. Beneath the groups you can create one or more Elements, which again can consist of one or more Fields.
Tabs
Groups
Elements
Fields
The structure is strict, meaning you cannot create a field directly to a flag or group. Fields can only be created to an element, which forces you to create a Tab, a Group and an Element before you can create the field you want.
Even if all levels must exist in order to create a field, you can decide whether or not to give them labels. If you chose to, for example, not give a group a Label, it will not appear with a name in the user interface of dRofus.
In the image below you can see an example of the organization within the User Interface Editor for Room Data.
Top menu. From the menu, you can add and delete Tabs, Groups, Elements and fields. You can also convert a field from one field type to another.
Navigation. Navigate through tabs, groups, elements and fields
Properties. Each tab, group, element or field got their own properties. The properties controls appearance and logic for the hierarchical items (tabs, groups, elements) and the various field types.
Preview. The preview will show you how the hierarchical items and fields will appear for the end user.