Introduction

 

Despite its ease-of-use and friendly user interface, Kontinuum is still a development environment for producing computer systems. Just like any other computer system, these web-enabled, workflow applications that Kontinuum can generate need to be designed first and developed second. To that end, several example workflow applications will be shown – each growing in complexity – starting with a simple Leave Form Application system. The design of these examples will be discussed, taking into account such considerations as; users, user groups and user security definitions, form design and data considerations, as well as the construction of the workflow itself.

 

The examples will demonstrate the initial analysis phase where existing roles, hard-copy forms and manual procedures are studied before coming up with a design that ‘translates’ the existing, manual work process into a Kontinuum workflow. Once the design is finalised, the steps required to implement it in Kontinuum will be shown.

 

For more information on workflow design you can check out http://workflow.wordpress.com/2006/03/08/how-to-model-a-process-part-one/

 

 

Example #1: The Leave Form Application

 

Analysis and Design

 

In our virtual company, if an employee wants to take some leave they are required to fill out a Leave Form Application (see Figure 1), check with their immediate manager that this won’t adversely impact their work schedule and then wait for final approval from the office manager.

 

By completing this application you should gain an understanding of user and user type management, how to create basic forms, subforms and questions as well as how to create basic workflow applications within the Kontinuum Design Studio.

 

Figure 1.

 

Step 1: Design User Roles:

 

The first step is to work out how many different roles are at work here in our process;

 

  1. The Employee

 

The employee that is requesting a period of leave starts this process.

 

  1. The Employee’s Manager

 

The manager of the employee tentatively approves the period of leave.

 

  1. The Office Manager

 

The Office Manager has final approval.

 

So, there are three different roles in our work process. At this point, it should be noted that there is a subtle difference between user roles and the actual users themselves. Think of a user role as representing a group of users. So, in our current example, if our virtual company has 30 employees then there will most likely be 30 different users in the final system. However, they will all belong to the user type of ‘Employee’. Of course, just as an employee may have multiple roles to play in the workplace, our Kontinuum users can belong to more than one user group.

 

The remaining two roles in our current example process are the employee’s manager and the office manger. These roles highlight the need for user access restrictions in automated workflows. In our manual process, after the employee has filled in the details of their leave application, there are two levels of approval that follow. This requires the leave form to be signed and dated by both the employee’s manager and the office manager. The employee would have to be a good forger if they were to try and approve their own leave! In our automated workflow in Kontinuum, this can be prevented by using user access permissions. By assigning different rights to the various user roles, users can either be granted or denied access to various steps in the workflow. Also, the visibility of certain fields on a form can be controlled in a similar fashion.

 

 

Step 1: Design User Roles – Summary:

 

For our current example, the need for three distinct user roles has been identified; Employee, Employee Manager and Office Manager. All the employees in our virtual company will belong to one or more of these roles. It has also been noted that these different roles will govern what the end-users of the final system will be able to see and do.

 

 

Step 2: Design Forms:

 

The next step in our analysis phase is to work out what the screens in our final system will look like. As all the relevant information in our process is represented on the existing leave application form itself, this will be the model for our primary form. As mentioned earlier, our final automated system will be able to restrict what users can see and do. In this case, it would be appropriate for an employee to edit the main fields but not the approvals section (in fact there is no need for the approvals section to even be displayed to the employee.) Conversely, the employee manager and the office manager need to be able to see the main fields but not edit them, and have access to the relevant approvals sections.

 

Office Manager’s authorisation section.

 

Manager’s authorisation section.

 

Employee fields: this section is filled in by the employee – managers only view this section.

 

Figure 2.

 

Step 2: Design Forms – Summary:

 

For our current example, the need for a single screen has been identified. All the employees in our virtual company will be able to create a leave application using this form. Only managers will be able to approve or decline those applications.


Step 3: Design Workflow:

 

The final step in our analysis phase is to define the workflow itself. Any number of flowcharting products can facilitate the visualisation of the workflow. In the absence of such tools, just drawing the workflow down on a piece of paper is better than not performing this step at all!

 

In our current example, the workflow is a simple sequence:

 

Figure 3.

 

Step 3: Design Workflow – Summary:

 

For our current example, the workflow is a simple sequence with notifications of whether the leave has been approved or not flowing back to the employee and their manager.

 

This completes the analysis phase for the Leave Form Application system. Some high-level design decisions have also been made. The finer points of the design will be covered and decided upon during the implementation phase using Kontinuum.

 

 

Implementation

 

Step 4: Implement User Types and Users:

 

Log into Kontinuum with a user logon that has design permissions. Select Admin Users from the top menu bar:

Figure 4.

 

 

Kontinuum’s user maintenance section will be displayed.

 

Click on the ‘User Types’ node in the tree control in the left-hand pane of the browser. Select ‘Add User Type’ in the context-sensitive menu that appears:

Figure 5.

 

The ‘User Types’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and check the ‘Create New Instances’ checkbox.

 

Click on the ‘Submit’ button.

 

You have now created a user type.  User types are a key part of Kontinuum as they define what permissions are applied to users within Kontinuum.

 

Note:

The additional fields displayed in the ‘User Types’ maintenance screen will be covered in more depth later on. For now, the only access permission being granted to the ‘Employee’ user type is ‘Create New Instances’. This allows members of the ‘Employee’ user type to create one or more instances of the leave application workflow and nothing else.

Figure 6.

 

Add a ‘User Type’ for employee managers:

 

The access permissions being granted to the ‘Manager’ user type are; ‘Reports’, ‘Task List’, ‘Items List’ and ‘Create New Instances’.

 

This allows members of this user type to create new instances of the leave application workflow, monitor employee’s pending leave applications and run reports.

 

Note:

Depending on the permissions of the user currently logged in (ie. the ‘designer’ user) some of the options displayed in Figure 7 may not be shown.

Figure 7.

 

Add a ‘User Type’ for office managers:

 

The access permissions being granted to the ‘Office Manager’ user type are; ‘Reports’, ‘Task List’, ‘Items List’ and ‘Create New Instances’.

 

This allows members of this user type to create new instances of the leave application workflow, monitor employee’s pending leave applications and run reports.

Figure 8.

 

Now, the users need to be created and assigned to one of the three user types.

 

Click on the ‘Users’ node in the tree control in the left-hand pane of the browser. Select ‘Add User’ in the context-sensitive menu that appears:

Figure 9.

 

 

The ‘User Details’ maintenance screen will appear in the right-hand pane of the browser. Firstly, fill out the required fields on the ‘Users’ tab for the user ‘Chris’.

 

Enter a new password and confirm the password by entering it a second time.

 

Note:

Mandatory fields are depicted by a red asterix.

Tabs that contain errors are depicted with a red X beside the name of the tab.

Figure 10.

 

 

Then, click on the ‘Member of User Types’ tab and add the ‘chris’ user to the ‘Employee’ user type. Click on the ‘Submit’ button.

 

You can now created a named user account which belongs to a user type.  This allows someone to log into the system and interact with it.

 

Note:

The additional tabs (and the associated fields) displayed in the ‘User Details’ maintenance screen will be covered in more depth later on. For now, only the user name, password and user type are being set.

Figure 11.

 

Using the same process outlined above, add two more ‘Users’ – one as an employee manager and the other as an office manager.

 

Fill out the required fields on the ‘Users’ tab for the user ‘Paul’.

Figure 12.

 

 

Then, click on the ‘Member of User Types’ tab and add ‘Paul’ to both the ‘Employee’ user type and the ‘Manager’ user type. Click on the ‘Add Row’ button to add the second user type.

 

Click on the ‘Submit’ button.

Figure 13.

 

 

Fill out the required fields on the ‘Users’ tab for the user ‘Oliver’.

Figure 14.

 

 

Then, click on the ‘Member of User Types’ tab and add ‘Oliver’ to both the ‘Employee’ user type and the ‘Office Manager’ user type. Click on the ‘Submit’ button.

Figure 15.

 

Step 4: Implement User Types and Users – Summary:

 

At this point, the three user types have been defined and a single user has been created under each of those types:

 

Figure 16.

 

Step 5: Implement Forms:

 

Select Admin Forms from the top menu bar:

Figure 17.

 

 

Kontinuum’s form maintenance section will be displayed. Click on the ‘Forms’ node in the tree control in the left-hand pane of the browser. Select ‘Add Folder’ in the context-sensitive menu that appears:

Figure 18.

 

The ‘Folders’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button.

Figure 19.

 

Note:

The forms that will make up our ‘Leave Application’ system will be grouped logically under this folder. This isn’t mandatory and in fact the forms could be created directly under the ‘Forms’ node. Putting the forms in their own folder groups them together and separates them from other forms used in different Kontinuum applications.

 

Click on the newly created ‘Leave Application’ folder node in the tree control in the left-hand pane of the browser. Select ‘Add Form’ in the context-sensitive menu that appears:

Figure 20.

 

The ‘Form Details’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button.

 

You have now created a form which can be placed in a workflow to capture information from a user.

 

Note:

The additional fields and the ‘Form Rules’ tab displayed in the ‘Form Details’ maintenance screen will be covered in more depth later on.

 

 

Figure 21.

 

 

Click on the newly created ‘EmployeeForm’ form node in the tree control in the left-hand pane of the browser. Select ‘Add Sub Form’ in the context-sensitive menu that appears:

Figure 22.

 

 

The ‘Subform Details’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button.

 

You have now created a subform.  A subform defines how groups of questions are displayed to the end users but also in which table the answers to those questions are stored in the database

 

Note:

The additional fields and the ‘Subform Rules’ and ‘Question Coordinates’ tabs displayed in the ‘Subform Details’ maintenance screen will be covered in more depth later on.

Figure 23.

 

 

Click on the newly created ‘EmployeeLeaveDetails’ subform node in the tree control in the left-hand pane of the browser. Select ‘Add Question’ in the context-sensitive menu that appears:

Figure 24.

 

 

The ‘Question Details’ maintenance screen will appear in the right-hand pane of the browser. The first field on the existing, paper-based Leave Form is the employee’s name. In Kontinuum, this value can be derived from the user’s logon credentials. The value need only be displayed in a textbox.

 

Select an ‘Answer Box Type’ of ‘Text Box’ and click on the ‘Submit’ button.

Figure 25.

 

 

After clicking on ‘Submit’, the expanded question details will be displayed. Fill out the required fields as shown in Figure 26 and click on ‘Submit’.

 

Note:

All these fields will be covered in more depth later on.

Figure 26.

 

 

Click on the ‘Question Rules’ tab and populate the fields as shown in Figure 27.

 

Click on ‘Submit’.

 

You have now created a question.  A question defines a question is displayed and how an answer or array of answers is displayed to an end user.  As well a question defined how the answer to the question is stored in the database.

 

Figure 27.

 

 

Click on the ‘EmployeeLeaveDetails’ subform node again and select ‘Add Question’ in the context-sensitive menu that appears:

 

The second field on the paper-based Leave Form is the leave start date.

 

Select an ‘Answer Box Type’ of ‘Input Mask Box Calendar’.

 

The expanded question details will be displayed. Fill out the required fields as shown in Figure 28 and click on ‘Submit’.

 

You have now created a question with an input mask.  Input masks require input is submitted in a predefined format.

 

Note:

The input mask ‘Australian Date Format’ has been selected to force dates into the DD/MM/YYYY format.

Figure 28.

 

 

Click on the ‘EmployeeLeaveDetails’ subform node again and select ‘Add Question’ in the context-sensitive menu that appears:

 

The third field on the paper-based Leave Form is the leave end date.

 

Select an ‘Answer Box Type’ of ‘Input Mask Box Calendar’.

 

The expanded question details will be displayed. Fill out the required fields as shown in Figure 29 and click on ‘Submit’.

 

Note:

The input mask ‘Australian Date Format’ has been selected to force dates into the DD/MM/YYYY format.

Figure 29.

 

 

Click on the ‘EmployeeLeaveDetails’ subform node again and select ‘Add Question’ in the context-sensitive menu that appears:

 

The fourth field on the paper-based Leave Form is the total number of annual leave days taken.

 

Select an ‘Answer Box Type’ of ‘Text Box’ and click on the ‘Submit’ button.

 

After clicking on ‘Submit’, the expanded question details will be displayed. Fill out the required fields as shown in Figure 30 and click on ‘Submit’.

Figure 30.

 

 

Click on the ‘EmployeeLeaveDetails’ subform node again and select ‘Add Question’ in the context-sensitive menu that appears:

 

The last field on the paper-based Leave Form is the type of leave.

 

Select an ‘Answer Box Type’ of ‘List Box’.

 

The expanded question details will be displayed. Fill out the required fields as shown in Figure 31.

Figure 31.

 

 

Click on the ‘Question Rules’ tab and populate the fields as shown in Figure 32.

 

Click on ‘Submit’.

 

You have now created a question with a selection rule.  Selection rules allow you to define what options the user has when answering a question.

 

Figure 32.

 

At this point, the primary form has been defined and contains one subform which in turn contains five questions:

Figure 33.

 

Click on the ‘Leave Application’ folder node again and select ‘Add Form’ in the context-sensitive menu that appears:

 

A second form will provide the manager’s view of the leave application – the completed employee section and the manager’s authorization section.

Figure 34.

 

 

 

The ‘Form Details’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button.

 

Note:

The additional fields and the ‘Form Rules’ tab displayed in the ‘Form Details’ maintenance screen will be covered in more depth later on.

Figure 35.

 

 

Click on the newly created ‘ManagerForm’ form node in the tree control in the left-hand pane of the browser. Select ‘Add Sub Form’ in the context-sensitive menu that appears:

Figure 36.

 

 

The ‘Subform Details’ maintenance screen will appear in the right-hand pane of the browser. Populate the fields as shown in Figure 37.

Figure 37.

 

 

Click on the ‘Subform Rules’ tab and populate the fields as shown in Figure 38.

 

You have now created a subform which uses data from an Auxiliary Form by doing this two or more forms can point to the same information.

 

Click on ‘Submit’.

Figure 38.

 

 

Click on the ‘ManagerForm’ form node again and select ‘Add Sub Form’ in the context-sensitive menu that appears:

Figure 39.

 

 

The ‘Subform Details’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button.

 

Note:

The additional fields and the ‘Subform Rules’ and ‘Question Coordinates’ tabs displayed in the ‘Subform Details’ maintenance screen will be covered in more depth later on.

Figure 40.

 

 

Click on the newly created ‘ManagerResponse’ subform node in the tree control in the left-hand pane of the browser. Select ‘Add Question’ in the context-sensitive menu that appears:

Figure 41.

 

 

The ‘Question Details’ maintenance screen will appear in the right-hand pane of the browser. The manager authorisation section on the paper-based Leave Form is represented by a ‘Yes/No’ choice.

 

Select an ‘Answer Box Type’ of ‘Radio Buttons’.

 

The expanded question details will be displayed. Fill out the required fields as shown in Figure 42.

Figure 42.

 

 

Click on the ‘Question Rules’ tab and populate the fields as shown in Figure 43.

 

You have now created a question which displays one value but stores a different value.

 

Click on ‘Submit’.

Figure 43.

 

 

At this point, the manager form has been defined and contains two subforms. The first is a view-only version of the employee details section and the second contains the ‘Work Impact?’ question:

Figure 44.

 

Click on the ‘Leave Application’ folder node again and select ‘Add Form’ in the context-sensitive menu that appears:

 

A third form will provide the office manager’s view of the leave application – the completed employee section, the completed manager’s authorisation section and the office manager’s authorisation section.

Figure 45.

 

 

 

The ‘Form Details’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button.

 

Note:

The additional fields and the ‘Form Rules’ tab displayed in the ‘Form Details’ maintenance screen will be covered in more depth later on.

Figure 46.

 

 

Click on the newly created ‘OfficeManagerForm’ form node in the tree control in the left-hand pane of the browser. Select ‘Add Sub Form’ in the context-sensitive menu that appears:

Figure 47.

 

 

The ‘Subform Details’ maintenance screen will appear in the right-hand pane of the browser. Populate the fields as shown in Figure 48.

Figure 48.

 

 

Click on the ‘Subform Rules’ tab and populate the fields as shown in Figure 49.

 

Click on ‘Submit’.

Figure 49.

 

 

Click on the ‘OfficeManagerForm’ form node again and select ‘Add Sub Form’ in the context-sensitive menu that appears:

Figure 50.

 

 

The ‘Subform Details’ maintenance screen will appear in the right-hand pane of the browser. Populate the fields as shown in Figure 51.

Figure 51.

 

 

Click on the ‘Subform Rules’ tab and populate the fields as shown in Figure 52.

 

Click on ‘Submit’.

Figure 52.

 

 

Click on the ‘OfficeManagerForm’ form node again and select ‘Add Sub Form’ in the context-sensitive menu that appears:

Figure 53.

 

 

The ‘Subform Details’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button.

 

Note:

The additional fields and the ‘Subform Rules’ and ‘Question Coordinates’ tabs displayed in the ‘Subform Details’ maintenance screen will be covered in more depth later on.

Figure 54.

 

 

Click on the newly created ‘OfficeManagerResponse’ subform node in the tree control in the left-hand pane of the browser. Select ‘Add Question’ in the context-sensitive menu that appears:

Figure 55.

 

 

The ‘Question Details’ maintenance screen will appear in the right-hand pane of the browser. The office manager authorisation section on the paper-based Leave Form is represented by a ‘Yes/No’ choice.

 

Select an ‘Answer Box Type’ of ‘Radio Buttons’.

 

The expanded question details will be displayed. Fill out the required fields as shown in Figure 56.

Figure 56.

 

 

Click on the ‘Question Rules’ tab and populate the fields as shown in Figure 57.

 

Click on ‘Submit’.

Figure 57.

 

 

At this point, the office manager form has been defined and contains three subforms. The first is a view-only version of the employee details section, the second is a view-only version of the manager response section and the third contains the ‘Leave Approved?’ question:

Figure 58.

 

Step 5: Implement Forms – Summary:

 

At this point, three forms have been specified each representing a different view of the same data depending on the user type accessing the form.

 

Step 6: Implement Work Flow:

 

Select Admin Work Flo from the top menu bar:

Figure 59.

 

 

Kontinuum’s work flo maintenance section will be displayed.

 

Click on the ‘Workflows’ node in the tree control in the left-hand pane of the browser. Select ‘Add Folder’ in the context-sensitive menu that appears:

Figure 60.

 

 

The ‘Workflow Folder’ maintenance screen will appear in the right-hand pane of the browser. Populate the fields as shown in Figure 61 and click on the ‘Submit’ button.

Figure 61.

 

 

Click on the newly created ‘Leave Application’ folder node in the tree control in the left-hand pane of the browser. Select ‘Add Workflow’ in the context-sensitive menu that appears:

Figure 62.

 

 

The ‘Workflow’ maintenance screen will appear in the right-hand pane of the browser. Fill out the required fields and click on the ‘Submit’ button.

 

You have now created an empty workflow.  This is where you will uses the forms you have already created to make a workflow diagram.

 

Figure 63.

 

 

Expand the newly created ‘Leave Application’ workflow node in the tree control in the left-hand pane of the browser. Click on the ‘User Types’ node and select ‘Add User Type’ in the context-sensitive menu that appears:

Figure 64.

 

 

The ‘Workflow Access’ maintenance screen will appear in the right-hand pane of the browser. Populate the fields as shown in Figure 65 to grant the ‘Employee’ user type access to this workflow.

 

Click on the ‘Submit’ button.

 

Note:

‘Employee’ users will only be able to access their own data.

Figure 65.

 

 

Repeat this procedure to grant the ‘Manager’ user type access to this workflow.

 

Click on the ‘Submit’ button.

 

Note:

In this case, the ‘What can the User see’ field is set to ‘ALL’ to give the ‘Manager’ user type access to all data in this workflow.

Figure 66.

 

 

Repeat this procedure to grant the ‘Office Manager’ user type access to this workflow.

 

Click on the ‘Submit’ button.

 

Note:

In this case, the ‘What can the User see’ field is set to ‘ALL’ to give the ‘Office Manager’ user type access to all data in this workflow.

Figure 67.

 

 

At this point, the three required user types have been added to this workflow:

Figure 68.