Did You Know: 5 Great Features of the Responsive Forms Designer

The Responsive Forms Designer, now available with Nintex Forms, allows you to create beautiful and powerful forms that are automatically optimized for any device or screen size. With the rapid pace of tech advances, responsive design is becoming an increasingly necessary component to any online interactions, including at the data-capture phase of your most important business processes.

While the Responsive Forms Designer has many great features, there are five in particular that I am loving the most:

1.  Responsive From Beginning to End

Not only does the new Responsive Designer allow you to create responsive forms for your end users, but the design experience itself is responsive. For example, one of the most common updates we make to our Nintex Forms is to implement a multi-column layout instead of the default single-column layout. With the Responsive Designer, you can simply drag and drop your controls on the canvas to easily reposition them into a two-column layout.

Responsive Forms 1

The Responsive Designer also makes it easier to add new controls onto the form. New rows are automatically created and controls are shifted accordingly when you drag and drop a new control onto the canvas. Resizing controls is a breeze with the “Increase width” and “Decrease width” buttons on each control.

Responsive Forms 2

2.  Streamlined Controls

One of the more subtle, but very impactful changes with the Responsive Designer is the combination of each input control with its corresponding label control. As you may have noticed in the previous examples, the label control is tied to each input control, so when you rearrange controls on the canvas, you only need to do move each control once.

This. Is. Huge!

Of course, you still can change the label at any time by simply selecting the control and updating the “Title” in the Properties pane on the right side of the canvas.

Responsive Forms 3

3.  Themes

Once you’ve rearranged all of the controls for easier data capture, you will likely want to update the styling of your form to match your company’s look and feel – otherwise known as branding. The Responsive Forms Designer provides a Theme feature where you can easily adjust form colors and fonts, without the need for Cascading Style Sheets.

For example, I can change the color of my Save button, select a different font, and update the size and color of the text on my form, through the Global styles section of the Theme pane.

Responsive Forms 4

4. Updated Rules Pane

I really like the new presentation of the Rules pane in the Responsive Forms Designer. The formatting and validation rules have been combined into a single definition structure, which resembles an “if-then” statement. For example, when Start Date is in the past, then Invalidate (i.e. the form cannot be submitted), and display this Validation Message.

Easy!

Responsive Forms

5. Power of Choice

While the Responsive Designer provides some great advantages, there are times when you may still prefer the Classic Forms Designer. For example, the Responsive Designer does not currently support custom CSS or JS/jQuery, so for these you’ll use Classic. Luckily, Nintex makes this easy.

When you create a new Nintex Form, you will be presented with the option to specify which design experience you would like to use.

Responsive Forms 6

 

This choice is available whether you are using Nintex for SharePoint 2013, Nintex for SharePoint 2016, or Nintex for Office 365. So, no matter where you are automating your business processes, you have the power to choose the forms designer that makes sense for each scenario.

So, What Next?

Have you tried the Responsive Designer yet? Whether you are tired of nudging your controls and labels to get them lined up just so, or you are intrigued by the option to use the Theme settings instead of CSS for form styling, the next step is to try it out!

If you are using Nintex for Office 365, it should be automatically available in your tenant. If you are using Nintex for SharePoint 2013 or 2016, you may need to update your Nintex product to the latest version. Details on that process can be found on the Nintex Community site, Nintex Connect: here for 2013, and here for 2016.

 

Visit the Nintex Community today to learn more and engage in conversations with fellow Nintex users! 

 

Nicole Prestby

Nicole Prestby is a Senior SharePoint Consultant at Abel Solutions.