2. UI building experience
Both tools employ a similar approach for designing interfaces, using drag-and-drop functionality to assemble components within a layout system based on columns.
Working area and canvas
Both applications use roughly the same dimensional grid for the working area.
- UI Bakery
UI Bakery uses 24-column layout.
- dronahq
DronaHQ uses 24-column layout.
Adding a component to a card
In UI Bakery, working with components is more elaborate. Components do not overlap each other and can be easily added to cards. While overlapping components may seem useful, it may can issues when trying to change the layout of an existing application. On the other hand, UI Bakery's method helps you quickly move components to an empty space and make room for new components.
- UI Bakery
If the component is too large to fit in the card, it will shift the other components and cause a scrollbar to appear.
- dronahq
Сomponents do not shift each other at all, they overlap each other in all cases.
Development mode
UI Bakery offers a user-friendly and easy-to-use interface for building UI with a dark theme, making it more comfortable for developers during the development process. Additionally, UI Bakery uses standard and widely-accepted terminology for functionality, features, and interface elements, making the learning process less frustrating and confusing.
- UI Bakery
Dark theme.The dark theme in UI building helps to distinguish the developer interface from the user interface and is easier on the eyes when used regularly.
Functionality is clearly labeled and widely used by developers in both the general programming field and in low-code environments.
-min.png)
- dronahq
Standard light theme.
The interface is too light for people eyes and some settings are arranged in a chaotic manner.
There are too many small sidebars and panels, making the layout cluttered and confusing.
In DronaHQ, some functionality and components are labeled differently than expected, which may cause confusion for those migrating from other platforms. (Connectors (DronaHQ) - datasources, controls (DronaHQ) - components, etc.)
Templates
DronaHQ currently offers a broader range of templates, however, it's worth noting that these templates are only a set of visual design without any embedded logic.
UI Bakery offer templates that come with functionality and could be used as a starting point or a reference for a real app.
- UI Bakery
UI Bakery provides 20+ templates.
- dronahq
DronaHQ provides 20+ templates.
3. UI library and component design
While it might seem that UI Bakery has less components, in reality, lots of components DronaHQ offers, could be created using UI Bakery’s components panel settings. For instance, DronaHQ has each type of chart as separate component (Line, Bar, Donut, Area). UI Bakery has a single chart component and a setting that allows to configure the chart's type as well as provide the ability to configure custom configuration supported by eCharts library. Another example is DronaHQ card controls. In UI Bakery, it is possible to achieve the same type of layouts and many other by using a configurable Card control
Component library
DronaHQ looks like a winner is this comparison. Despite offering over 100 components, some of them may raise questions about their relevance for internal applications. It may be beneficial to prioritize quality over quantity in certain situations. For instance, the most commonly used component in many applications, a table, is a lot more configurable in UI Bakery.
- UI Bakery
57 components available.
There is a feature that allows for convenient searching of components and grouping them by meaning.
Adding of component can be by two ways: by clicking and by drag-n-dropping on a working area.
Custom component available.
- dronahq
119 components available.
Efficiently search for and organize components by their purpose.
Components can be added in two ways: by clicking and by dragging and dropping onto the work area.
Custom JS component is available.
End-user design
It is worth noting that the components in UI Bakery are visually smaller, and their scale is better balanced. This allows more components to fit on the screen. For instance, in the provided examples, the dashboard of UI Bakery is compact and doesn't require scrolling, while the dashboard of DronaHQ doesn't fit the screen and requires vertical scrolling.
Datasources
For low-code platforms, the ability to integrate with various data sources is essential. Both applications provide a minimum set of the most popular data sources and integrations.
Number of datasources and integrations
It's true that DronaHQ outshines many low-code tools in this aspect, but UI Bakery has all the most widely-used and frequently requested datasources and third-party services and APIs.
- UI Bakery
18 - databases
17 - third-party services and APIs
- dronahq
22 - databases
41 - third-party services and APIs
.png)
.png)
.svg.png)
.png)
.png)
UI Bakery vs. Retool
Read an article ↗
