# Interface designer

> [HTML Version](interface_designer.html)

In the Interface designer, you can customize the company’s interfaces with pre‑built and custom widgets.

**Widgets** are interface elements that allow users to upload files, display data, activity streams, tables, users lists, etc.

You can use widgets to:

- [Customize pages](360027211631.md).

- [Customize forms](360029250931.md).

By combining different widgets, you create an interface tailored for your users. In addition, you can save your widget combination and use it on different pages and forms over and over again. This way you can create various interfaces catered to the needs of your company. 

## Open the interface designer

The interface designer helps you design app forms and pages, as well as create [custom widgets](user_widgets.md). There are several ways to open the designer depending on the item that you want to set up.

1. To [create an interface](interface_settings.md):

- Go to **Administration > Interfaces**. Create a new widget of the **Page** type or other custom widget. The designer will open automatically.

- To set up an interface for a particular workspace or app, go to the app or workspace menu, click on the gear icon next to its name, and select **Interfaces**. Then create a new page or widget. The designer will open automatically.

2. To set up a new page from the main menu or workspace menu: 

- [Add a new page](360009924451.md) or open an existing one. Click on the gear icon in the top right corner of the page** **and click **Widget Builder**.

3. To set up an app form: 

- Open an app form in the [advanced mode](360028941032.md). Open the tab corresponding to the form you wish to set up, click** <Default>**, then click **+ Create Form**. If the form has been created earlier and now you want to edit it, click **Edit Form**. To learn more, see [Form templates](360029250931.md).

If another administrator is already working with an interface element in the designer, you can open this element in the designer for viewing only. To do this, when entering the designer, click **Open in View Mode** in the pop-up window.

## How to work in the interface designer

Here is what the interface designer looks like:

**(interface_designer-1.png)**

1. **Modeling canvas**. This is a workspace within which you will create custom widgets and customize the layout of pages or forms with widgets and properties. You can easily find any nested element. 

2. The [toolbar](#toolbar) allows you to save, publish, or debug an interface, as well as check whether the widgets are correctly composed. You can also undo or redo an action.

3. The interface designer has the following main tabs: **Template**, **Context**,** Scripts**,** History**, **Settings**, and** Files**.

4. The tabs on the right are for adding components to interfaces:

- **Widgets**. All available widgets are grouped by [type](360028901811.md).

- **Properties**. [System properties](common_widget_settings.md) of widgets, all the [context](360028941112.md) variables of an app or business process, and properties added on the [Context](designer-tabs.md#context) tab.

### Top toolbar 

The top toolbar has the following controls for working with the interface you are setting up:

**(interface_designer-toolbar.png)**

- **Save**.** **The page or form that you have set up will be saved as a draft. The changes will not be made available to users. You can return and edit it later.

- **Check**. The widgets that you have added are checked for errors. If there is an error, for example, there is an invalid scripts, you will see an alert.

- **Publish**.** **After being published, scripts are displayed on forms or pages, and become available to users. Each time you want your changes to be applied, you need to publish the interface. When publishing a version, you can:

	- leave a comment;

	- enable the **Unpublish all previous versions** option. This will prevent the scripts from older widget versions from running, and will help avoid  applying versions with errors .

- **Debug**. A window opens showing you how the form or page will look like in the interface after it is published. You can learn more in [Debug an interface](interface-debug.md).

- **Undo**.** **When working in the **Template** tab, you can undo your latest action: adding or deleting a widget, moving it, changing its settings.

- **Redo**.** **You can repeat the action that you have undone.

- **Start Editing**. This action is only available if you opened an interface element in the [view mode](#view-mode). It allows you to switch to editing mode if another administrator has finished working with this element in the designer.

````
начало внимание

````
To make changes available to users, don’t forget to **Publish** the form or page that you have set up.

````
конец внимание

### ````