Skip to content

UI/UX updates in Sitebuilder+

  • by

Along with the new complex features, our team developed some important UI improvements in Suitebuilder+ during the last year. Here are the highlights of the enhancements we made.

Page layout flexibility enhancements

These enhancements include a set of capabilities that help you better customize their design and layout workflow.

Ability to cut, copy, and paste blocks 

You can now copy or cut a block on one page and paste it across different pages of the website if you need to put the same information on multiple pages. To make these functions visible, we added the More icon to the block’s Control pane, which triggers the drop-down list with the copy, cut, and paste options. 

This feature also allows you to reuse existing block content as a template for creating new content faster. 

Move up and Move down options

We analyzed users’ behavior and discovered that most of them move blocks one down or one up on the page. So, to make the process of moving blocks through the layout even simpler, we replaced the drag-and-drop feature with more straightforward Move up and Move down options in the blocks.  

Ability to change the width of the block title 

According to our in-app survey, many users requested us to implement more design customization options for blocks. To give our users more opportunities to create unique designs, we added the ability to change the width of the block titles. Now the title containers are extendable, and the block layout automatically adjusts to the changes. 

Watch the video below to see how these enhancements work. 

Content editing improvements

We’ve enhanced various content editing features to make the user experience better and help you speed up the site-building process. 

Header preview improvement

Previously, when trying to change the title type, you saw a drop-down list of options that did not differ visually, making it hard to choose the relevant option. We changed that, and now the drop-down list shows the preview of the elements and gives you an idea of the size and font of the header options. 

Header preview improvement

Usability improvement for content alignment options

We reconsidered our approach to the content alignment settings and made them more accessible. In particular, the button alignment pane is now available upon clicking on the respective button and the Horizontal alignment section is available in the Block settings > Appearance tab for the necessary blocks. 

Footer links usability improvements

The footer links customization is now simplified. We’ve gathered all the link settings in one menu, making interacting with them easier. Also, we improved the UX for changing the footer navigation items order.

Footer links usability improvement

Content discoverability

To make the search option easier to reach, we moved the search field from modal headers to the content part in the extensions, such as Page manager, Google maps settings, Icon settings, and Free stock photo library.

Time input option support for contact forms

We extended the contact form builder functionality. Except for basic fields such as name and email address, you can now add the preferred date and time of contact. This lets you provide a better user experience for your website visitors. 

Time input option support for contact forms

Custom block behavior enhancements

Along with the Control pane’s behavior improvement in the Custom block, we added approximate thumbnails to the widget dialog windows instead of icons. Now you can have a better idea of what the widget looks like before adding it to the canvas.
Check these improvements in our editor. Hope you’ll enjoy them.

Tags: