New “Cosy” Form Interface

With our December 2023 release, we have introduced a new form view mode that we refer to as our “Cosy” interface.

All newly created forms will utilise this new Cosy interface by default. Existing forms will not automatically convert to the new cosy interface, but they can easily be switched over to it.

Comparison

The new Cosy interface concentrates on modernising the general look and feel of forms as well as providing a more visible distinction between sections.

Many elements now have rounded corners and Sections are visually elevated from the page by a slight shadow. Sections can now also be merged to create groups (see Merging Sections).

Subtle changes were also introduced to many of the form components.

Old vs new form design comparison

The default max form width is now set to 1400px and this creates symmetric margins on the sides of the form which contributes to better readability on wider screens.

Switching between old and new design

Existing lists

Existing lists will not automatically upgrade to use the new Cosy interface. The owner of a form can manually choose to switch to the new design via the Sintel Forms Designer.

When you open the configuration of an existing form, a message will be displayed above the form layout.

New design hint for existing forms

You can enable the Use the new design switch to switch on the new Cosy interface. The message can be dismissed and will not appear again for that specific form. It will also not show up the next time the Sintel Forms Designer is opened if the form configuration was saved regardless of the chosen design version. It is always possible to change the interface from within the Settings screen by choosing Theme & Styling / Apply the new design.

Design version switch

New lists

New forms created after the new interface has been rolled out will by default use the new Cosy interface. It is possible to switch back to the traditional interface by navigating to Settings / Theme & Styling / Apply the new design in Sintel Forms Designer, as shown in the above image.

Imported lists

Imported lists will inherit the same design version that they were exported from.

Merging sections

The new Cosy interface adds support for merging multiple adjacent sections. This enables you to create varying column layouts treating adjacent sections as if they were a single section.

Merging sections in Sintel Forms Designer

Merged sections

Removing background

In the new Cosy interface, it’s now possible to remove a section’s background. The section will become transparent and its border and shadow will be removed.

Fields within this section which inherit their Theme settings from the section, will also have their background removed.

Middle section with removed background

Date field updates

In the Cosy interface, the date and time field has been updated. It now provides a more accessible value picker control, but more importantly, the date and time fields are now merged and its value can be selected in one operation from the new picker control.

Date and time field and picker.

Validation visualization

Validation issues on forms are now more prominent and easier to find. Fields with validation issued are not highlighted in red.

Increased visibility of invalid fields in the form