Creating Dashboards and Components Dashboard Forms provide the functionality for you to alter the web Today Pages for SupportDesk users, whether Service Desk Agents that are logging calls or WebGuests (Customers/End Users). This means that, upon logging in, each user could have a unique Today Page that has been associated with their login record. (This functionality is only available on the web).

Figure 1 Example of a Today Page (Supervisor login).

Benefits. SupportDesk is a very flexible tool that allows individual users to have their own view upon logging in to the Service Desk, and can be a good way of creating personalised dashboards for you Customers, including adding company logos, colours and text.

Requirements. To make use of this feature you must have the House Forms module and SupportDesk web application.

1

Form Creation. All work on Dashboard Forms must be carried out through the web UI. Prior to creating the physical form there should be some planning to decide how the Dashboard should look and function and who is going to see the Dashboard upon logging in. It is also a good idea to familiarise yourself with the privilege rights of Login types (from Supervisor to WebGuest), so that you can identify what users will be able to do and see. The Dashboard Designer is accessed by Supervisors via Settings > Dashboard Forms. If Dashboards have already been created, they will appear in a list and can be edited by clicking into the record. To create a new Dashboard, click New Form, and the drag and drop screen will appear:

Figure 2 List of existing Dashboard Forms.

Figure 3 The Drag and Drop Dashboard designer.

In order to begin building a new Dashboard, make selections from the right hand side of the screen, and drag the selection across to the table on the left. The right-hand list is split into 2 columns: Reports and Components. -

The Reports column shows all the public reports that exist in the QuickReport Designer. If a new report is required in this column, this must first be created in the QuicReport Designer, then will automatically appear in the list.

-

The Components column refers to buttons and widgets that have been created using html and saved as Component Forms. See pages 10 and 11 of this guide for details on creating Component forms. 2

Drag items from the right-hand columns. Enter the Dashboard name in the Name field, then begin to drag the Reports and Components across to the left hand table. A preview of the Dashboard will appear at the bottom of the screen as you drag selections across:

Drag Fields from the Field section into the grid and the Form design is displayed below.

Figure 4 Start to build your Dashboard.

Figure 5 Dashboard selection columns.

3

Click Save to save the form as you create. Click OK to save and exit the designer.

Figure 6 Dashboard Designer function buttons.

Additional Tabs The Details Tab of the Form allows entry of a Form Description:

Figure 7 Details tab.

The Styles Tab allows direct editing of the html Styles controlling the look of the Dashboard Form. After editing or adding new style information the user must select “Refresh” to see the working Dashboard. This is where the Dashboard can be edited to reflect any corporate styling that may be in place such as colours or font. The Rows and Columns fields enable for the resizing of the available area of the table in which to drag reports and components to:

Figure 8 Styles tab.

4

Activating Dashboard Forms. At Folder Level. Once Dashboard forms have been created there are different ways to make use of them. SupportDesk 2016 offers the functionality to set Default Dashboards on individual Folders. This means that, when a Folder is accessed by a service desk Agent, a completely unique Dashboard can be displayed i.e. an Incident Dashboard, and then when another Folder is accessed, i.e. Problem, this will then generate the default dashboard for that Folder. This is extremely useful for managers of multiple processes, or of multiple business areas, as it enables detailed, but separate dashboards for each process to be displayed by simply selecting from the Folder dropdown:

Figure 9 Individual Process Dashboards can be accessed from the Folder list.

In order to set a default Dashboard for each folder, Supervisors can access Settings > Folders and pick the required process (e.g. Incident Management). Then, in the Framework section of the Folder Details screen, select the Dashboard from the Default Dashboard dropdown:

Figure 10 Setting the default Dashboard on a Folder.

5

Examples of Process Dashboards: Incident Dashboard:

Problem Dashboard:

6

Change Dashboard:

Risk Dashboard:

7

CAFM Dashboard:

Activating Dashboards at Individual Login Level. Users can view their own unique Dashboard upon logging in. Supervisors can set this by going to Settings > Logins, and finding the required login. Here, on the Details tab, the Dashboard can be selected and set from the Dashboard dropdown:

Figure 10 Setting the default Dashboard on a Login.

At Privilege Level. SupportDesk 2016 automatically recognises which Dashboard to display to a user when they have logged in, based on their privilege level. This is done simply by naming the Dashboard with the same term as the privilege. For example, if there is a universal Dashboard to be used for all Analyst logins, the Dashboard form named Analyst will automatically display for all Analysts logging in (unless there is a Default Dashboard set against an individual’s Login). The Dashboard can be edited from the Drag and Drop Designer and will update the Dashboard for all Analysts.

8

Figure 11 Naming Dashboards based on privilege.

This functionality is also applicable for WebGuests:

Figure 12 Dashboards named WebGuest will appear automatically for Customers logging in via the Self Service Portal.

9

Creating Component Forms for use on Dashboards. Components can be created to be used on the Dashboard, and once created will appear in the right-hand column list on the Drag and Drop designer. These can generate specific call forms, QuickCalls, Views, Reports etc. Numerous Components are shipped as standard with SupportDesk, such as specific buttons. It is possible to edit these using html, or new Components can be created from scratch. Supervisors can create new Components by accessing Settings > Forms & Dashboards, and selecting Component from the Form Type dropdown:

Figure 13 Select Component from the Form Type dropdown

Then click the green New Form button. Enter a name for the component, and the enter the html in the large field on the Form tab:

Figure 14 Adding a New Component Form

10

The code shown below is one example of a single button that has been built to summon a QuickCall named “Quick Call 1” when clicked. Wording has been left generic in this example: New Thing+ body .right-panel .view-button.blue{ background: lightblue; border:0 solid #aaa; border-radius: 5px; box-shadow:inset 0px 0px white; float: left; text-align: center; text-decoration: none; line-height: 40px; padding: 10px; font-size: 16px; color:#3a3a3a; -webkit-transition: 0.2s ease-out; -moz-transition: 0.2s ease-out; -o-transition: 0.2s ease-out; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ opacity: 1; height:100px; width:100%; } .view-button:hover span{ opacity: 0.8; } .view-button.green span{ width: 100%; float: left; font-size: 50px; font-weight: bold; color:white; }

11

Pasting this code into the large field on the Form tab will result in the following button to appear in the preview pane when Refresh or Save are selected:

Figure 16 Entering html to build the Component.

Save the button design, then on the Details tab, ensure that the Component (Make this form available for use in the Form Designer) tick box is selected and saved. This will ensure that the button appears in the Component column on the drag and drop dashboard designer:

Figure 16 Select tick box to make Component available in the Drag and Drop designer.

An overview video on creating creating Dashboards with the Drag and Drop designer can be viewed here: http://houseonthehill.com/wp-content/themes/hoth/videos/Dashboard%20Designer.swf

12