Once you have created a dynamic form, you build it by dragging fields onto a canvas and arranging them into the layout you need. This article covers adding, resizing, and reordering form fields — and how to lay out a form that people will actually complete correctly.
Designing a Form People Will Complete
A form is a conversation with the person filling it in. A little layout planning makes submissions faster, clearer, and more accurate:
Follow the user's train of thought — order fields the way the task naturally unfolds (e.g. "What happened?" → "When?" → "Who was involved?"), not the way the data is stored.
Group related fields — use Section Headers to break a long form into labelled parts (e.g. "Incident Details", "People Involved", "Actions Taken"). Long unbroken forms feel like paperwork; sectioned forms feel manageable.
Use Section Text for instructions — a short line of guidance above a tricky section prevents wrong answers better than validation errors after the fact.
Keep short fields side by side — place related short fields (e.g. First Name / Last Name, Date / Time) on the same row using reduced widths, so the form doesn't scroll endlessly.
Use Dividers sparingly — they separate major parts of a form visually without adding a heading.
Form Builder Layout
The form builder page has three areas:
Left Panel — Form Fields — a column titled "Form Fields" with the description "Drag a field onto the canvas." Fields are grouped into two sections:
Data Fields: Check Box, Date, Dropdown, File, Number, Radio Buttons, Repeater, Select Document, Select Process, Select User, Text, Text Area
Layout: Divider, Section Header, Section Text
Centre — Canvas — titled with your form name. This is where you build your form by dropping fields.
Right Panel — DCM (Dynamic Content Manager) — titled "Form Details" with tabs for Form Details, Field Properties, and Business Rules.
Adding Fields to the Canvas
Quick Steps
From the left panel, drag a field type onto the canvas
A shadow indicates where the field will be placed
Release to drop the field in position
Once dropped, the field appears as a chip on the canvas with:
A drag-and-drop icon at the top (for reordering)
The field type as the chip title
A description of the field type
A delete icon on the right
The chip fills the full width of the canvas by default.
Resizing Fields on the Canvas
Hover over the right-hand edge of a field chip
The cursor changes to a horizontal resize cursor with the tooltip "Resize width"
Click and drag to adjust the width
During resizing, the chip title turns green. If the chip is too narrow for its text, the text wraps onto the next line.
Resizing Fields via Properties
You can also set an exact width using the Properties tab in the DCM:
Select the field on the canvas
In the DCM, open the Properties tab
Set the Width Percentage (default is 100%, valid range is 3–100%)
Select Save
Reordering Fields
Hover over the drag-and-drop icon at the top of a field chip
The cursor changes to a move/four-way arrow with the tooltip "Drag to move"
Click and drag the field to its new position
A shadow indicates where the field will be placed
Fields with reduced width can be positioned side by side, provided their combined width does not exceed the canvas width.
Important: Always preview your form after rearranging fields to confirm the layout appears as expected — a layout that looks right on the canvas can still read poorly once labels and inputs are rendered. See Previewing and Testing a Dynamic Form.
Deleting Fields
Select the field on the canvas
Click the delete icon on the right side of the chip
Further Information
For configuring individual field settings (labels, required, hidden, options), see Dynamic Forms: Form Field Details, Properties, Rules. For adding repeatable sections, see Dynamic Forms: Create a Repeater Field.