Overview of the model-driven form designer

[This topic is pre-release documentation and is subject to change.]

The new model-driven form designer provides a modern WYSIWYG authoring experience when you work with model-driven forms. It includes several improvements not available in the classic model-driven form designer.


This feature is currently in preview.
Preview features aren’t meant for production use and may have restricted functionality. These features are available before an official release so that customers can get early access and provide feedback.

The designer shows a real-time WYSIWYG preview (Unified Interface only) while you author a form. Changes to the form are instantly reflected in the preview, enabling you to see exactly how the form will appear to users when published.

Completing common tasks, such as setting properties, is simpler and faster with an always-available property pane. Also, Save and Publish are a single action, which streamlines the tasks.

The form designer interface has the following areas:

  • Command bar – Displays available actions such as Save, Publish, Undo, and Redo.

  • Panes – Displays panes with specific functions, such as a Fields pane that you use to add fields to a form.

  • Form preview – Displays a real-time preview of the form as it will appear to users when published.

  • Property pane – Displays properties of the selected element, and also allows you to make changes.

    Form designer layout

See also

Create or edit forms using the form designer
Add, move or delete fields on a form using the form designer
Add, move or delete sections on a form using the form designer
Add, move or delete tabs on a form using the form designer
Properties available in the form designer
Configuring header properties in the form designer
Using the tree view in the form designer
Create and edit fields