Flexible layouts – better UI design. New opportunities in UI Bakery


Tatiana Yudina

We promised to provide a responsive design a long time ago. Finally, it’s right around the corner. Why did our team need so much time? Because we wanted to rebuild layouts totally to give you more opportunities in the UI Bakery low-code internal tool builder. These new features will help you create a better design with our low-code platform.

Flexible layouts with ready widgets and UI components allowing to create web design faster


Old spaces were good for developing simple layouts, however, they were not flexible enough for all types of applications you may decide to create. Spaces have been added to the other elements. Now, this option is available in the list of elements.

Previously, you were not able to add a space into space, which limited your possibilities in building a unique design. Thanks to the latest improvements, you can easily implement microlayouts. For example, you want to create a list of contacts: you have the main space with vertical direction – a list, and each contact has its own horizontal layout with avatar, name, and button.

Note: you can manage, copy, resize, delete, and customize all the spaces. They must lay in one main space: the main space of the page, the main space of the card body, etc.

How to use predefined components to simplify web design creation in a low code development platform


It was quite challenging to create a form earlier. You needed to add a space for each element to place elements one under another. Now, you just need to set the direction as vertical, and add a spacing to particular elements. Feel the difference.

How to build your web app design faster with flexible layouts available in UI Bakery


Before you could define a space width only in pixels and percentage. To increase the responsiveness level, our team added columns. We use a standard 12-grid layout, so each space can take from 1 to 12 columns on the screen.

Design opportunities in a low code development platform allowing to build UI faster

Drag-and-drop resizing

Obviously, people who build interfaces enjoy using drag-and-drop technology. Now, you can drag-and-drop spaces to change the size. In the near future, we will provide our users with an ability to move spaces within the screen. Our team has added a resize handle (a white square in the bottom of the space) to allow you to change the size directly on the page.

Note: if you set the space size in percentage and drag-and-dropped the size, the space would change the units to pixels. 

Drag and drop in a low code development platform to create UI design on the fly

We believe that the new UI Bakery features will make an app development process much easier.

Want to become an early adopter to try all the new features first? Let us know via [email protected]

February 6, 2020

Latest articles