building user interface with kofax totalagility
TRANSCRIPT
-
7/28/2019 Building User Interface With Kofax TotalAgility
1/80
Building User Interface with Kofax TotalAgility
Phong Chu
Principal Enablement Manager
-
7/28/2019 Building User Interface With Kofax TotalAgility
2/80
Forms Designer
The Forms Designer module is a
standalone module that is used to
create forms and build forms based on
business processes.
You can view existing forms, create a
form, open and modify an existingform, delete an existing form, create
forms navigation, define themes,
create site and so on.
You can also import and export forms,and view the list of recently created or
opened items.
2
-
7/28/2019 Building User Interface With Kofax TotalAgility
3/80
Sites
3
-
7/28/2019 Building User Interface With Kofax TotalAgility
4/80
What is a Site?
A site is a set of forms containing content such as text, images
that provide a business solution. The forms that are used in one
site can be reused in other site but the look and feel differs on the
theme associated with the site.
4
-
7/28/2019 Building User Interface With Kofax TotalAgility
5/80
Site and Forms Overview
HeaderHorizontal Navigation
VerticalNavigation
Theme
Language
Default form
Site 1
Logon
Createnewjob
TakeActivity
WorkspaceHeader
Link via Navigation
Workspace Forms
To Do J obs
Navigation Menus
CaseDetailsMenuJ obDetailsMenu
WorkspaceMenu
Process Forms
LogonCreatenewjob
TakeActivityWorkqueue
To Do J obsSite 2
Workqueue
Overview
5
-
7/28/2019 Building User Interface With Kofax TotalAgility
6/80
Configuring Site
In the Default Form box, configure the form that you want to set
as a default form.
Select the language to display the site in, from the Base
Language list.
6
-
7/28/2019 Building User Interface With Kofax TotalAgility
7/80
Format a Sites Components
Header form (standard form set as Header in Site settings)
Customize Logon form
Create or apply a theme
CSS or Windows Preset
7
-
7/28/2019 Building User Interface With Kofax TotalAgility
8/80
Themes
8
-
7/28/2019 Building User Interface With Kofax TotalAgility
9/80
What is a Theme?
A theme defines the visual layout with a consistent look and feel
across all the forms in a site. For example, Microsoft has a similar
look and feel across all of its products.
You can configure a theme with font style, font colorand page
color. Additionally, you can also create a theme by associating a
CSS (cascading style sheet) and choosing a style for your formcontrols such as button, check box, table, tab and so on.
Once a theme is associated with a site it is automatically
applied to all the forms within your site. However, if you want to
have a typical form irrespective of the theme, you can change thestyle of the controls by setting up their extended properties.
9
-
7/28/2019 Building User Interface With Kofax TotalAgility
10/80
Configuring Theme
You can use a style sheet for configuring form controls
10
-
7/28/2019 Building User Interface With Kofax TotalAgility
11/80
Forms
11
-
7/28/2019 Building User Interface With Kofax TotalAgility
12/80
Forms (Web pages)
Front end for end users
Site
Collection of forms and optionally processes
Out of box Site
TotalAgility Workspace
Create a blank Site and use forms from the TotalAgility
Workspace
Blank Site
Create a site and forms from scratch
12
-
7/28/2019 Building User Interface With Kofax TotalAgility
13/80
Out of Box Workspace Forms
13
-
7/28/2019 Building User Interface With Kofax TotalAgility
14/80
Generating Forms
Build Forms
Logon (Windows or Manual)
CreateNewJ ob
Work Queue
Take Activity
Create Blank Forms
Forms
Use Cells to position controls (textbox, calendar, buttons) on
the form
14
-
7/28/2019 Building User Interface With Kofax TotalAgility
15/80
Saving, Releasing and Reverting Forms
Forms have Versioning
You can Save (minor version) or Release (major version)
Forms are stored in the TotalAgility Database as XML and
rendered at runtime to .html pages
Like Processes, Forms can be reverted from older versions All sites use the latest Released version of the form
Only the latest Released version of a form is accessible via a
Browser.
15
-
7/28/2019 Building User Interface With Kofax TotalAgility
16/80
Customize Forms
Modify the auto generated forms
Add new controls
Textboxes, dropdown lists
Event Types
Redirect, DB Query, Web Service, .NET, Display Rule,Calculation Rule, Close, Begin/End Condition, SamePage etc.
Customize or Add Events (using Actions)
OnLoad, OnClick. OnChange, OnSelectRow etc.
16
-
7/28/2019 Building User Interface With Kofax TotalAgility
17/80
Import/Export
Exporting a Forms
.zip file
Small file size
Process and forms are exported separately
Export a specific form (.zip)
17
-
7/28/2019 Building User Interface With Kofax TotalAgility
18/80
Variables
18
-
7/28/2019 Building User Interface With Kofax TotalAgility
19/80
Global Variables
You can define frequently used variables as global variables.
These variables can be used across several forms.
For example, if you need to frequently interact with a
database, then you can create a global variable with
"DSN=MyDB;" as its value.
The same variable can be used in different forms to interact
with the database.
Whenever the value of the variable is changed, the change is
applied across all forms using the variable.
If you provide a value to a global variable, that value is used as
the default value.
You can change the default value at run time.
19
-
7/28/2019 Building User Interface With Kofax TotalAgility
20/80
Configuring Global Variables
To allow the variable to be included in the RESX file that is used for
translation, click the check box for Localizable.
Kofax TotalAgility provides the following default global variables:
20
-
7/28/2019 Building User Interface With Kofax TotalAgility
21/80
Form Variables
Form variables helps you to hold data at the form level and use it
wherever required within the form. This eliminates the need to
create hidden fields specifically on the form to hold data.
Once created, form variables can be used in the same way as
you would use fields and global variables.
21
-
7/28/2019 Building User Interface With Kofax TotalAgility
22/80
Configuring Form Variables
For a variable of type Array, specify the number of columns. This
variable can then be populated using a DB Query, .NET, or a
Web Service action.
22
-
7/28/2019 Building User Interface With Kofax TotalAgility
23/80
Creating Forms
23
-
7/28/2019 Building User Interface With Kofax TotalAgility
24/80
Automatically Generating Forms
The ability to automatically generate forms is the key to quick
and successful delivery of product screens.
In Kofax TotalAgility Form Designer, you can generate forms for
Kofax TotalAgility functionality without any programming
experience.
The standard forms that can be generated for Kofax TotalAgility
include Logon, Create New J ob, Take Activity, Multi-View, Multi-
View Activity, Work Queue and Entity.
-
7/28/2019 Building User Interface With Kofax TotalAgility
25/80
Logon Form
You can generate a Logon form automatically without the need to
create an external web page in Visual Studio and then redirect it
to your site.
25
-
7/28/2019 Building User Interface With Kofax TotalAgility
26/80
Building Logon Form
You can select to use either windows authentication or manual
logon.
26
-
7/28/2019 Building User Interface With Kofax TotalAgility
27/80
Work Queue Form
The work queue page displays the list of work queue tasks that
are assigned to you and total tasks of the group (team) in which
you are a member, for example, Product Development.
It helps you to focus on the tasks or projects that requires your
attention, especially when you are working on multiple areas at a
time.
27
-
7/28/2019 Building User Interface With Kofax TotalAgility
28/80
-
7/28/2019 Building User Interface With Kofax TotalAgility
29/80
Take Activity Form
Using the Take Activity form, you can generate forms for
manual user activ ities of a map. This form can be associated
with the activity and at run time, you can then take and complete
activities.
When a Take Activity form is generated for a process map that is
using variables as inputs or outputs to an activity, controls are
automatically generated for those variables; the controls depend
on the variable type. For example, for Boolean type of variable, a
check box is added. Input variables are displayed as read only, and output
variables are created as editable controls.
The Cancel, Complete and Save buttons are added by default.
29
-
7/28/2019 Building User Interface With Kofax TotalAgility
30/80
Building Take Activity Form
Configure the process map that you want to use to generate
forms for its ordinary manual activities.
To exclude an activity from the generated form, clear the check
box for that activity.
30
-
7/28/2019 Building User Interface With Kofax TotalAgility
31/80
Form Controls
31
-
7/28/2019 Building User Interface With Kofax TotalAgility
32/80
Controls
Users can enter information into a form
by typing into text boxes, selecting items
from a list, selecting check box options
and performing other actions. The
objects that users interact with are
called controls. Specific controls, such as buttons allow
you to execute an event to perform an
action. For example, by clicking a button
at the bottom of your form, the input
information can be saved to a database.
32
-
7/28/2019 Building User Interface With Kofax TotalAgility
33/80
Configuring Textbox Control
Field Type
Field length
Format
Error message
Value When Empty
State property
Mandatory
Optional
Hidden
33
-
7/28/2019 Building User Interface With Kofax TotalAgility
34/80
Configure Button Controls
Causes validation
Confirmation messages
Default button
34
-
7/28/2019 Building User Interface With Kofax TotalAgility
35/80
Image Control
You can enhance the look and feel of your forms by adding icons
and images to them.
You can add
Images to a form
Images to buttons placed on the form The following Image types are supported:
*.bmp
*.gif
*.ico
*.jpg
*.png
35
-
7/28/2019 Building User Interface With Kofax TotalAgility
36/80
Configuring Image Control
Note: The image needs to reside in images folder at C:\Program
Files\Kofax\TotalAgility\Agility.Server.Web\Forms\
36
-
7/28/2019 Building User Interface With Kofax TotalAgility
37/80
Table Control
Use a Table control to organize and arrange your form content
into rows and columns.
37
-
7/28/2019 Building User Interface With Kofax TotalAgility
38/80
Configuring Table Control
Configure Columns
38
-
7/28/2019 Building User Interface With Kofax TotalAgility
39/80
Hyperlink Control
A Hyperlink control can be used to link to a URL. For example, a
form displaying information about a list of products can include
hyperlinks to other web pages displaying more information on
those products.
Hyperlink controls can point to any web server on either intranet
or Internet.
39
-
7/28/2019 Building User Interface With Kofax TotalAgility
40/80
Configuring Hyperlink Control
Redirect Action: Configure the required redirect action that will
provide the redirect location and target for the hyperlink
40
-
7/28/2019 Building User Interface With Kofax TotalAgility
41/80
Embedded Page Control
Using the Embedded Page control, you can embed an external
web page or an existing site page in your form. At run time, when
the site is loaded, the embedded web page is automatically
opened enabling you to view multiple pages at the same time.
41
-
7/28/2019 Building User Interface With Kofax TotalAgility
42/80
Configuring Embedded Page Control
To embed an internal site form as a web page, click Form and configure
the required form. Map the initialization variable to the relevant formfield or variable (form or global).
To embed external web page (URL), enter the required URL, and map
a form field or variable (form or global) to the relevant initialization
variable.
To specify the web page to load dynamically at run time, map a form
field or variable (form or global) to the relevant initialization variable; the
URL is specified at run time when it is read from a field on a form or a
global variable.
42
-
7/28/2019 Building User Interface With Kofax TotalAgility
43/80
Process Viewer Control
View the progress of a job (a live instance of a process) by
providing a visual indication of what has been completed so far
and the path taken, and also what is remaining.
Key information is available on each activity, and each activity is
outlined in a specific color representing its current status.
With appropriate permissions a number of live properties can be
changed on this job.
43
-
7/28/2019 Building User Interface With Kofax TotalAgility
44/80
Configuring Process Viewer Control
View Id: Enter the ID of the job or process.
44
-
7/28/2019 Building User Interface With Kofax TotalAgility
45/80
Form Actions
45
-
7/28/2019 Building User Interface With Kofax TotalAgility
46/80
What is Action
Action describes the different ways an event
can be initiated. For example, a customer
credit score check could be based on two
different actions:
a DB query action that reads the
customers' details from a database and
a .NET Method action that calculates the
appropriate score.
You can configure multiple actions to be
executed on an event firing on a form or formcontrol, such as on form load, on button click,
on select row in a table.
-
7/28/2019 Building User Interface With Kofax TotalAgility
47/80
.NET Action
Enables interaction with software components developed for the
Microsoft .NET Framework
Calls an API for performing actions, such as creating a new job.
47
-
7/28/2019 Building User Interface With Kofax TotalAgility
48/80
Configuring .NET Action
Configure the required assembly in the Assembly box
On the Class list, select the required class
On the Method list, select the required method. A list of
associated parameters appears
Map form fields (controls) or variables to the parameters
48
-
7/28/2019 Building User Interface With Kofax TotalAgility
49/80
DB Query Action
You can add a DB query action for a form, and form control, such
as drop-down lists or text boxes, to add, display, update, or delete
database records.
You can use the DB Query action to add multiple records at a
time, search for records with similar values, and use stored
procedures.
Kofax TotalAgility is integrated with Data Access Service (DAS)
that allows you to easily connect and interact with a selected
relational database.
49
fi i i
-
7/28/2019 Building User Interface With Kofax TotalAgility
50/80
Configuring DB Query Action
No SQL coding required
50
R di A i
-
7/28/2019 Building User Interface With Kofax TotalAgility
51/80
Redirect Action
Redirect the user:
to another page
back to the original page
to a pop-up window
Redirect dynamically, that is, specify the URL to redirect to at runtime, using a form field or a variable
Can pass data from the original page to the destination page by
mapping the fields on the source page to the required fields on
the destination page.
51
C fi i R di t A ti
-
7/28/2019 Building User Interface With Kofax TotalAgility
52/80
Configuring Redirect Action
You can configure a unique action for each language separately
52
C diti A ti
-
7/28/2019 Building User Interface With Kofax TotalAgility
53/80
Condition Action
Using a Condition action, you can define conditions around an
event firing and run a series of events in response to a condition
being met.
Example: If the loan amount is greater then 1000:
Display a message to the user (Display Rule)
Run a DB Query to get interest rates for this loan amount and
display in a table in a panel (DB Query)
Show the cell on the form (Display Rule)
A condition action must include:
A Begin condition
A regular action, such as Redirect
An End condition
53
C fi i C diti
-
7/28/2019 Building User Interface With Kofax TotalAgility
54/80
Configuring Condition
Create Begin Condition
Create End Condition
Use Begin/End Condition in Event
54
S P A ti
-
7/28/2019 Building User Interface With Kofax TotalAgility
55/80
Same Page Action
Using the Same Page action, you can initialize value to a field or
give a default value at run time.
You can specify the source and target fields; the value from a
source field or variable is populated at the target field as default
value.
55
C fi i S P A ti
-
7/28/2019 Building User Interface With Kofax TotalAgility
56/80
Configuring Same Page Action
Configure the required target item (form field, form variable or
global variable) in the Target box.
Configure the required form fields, form variable or global
variables in the Source/Value box.
56
Displa Rules
-
7/28/2019 Building User Interface With Kofax TotalAgility
57/80
Display Rules
Hide/Show, Disable/Enable, Optional/Mandatory controls based
on a condition being met on the form
Define the rule at the form level (Defined as an Action Type)
Run the rule via an event
Can specify what happens if the condition is true/false Example
If the logged on user belongs to a particular group show a
panel on the form
If the user enters a value in a field enable the OK button
57
Display Rule Action
-
7/28/2019 Building User Interface With Kofax TotalAgility
58/80
Display Rule Action
A display rule consists of
a set of conditions that are defined for one or more fields
display states which are enforced when these conditions are
met or not met.
Dynamically control what is displayed on a form or how the
controls on the form behave. For example, you can hide one or
more fields on the form, make a field read-only or disabled and so
on.
At run time, the Display Rule is invoked once the user clicks the
configured control that has the action defined.
58
Configuring Display Rule
-
7/28/2019 Building User Interface With Kofax TotalAgility
59/80
Configuring Display Rule
Design Time
Create Display Rule
Call Display Rule
Run Time
59
Calculation Rules and Business Rules
-
7/28/2019 Building User Interface With Kofax TotalAgility
60/80
Calculation Rules and Business Rules
Addition, Subtraction, Multiplication, and Division
Text concatenation (joining strings)
Define the rule at the form level (Defined as an Action Type)
Run the rule via an event
Set the field type to Numeric, decimal etc if performingcalculations
May need to redirect to the same page if working with dropdown
lists (as their type is always String)
Can call a Business Rule from a form
60
Calculation Rule Action
-
7/28/2019 Building User Interface With Kofax TotalAgility
61/80
Calculation Rule Action
Using a Calculation Rule, you can dynamically control how the
content of a form field, form variable or global variable iscalculated and displayed on a form.
At run time, the calculation rule is invoked once the user clicks the
control where the action is defined.
61
Business Rule Action
-
7/28/2019 Building User Interface With Kofax TotalAgility
62/80
Business Rule Action
You can add a Business Rule action to a form or form controls,
such as button, text box, check box or drop-down list.
At run time, the Business Rule action is invoked once the user
clicks the configured control or when the form is loaded.
62
Configuring Business Rule Action
-
7/28/2019 Building User Interface With Kofax TotalAgility
63/80
Configuring Business Rule Action
Configure the required business rule in the Business Rule box.
Map the inputs and outputs of the rule with form fields or variables
63
-
7/28/2019 Building User Interface With Kofax TotalAgility
64/80
Navigation
64
Navigations (Menus)
-
7/28/2019 Building User Interface With Kofax TotalAgility
65/80
Navigations (Menus)
WorkspaceMenu CaseDetailsMenu JobDetailsMenu
65
Menus
-
7/28/2019 Building User Interface With Kofax TotalAgility
66/80
Menus
WorkspaceMenu
GeneralWorkqueue.form
Reassign.form
66
Navigation
-
7/28/2019 Building User Interface With Kofax TotalAgility
67/80
Navigation
You can add multilevel navigation capabilities to your site.
You can add vertical and/or horizontal navigation bars to your site
which are completely customizable.
The navigation menu is defined at the global level; once applied to a
site it is available to all the forms within that site.
67
Configuring Navigation
-
7/28/2019 Building User Interface With Kofax TotalAgility
68/80
Configuring Navigation
You can redirect a menu item either to an internal form or to an
external form.
68
Associating Menu with Site
-
7/28/2019 Building User Interface With Kofax TotalAgility
69/80
Associating Menu with Site
To use horizontal and/or vertical navigation in every form of the
Site, configure the required Horizontal Navigation and VerticalNavigation
69
Associating Menu with Form
-
7/28/2019 Building User Interface With Kofax TotalAgility
70/80
Associating Menu with Form
By default the navigation set for the site is selected.
To use a different horizontal and/or vertical navigation in a form,
configure the required Horizontal Navigation and Vertical
Navigation
70
Site Navigation and Security
-
7/28/2019 Building User Interface With Kofax TotalAgility
71/80
Site Navigation and Security
Restrict access to menus/menu items
Restrict access to form by setting Form Security
71
-
7/28/2019 Building User Interface With Kofax TotalAgility
72/80
Translation
72
Sample Custom form with languages support
-
7/28/2019 Building User Interface With Kofax TotalAgility
73/80
Sample Custom form with languages support
Russian
73
Managing Translation
-
7/28/2019 Building User Interface With Kofax TotalAgility
74/80
Managing Translation
Kofax TotalAgility adheres to the Internationalization (i18n) and
Localization (l10n) standards, which define the parameters foradapting computer software to different languages and regions.
74
Translating into Supported Languages
-
7/28/2019 Building User Interface With Kofax TotalAgility
75/80
Translating into Supported Languages
For every selected language, a column appears enabling you to
enter the translated text for the form element.
75
Exporting Languages
-
7/28/2019 Building User Interface With Kofax TotalAgility
76/80
Exporting Languages
The translation package is created as a compressed (.zip) file andcontains the selected forms and navigations stored in .resx files:
76
Importing Languages
-
7/28/2019 Building User Interface With Kofax TotalAgility
77/80
p g g g
You can import translation resource (.resx) files, that is, files after
translation into TotalAgility.
77
Language Selector Control
-
7/28/2019 Building User Interface With Kofax TotalAgility
78/80
g g
Use the Language Selector control to select the language the
form must be displayed in.
At run time, when the page with the Language Selector control
loads, the list is automatically populated with languages
supported by the site, allowing you to manually select the
language you want the page displayed in.
78
-
7/28/2019 Building User Interface With Kofax TotalAgility
79/80
Thank you
79
-
7/28/2019 Building User Interface With Kofax TotalAgility
80/80
For further information, please contact:
Phong Chu
Principal Enablement Manager
Phone: 949 783 1296
Email: [email protected]