Design Manual Tasks via Task Designer Operation

The Task Designer Operation is the recommended method to design Manual Tasks (MT). It provides a no-code way to implement Manual Task forms: to generate them from template or other models or to build them manually in a drag-and-drop editor.

However, you can also choose any other Operation and proceed with the old way of designing MTs. For legacy MT design and customization methods, refer to the following documentation:

• Design Manual Task in Task Designer mode

• Design Manual Tasks via Code Editor

• Set up multi-document Manual Task

• Customize IE and non-IE Manual Tasks

note

Any MTs designed previously with other Operation types remain executable and compatible with the WorkFusion platform functionality.

In the Manual Tasks list, tasks based on the Task Designer Operation have a special indication. When you move the pointer over the indication, a prompt appears, showing the task type used to create the task.

Create Manual Task from Task Designer Operation

To create a Manual Task from the Task Designer Operation, follow the steps below:

1. In Control Tower, go to Manual Tasks > Create and click Task Designer Operation.

   

2. Choose the task type you want to create and click Select this Operation:

   • Single-page task if you have only one document to process in your MT.

   • Multi-page task if you need to process multiple documents in a single MT.

   

3. Upload data. Subsequently, you can see the uploaded data in the task preview area on the Design tab.

   

4. Navigate to the Design tab and start building a form layout:

   • Single-page task

   • Multi-page task

Single-page Manual Task

If you selected the Single-page task option to create Task Designer Operation, the Manual Task's Design tab opens with an Empty canvas component in the workspace on the right.

note

The Single-page task allows rendering raw Excel files. However, these files cannot contain more than one page. Therefore, any multi-page Excel you use in a Business Process must be split into several one-page documents. The labelling feature is not available for such raw documents.

Configure form layout

To configure a form layout for a single-page MT, follow the steps below:

1. On the Layout menu, find the Labelling component and drag it to where the Empty canvas component is.

   

2. As the component's settings page opens, choose a method to create the form layout:

   • Create manually: you build a layout manually using the Basic or Layout components from the MT Designer menus.

   • Generate from model: the layout is generated based on the training set of a selected model. In case the model does not include a training set, the labels for the form layout are taken from the model's output, in which case the layout is less precise.

   • Generate from template: the layout is generated based on the output of a selected template model.

     

3. Depending on the generation method chosen in Step 2 above, take the following actions:

   • For the Create manually method, skip the step and proceed to Step 4.

   • For the Generate from model method, choose a model.

     

   • For the Generate from template method, choose a template and its version. The Template version drop-down list includes only validated and published template versions (in the Ready to publish or Published status).

     

4. Specify the Property name matching the name of the column with the task data from the input CSV file. Typically, it is meta_info_json.

   

   As a rule, the column in the CSV file comprises JSON with the following fields:

   • pages (for labelling tasks) or originalDocumentUrl (for other tasks)
   • ocrXmlUrl
   • taggedXML or tagsMetaInfo if the model has already extracted fields
   See sample JSON code

   For labelling task:

   {
       pages: "",
       ocrXmlUrl: "",
       taggedXML or tagsMetaInfo: ""
   }

   For other tasks:

   {
       originalDocumentUrl: "",
       taggedXML or tagsMetaInfo: ""
   }

5. In the Type of view drop-down box, choose how the input preview area is positioned relative to the labelling area: Vertical or Horizontal.

   

6. In the Left panel width field, set the width (in percent) of the input preview area relative to the labelling area. The value in the Right panel width field changes automatically.

   The values you set in the fields are the default width values with which the resulting task form is displayed in Workspace assignments.

7. To save the form layout configuration, click the Apply button.

Next, the following happens, depending on the layout creation method you selected in step 2:

• If you choose Create manually, you go back to Task Designer where you can add form fields.

• If you choose Generate from model, you go back to Task Designer where you can see a form layout generated from the output of the selected model's training set. If the model has no training set, the layout is generated from its configuration.

  You can add or remove the model-generated fields, move them within the form, and edit their configuration. For editing the configuration, move the pointer over the respective field and choose a required action in the Actions menu.

  

• If you choose Generate from template, the form layout is automatically generated by the selected template model version. However, you cannot modify or view the template-based layout from Task Designer. To view the form or make changes, follow the link in the message displayed on the right panel.

  

  For more information about using templates for Manual Tasks, refer to the guide.

Update form layout configuration

To update a configuration, open the Labelling component's settings page. To do that, move the pointer over the component and click the Edit (pencil) button.

Add form fields

To add fields to build a Labelling task layout, drag the components from the Basic or Layout menus, drop them inside the Labelling component, and make necessary changes on their setting pages.

The Labelling form supports the following components:

Basic menu	Layout menu
Button	Columns
Date/Time	Content
Number	Field Set
Radio	HTML element
Select	Line item
Select boxes	Panel
Text area	Panel list
Text field	Table
	Tabs

For detailed component descriptions, refer to Choose form components.

Once you finish adding fields for labelling, click the Save button in the top right corner to save the resulting MT form.

Enable or disable labelling

Any Basic component you add to a Labelling form layout has the Allow labeling attribute checked by default. This means that when the form is rendered, users can fill the component-based fields by selecting values in the task input.

In a rendered form, next to the fields where the Allow labeling is enabled, you can see color indications:

If you uncheck Allow labeling, the following happens:

• In the rendered form, you cannot fill the field by selecting any data element in the task input. Once you place a cursor inside the field, the text selection is discarded.

• No color indication is displayed next to the component in the rendered form.

• On the component's setting page, the Hotkey field for selecting labelling hotkeys is hidden.

  

Multi-page Manual Task

If you select the Multi-page task option for Task Designer Operation, the Manual Task's Design tab comprises a multi-page layout with two tabs:

• Summary, a preconfigured static tab

  

• Doc {{item.doc_name}}, a tab that can be dynamically multiplied, depending on the task input. The page includes a task input preview area and a Labelling component where you can add form fields.

  

Configure dynamic and static tab display

To build a form for a Multi-page task, start with configuring the following:

1. On the Design tab, move the pointer towards the top right corner of the Doc {{item.doc_name}} page. In the displayed Actions menu, click the Edit (pencil) button. This opens the Multi doc component's setting page.

   

2. On the Display tab, choose one of the methods to create tabs:

   • Dynamically from input data: the quantity and names of dynamically multiplied tabs in the designed Manual Task are defined automatically based on the task input data. Each tab corresponds to an input data type, for example, an article or document name.

   • Manually: you manually set the quantity and names of dynamically multiplied tabs in the designed task based on your knowledge of the task input. Each tab should correspond to an input data type, for example, an article or document name.

   

3. Depending on the tab creation method from step 2, follow one of the instructions below:

   Dynamically

   In the Tab display name field, specify the input data file variable containing the data type, typically {{item.doc_name}}. This is the variable from which the tab name is retrieved.

   

   Manually

   In the Tab display name field, specify a name for a dynamic tab. In the Key path field, set the path to search for Key in the input data. The Key is formed automatically as you enter the tab display name.

   

   To add more tabs (if needed), click Add another and set them as described above. Make sure the names you add for the tabs correspond to the ones on the key path.

4. On the Display tab, set the Summary tab:

   • Specify a display name under which users see the tab in a rendered Manual Task.

   • Select the Hide navigation panel checkbox to hide an area listing all tabs in a rendered Manual Task.

   

   If a multi-page task includes no summary tab, you will see only the Add summary tab button. To add a summary tab, click the button and configure the settings as described above.

   

5. Select a Horizontal or Vertical layout to set how the tabs are arranged relative to each other when rendered.

   For the Vertical layout, you can also set the following:

   • Tab grouping by document types: select Group tabs and specify the doc_type grouping key.

   • Tab description: add a text description in the WYSIWYG editor box or click Source and set variables to retrieve the data from the task input.

   

6. To configure the input data mapping settings, go to the API tab and specify the Property name value matching the transaction data column name in the CSV file. Typically, it is _sys_transaction_json.

   

   If the input document data set is nested deep, add the Data path value. In the example above, the input data includes a Control Tower transaction comprising an object with a docs field containing a set of documents.

7. Click the Apply button to save the resulting configuration. The setting page closes, and you can proceed to set a layout of fields for the configured form.

Build form layout

To set up a form layout for a multi-page Manual Task, follow the steps below:

1. In the workspace on the right, move the pointer over the Labelling component and click the Edit pencil button to open the component's setting page.

   

2. On the Display tab, specify Property Name based on which the data from inside a multi-page transaction is mapped to the Labelling component. Typically, it is meta_info_json.

   

3. If needed, change the view type and panel widths. Then, click Apply to save the changes.

4. To add fields for labelling, drag the components from the Basic or Layout menus on the left to the drop area on the right and make necessary changes on their setting pages. For details, refer to Choose form components.

   

5. To configure viewing conditions for the added fields, open their setting page (if closed) and go to the Conditional tab.

   

   For the components within Data grid, Edit grid, and Container that might be dynamically created at runtime, set viewing conditions using the Advanced conditions section. The approach allows you to access values inside each row (tab).

   

6. Once you finish building your form layout, click the Apply button to save it.

Choose form components

To add components to a form layout, drag the options from the following two menus on the left to the drop area of the created form layout:

• Basic

• Layout

To edit any component settings, select the component and, in the top-right menu, click the pencil button to open the setting page and make required changes.

For more information on component settings, refer to the Form Builder guide.

Basic

The table below lists the components from the Basic menu and their brief descriptions.

Component	Usage	Illustration
Button	To add a button.
Date/Time	To add the functionality to set the date and time. The default format for setting the date is yyyy-MM-dd. To change the date display format, open the setting page and go to the Display tab.
Keywords	To include a field and an upload button for adding or removing individual keywords or custom keyword lists (for instance, for screening by AI Agents). The component also features duplicate keyword validation.
Number	To limit input to numbers only.
Payload Code	To set custom predefined submission data that becomes available upon executing the submission action. The component is not visible when the task form is rendered. Its only effect is that the data from the defined configuration is applied to the data and submission objects accessible to other components and visible in the submitted data.
Radio	To include radio buttons.
Select	To add a selection list field. You can also set an option for entering custom values.
Select bulk	To add drop-down menus (lists) comprising multiple items with selection boxes. On the menu (list), users can select or deselect more than one box at a time or switch the Select all toggle to choose them all. Also, you can set up search to work within the list.
Select boxes	To add select boxes to a page.
Tags	To include a field for additional categorization using tags.
Text area	To add a text area for extended descriptions.
Text field	To include a field for entering text.

For more information on component settings, refer to the Form Builder guide.

tip

For sample use cases with advanced MT configurations, refer to Deliver complex customizations via MT Designer.

Layout

The table below lists the components from the Layout menu and their brief descriptions.

Component	Usage	Illustration
Columns	To organize the form content in a number of columns.
Content	To add non-field information, for instance, instructions at the top of a form. Type the required content in the WYSIWYG editor.
Data grid	To include a line item grid where you can add multiple components from the Basic menu. In a rendered form, the components in Data grid look like rows that you can add or remove dynamically as necessary. Data grid is especially useful when you need to duplicate or add multiple field sets. For more information, read the Form Builder guide.	In Task Designer: When rendered:
Drill down	To make a Basic component or an element inside Data grid drill down to a specific page or tab.	In Task Designer (inside a Data grid component): When rendered:
Edit grid	To include a field set for capturing and displaying data in a task form. Inside the grid, you can add multiple components from the Basic menu. On a rendered form, the components in Edit grid look like a table that you can edit dynamically as necessary. Edit grid is especially useful when you need to duplicate or add multiple field sets. For more information, read the Form Builder guide.	In Task Designer: When rendered:
Field set	To create a title for an area in a form. Put it inside other Layout components or in between related components.
HTML element	To set up an HTML element.
Labelling	To set up a single-page labelling layout inside a Multi-page task or Single-page task.	For details, refer to Single-page Manual Task.
Line item	To organize the content as a table available for labelling. For details, refer to Line item.
Panel	To combine a number of fields under the same title and apply identical styling.
Panel list	To set up Data grid on a static (summary) tab for working with data from the dynamic tabs of a Multi-page task.
PDF viewer	To enable the display of original PDF documents without OCRing.
Table	To organize the content in a table.
Tabs	To organize the content as a collection of tabs.

For more information on component settings, refer to the Form Builder guide.

tip

For sample use cases with advanced MT configurations, refer to Deliver complex customizations via MT Designer.

Line item

Typically, one uses a Line item to add a group of fields sharing identical attributes, for instance, a list of commodities in an invoice where each item has characteristics, such as name, price, vendor, and so on.

To create such a table, drag one or more of the following Basic menu components to the Line item drag-and-drop area:

• Date/Time

• Keywords

• Number

• Select

• Text field

• Text area

note

Text area has a format that differs from the rest of the components in a Line item, which can affect the appearance of the layout.

When rendered, the components appear as a basic table row that you can duplicate several times in the course of labelling the task input by clicking the Add row button.

To configure the Line item component, follow the steps below:

1. Click the component's Edit (pencil) button.

   

2. Make necessary changes on the setting page:

   • Set the table column width as described in the section.

   • Disable or enable removing rows by selecting the respective checkbox. The feature is off by default and is not recommended for usage as it limits labelling capabilities.

   • Change other general settings as described in the documentation.

   

Set column width in Line item table

By default, the columns in a Line item table are set to have identical minimum widths: the Equal column width checkbox is selected, and all Column Minimum Width values are 120 px. The preset minimum width guarantees that columns will resize dynamically as per current UI behavior but never below the set minimum value.

To set another minimum width for one or more specific Line item columns, specify the respective Column Minimum Width values and click Apply to save the changes. You can set a value from 120 px to 700 px.

Alternatively, you can resize the column width as described below:

1. Deselect the Equal column width checkbox. A table appears, listing all Line item components.

   

2. In the Measure in column, choose whether you are going to set up relative width in percents (%) or fixed in pixel (px).

3. In the Content width column, specify exact width values. In the resulting Line item table, the values are applied to entire columns.

If you set a fixed value for a single column, the rest of the table is adjusted accordingly to the width of the labelling panel in the Manual Task.

Any percentage values you set are validated to total 100%. If any of them is invalid, you get appropriate warnings.

Any changes you make in the width settings are immediately visible on the Preview panel on the right. If the table width is more than the Preview display area, a scroll bar appears.

Configure settings for Line item components

To set up a specific component in a Line item table (Text field in the figure below), move the pointer over it, click the Edit (pencil) button, and make necessary changes. For details, refer to the Form Builder guide.

Any settings you apply to a particular component are applied to the entire Line item table column corresponding to that component.

info

When configuring components inside a Line item table, it is not recommended to set any of them to use multiple values (Data tab, Multiple Values checkbox).

Line item labelling

There are several ways how you can label task input while you are working with the Line item component in a Manual Task form:

• To label a single content element, select the element in the task input and click the respective field in the Line item table.

  The selected content element is inserted in the cell you clicked. In the task input, the element is highlighted in the color assigned to the cell.

  

• To label multiple content elements, select them and click a cell in the Line item table. In the context menu, choose an option to insert the selected content from the task input.

  

  The content you selected is inserted in the Line item table, arranged in accordance with the insertion option you chose in the context menu. For instance, the figure below illustrates the case for the Insert as table option: cells are inserted the same way they are arranged in the original table.

  

  In the task input, the inserted content is highlighted in the same colors as assigned to the corresponding cells.

• An alternative way to label multiple content elements is to select them in the task input and right-click the selection to open a context menu. In the menu, choose a Line item table element from where you want to start the insertion and select an option for how the data will be inserted.

  

Drill down

One can use the Drill down component to make elements clickable inside other components in a multi-page task. The options are as follows:

• Add Drill down inside a Data grid component. The option allows making a single column or element inside Data grid clickable.

  You can add any Basic component inside the Drill down component, for example, Button.

  

• Add Drill down outside the Data grid component. To drill down to a specific page or a tab, configure the following settings:

  1. In the Data Path field, specify the path to access documents from the input file.

  2. In the Data Id field, provide the id property of a page or a tab.

     

     

The configuration looks as follows:

• In MT Designer:

  

• When rendered:

  

Drill down using Data grid

You can also apply the drill-down feature using the Data grid component. To make a single column or element in Data grid a link to another element or page, do as follows:

1. Create a multi-page task and open the multi-page layout setting page:

   

2. On the Display tab, in the Summary tab display name field, type in the required value.

   

   If there's no summary tab in the task, click Add summary tab to create it and then specify its name.

   

3. On the API tab > Data path, provide the path to access documents from an input file.

   

   

4. From the Layout menu, drag a Data grid component to the Summary tab of the Multi-page Manual Task.

   

5. As the component's setting page opens, do the following to enable the drill-down feature:

   • To make the Data grid rows clickable, make sure the Clickable checkbox is selected .

   • Check if the Use multipage values checkbox is selected so that the Data grid can render rows dynamically based on the specified Data path. For example, if a Multi-page task contains three documents, Data grid renders three rows.

   

6. From the Layout menu, drag an HTML element component to the configured Data grid.

   

7. As the components setting page opens, set it to print the row data by using row.<field_name> as shown below.

   

Set labelling hotkeys

To make labelling faster and more convenient for human operators, assign hotkeys. The feature is available only for those form components that allow labelling inherently, for instance, Text field, Number, Line item, and so on.

You can assign labelling hotkeys on the setting page as you add an MT form component to a layout. For an existing form component, open the setting page by clicking the Edit button (pencil).

On the setting page, go to the Display tab. In the Hotkey field, type in the labelling hotkey you want to assign to the particular field. Use any letter or digit.

Mind that you can't assign the same hotkey to several fields. If this happens, you get a warning that the character you attempt to add as a hotkey is already in use.

In the resulting Manual Task form, each field with an assigned labelling hotkey has a color indicator next to its name with the hotkey letter or digit inside it:

To label a value in a document, select a text chunk and press the required hotkey. The selected text chunk appears automatically in the field corresponding to the hotkey you pressed. In the text, you see the chunk highlighted in the color corresponding to the label.