User Tasks

User tasks are semi-manual activities in which an IT system works together with a human actor. I.e., a human actor gets or picks a task from a task list.

In PROCEED, one user task is designed in exactly one HTML page which can also contain CSS. Therefore every user task is referencing a file with the attribute proceed:fileName. (Every user task HTML page of one process are stored inside the User-Tasks folder of the related process folder.) Multiple user tasks can point to the same file, so they will reuse the same HTML page.

By default, every user task gets a task constraint machine.outputs == Screen. This ensures that the selected Machine has a display to show the tasklist. There are some cases where it makes sense that a Machine without a display hosts a task list, e.g. if it is a server. In this case the constraint can easily be removed via the graphical interface.

If the HTML page references an online resource, e.g. a picture hosted on the internet, a second constraint needs to be added to ensure that the executing Machine has Internet access. This is sometimes automatically recognized and added (machine.online == true).

<userTask id="Task_0pjwckr" name="Erstelle Welle" implementation="https://html.spec.whatwg.org/" proceed:fileName="User_Task_0991eu7">
    <extensionElements>
        <proceed:processConstraints>
            <proceed:hardConstraints>
                <proceed:hardConstraint>
                <proceed:name>machine.outputs</proceed:name>
                <proceed:condition>==</proceed:condition>
                <proceed:values>
                    <proceed:value>Screen</proceed:value>
                </proceed:values>
                </proceed:hardConstraint>
                <proceed:hardConstraint>
                <proceed:name>machine.online</proceed:name>
                <proceed:condition>==</proceed:condition>
                <proceed:values>
                    <proceed:value>true</proceed:value>
                </proceed:values>
                </proceed:hardConstraint>
            </proceed:hardConstraints>
        </proceed:processConstraints>
    </extensionElements>
</userTask>

User Assignment

User tasks are assigned to a resource which works on the task. This is typically a user or a role.

This is currently not yet implemented and in development.

<userTask id="Task_0pjwckr" name="Erstelle Welle" implementation="https://html.spec.whatwg.org/" proceed:fileName="User_Task_0991eu7">
    <extensionElements>
        <proceed:processConstraints>
            <proceed:hardConstraints>
                <proceed:constraintGroup id="cg-0v1gzu0" conjunction="OR">
                    <proceed:hardConstraint>
                      <proceed:name>user.role</proceed:name>
                      <proceed:condition>==</proceed:condition>
                      <proceed:values conjunction="OR">
                        <proceed:value>Admin</proceed:value>
                      </proceed:values>
                    </proceed:hardConstraint>
                    <proceed:hardConstraint>
                      <proceed:name>user.role</proceed:name>
                      <proceed:condition>==</proceed:condition>
                      <proceed:values conjunction="OR">
                        <proceed:value>Manager</proceed:value>
                      </proceed:values>
                    </proceed:hardConstraint>
                    <proceed:hardConstraint>
                      <proceed:name>user.name</proceed:name>
                      <proceed:condition>==</proceed:condition>
                      <proceed:values conjunction="OR">
                        <proceed:value>Max Mustermann</proceed:value>
                      </proceed:values>
                    </proceed:hardConstraint>
                    <proceed:hardConstraint>
                      <proceed:name>user.id</proceed:name>
                      <proceed:condition>==</proceed:condition>
                      <proceed:values conjunction="OR">
                        <proceed:value>123</proceed:value>
                        <proceed:value>234</proceed:value>
                        <proceed:value>321</proceed:value>
                      </proceed:values>
                    </proceed:hardConstraint>
                </proceed:constraintGroup>
            </proceed:hardConstraints>
        </proceed:processConstraints>
    </extensionElements>
</userTask>

Access to variables

Within an User Task it is possible to retrieve and set variables of the processinstance. This requires certain changes inside the HTML Code of the User Task.

Given this BPMN-process, the User Tasks will interact with the variables by first entering a user’s full name. The set variables can then be retrieved to be shown in the next User Task.

BPMN Process

Set variables

User input can be used to set variables. Setting process variables is done like in a normal form. You can use every usual form element. Typically this is done with <input type="..." name="variableName" value="initialValue" ...> where name is the name of the process variable and value the inserted/changed/default value in the input field.

In this example, the variables firstname and surname are set by the Users input

<form class="form">
  <div id="i3jcu">
	<b id="i4m1">Enter full name
	</b>
  </div>
  <img id="inmmd" src="https://cdn.pixabay.com/photo/2015/07/02/10/40/writing-828911_1280.jpg"/>
  <div id="if91m">Welcome to this User Task! Enter your full name and submit to complete this task.
  </div>
  <label>
  First Name: <input type="text" name="firstname" required minlength="1" placeholder="First name"/>
  </label>
  <br/>
  <label>
  Surname: <input type="text" name="surname" required minlength="1" placeholder="Surname"/>
  </label>
  <br/>
  <button type="submit" class="button">Submit</button>
</form>

This is what is shown in the tasklist of the engine when encountering the User Task Enter full name: User Task in Tasklist

Retrieve variables

Existing variables of the processInstance can be retrieved to be shown inside the User Task.

For this, the HTML Code of the User Task must make use of the Whiskers template syntax to access and use process variables. It is easy and keeps templates readable by limiting tags to variables, statements (“for”, “if”, and “else”), partials, and comments. Usually you only need { } for accessing the desired variable.

In this example, the variables firstname and surname are shown inside this User Task

<form class="form">
  <div id="i3jcu">
	<b id="i4m1">Hello, {firstname} {surname}!
	</b>
  </div>
  <img id="inmmd" src="https://cdn.pixabay.com/photo/2015/07/02/10/40/writing-828911_1280.jpg"/>
  <div id="if91m">Welcome to this User Task! Just click the Submit button to complete this task!
  </div>
  <button type="submit" class="button">Submit</button>
</form>

This is what is shown in the tasklist of the engine when encountering the User Task Show full name: User Task in Tasklist