Slice of ice Recap: Unlock Insights with Real-Time Dashboards

On Wednesday, September 10th, ComputerTalk presented our latest Slice of ice webinar on our new real-time dashboards.

During the webinar, one of our Training and Documentation Specialists, Diane Vasquez, presented the following topics:

• What are Dashboards? 
• Example Dashboards
• Creating Dashboards in iceManager
• Adding Components to your Dashboard
• Editing, Cloning, and Deleting a Dashboard
• Access and Permissions

Click here to view the recording or read on for a summary.

What are Dashboards?

Dashboards are visual tools that provide instant, actionable insights, allowing you and your team to improve decision-making and operational efficiency.

A dashboard is made up of individual components – such as gauges, graphs, or values – each showing specific statistics. They allow you to monitor key performance indicators (KPIs) in real time at a glance and can be customized to show the metrics most relevant to each role. 

For example, you could configure your dashboard to display the number of contacts waiting in your assigned queues, the wait time of your oldest contact in queue, or the total number of contacts that have been offered to you today. 

Dashboards can be assigned through configuration groups for easy access and role-based insights. 

Example Dashboards

Dashboards can be customized to meet your specific needs, but ComputerTalk offers a few out of the box as a starting point. They include:

• Agent Template – This template shows agents their number of active queued contacts, today’s grade of service (GOS), and the number of active queued contacts per queue.
• Supervisor Template 1 – This template shows supervisors statistics including longest in queue; users’ statuses; contacts offered, handled, and abandoned in the last seven days; and more.
• Supervisor Template 2 – This template shows supervisors total offered contacts, today’s average wait time, and today’s concurrent inbound calls.
• Team Lead Template – This template shows team leads various statistics for users in their team, including average call duration, number of contacts handled in the last two hours, average alerting duration, and more.
• Trunk Template – This template shows today’s concurrent inbound calls, IMs, and emails, and inbound, outbound, and rejected calls, IMs and emails.

Creating Dashboards in iceManager

You can create dashboards in iceManager. To do so, start by going to your iceManager settings. Then click Dashboard in the administration tab and press the Add button. Fill out the following fields for your dashboard in the form:

• Name
• Short name
• Description
• Height
• Width
• Include in Dashboard Rotation – If you opt to have the dashboard included in the rotation, the following field will appear and will need to be filled out as well.
  • Dashboard Rotation Interval (seconds)

Once these fields have been filled out, you can start adding the visual components. Each dashboard is based on a JSON configuration. You can use the Example Graph JSON Template tool and manually edit the code to get started.

To start with the Example Graph JSON Template, select a component type from the following in the dropdown menu:

• Gauge – shows a single value between a minimum and maximum value in a range
• Pie Graph – shows multiple data points as a proportion of a total
• Single Value – displays a single number or text value 
• Bar Graph – shows multiple values over two axes
• Line Graph – uses lines to connect individual data points

For each component, you can also choose between Real-Time or Historical data. 

Once you’ve selected a component type and type of data to display, you can copy the code from the template and paste it into the Graph JSON section between the square brackets.

Next, edit the JSON fields to define what statistic to show and the position, size, and style of the component. Different fields will appear depending on the component type. Some examples of different fields that can be configured are below.

Common Fields

• componentID – This will serve as a unique identifier for the component. 
• title – This is the label displayed at the top of the component.
• hoverText – This is the text that will display when you hover over the component.
• footerText – This is the text that is shown at the bottom of the component. This field is optional.
• type – This is the type of component (i.e. gauge, pie graph, single value, bar graph, or line graph).
• source – This is the statistic being measured. Source options can be found in the iceManager User Manual. There may be a single source or multiple sources, depending on the component type.
• statType – This is the category of the statistic. Options include Queue, Agent, and Team. This information can be found in the iceManager User Manual.
• statID – This is the component it represents and can be an array of one or more values. This could be a queue ID, a single agent, a team ID, a range of IDs, or a list of IDs. The special value %Assigned% depends on the stat type. For example, when the stat type is a queue, %Assigned% means the component will pull from the queues assigned to our user. 
• width and height – These are the size of the component on the dashboard canvas in pixels.
• origin – This sets the position of the component on the dashboard canvas, given as [x, y] coordinates. If you want the component to be displayed at the edge of the canvas, you can set the origin to be [0, 0].
• updateFrequency – This controls how often the component data refreshes, measured in milliseconds. The minimum refresh rate supported is 5000, which equals 5 seconds.

Fields for Gauges

• maxValue – This is the highest value the gauge can display. 
• minValue – This is the lowest value the gauge can display.
• fills – This section of code controls the gauge colors at certain percentage levels.
  • color – These are the colors displayed in the gauge. They can be modified as needed. The field supports rgb, hex, and named values.
  • stop – This value determines the percentage of the total value at which the gauge transitions to the next color.
• fillMode – This field has two options.
  • discrete – The gauge will display distinct color sections rather than blending them. 
  • continuous – The gauge will show a smooth gradient transition between multiple colors. 
• scaleLabel – This is the label for the scale. Setting it to false will mean that the scale will not display labels.

Fields for Single Values

• valueFontSize – This will be the font size for the single value shown.

Fields for Pie Graphs

• legend – This section of code controls how the pie graph’s legend will look.
  • label – These are the labels for your pie graph’s legend.
  • colour – These are the colors associated with each label.

Fields for Bar Graphs

• legend – This is the list of labels you want for your bar graph’s legend
• timeResolution – This is the unit of time that is displayed, such as “Day”
• timeOffsets – This determines the timeline for the data being shown. For example, [-7, -6, -5, -4, -3, -2, -1] would show the last 7 days of data.

Once the code has been added and edited to suit your needs, click Add in the bottom right corner.

Adding Components to Your Dashboard

To add a new component to a dashboard, click the edit button on the dashboard you want to add a component to.

In the Graph JSON section, add a comma next to the end of your existing code to tell the system that another component will be added.

Repeat the process of selecting a component type, copying and pasting the code into the Graph JSON section, and editing the fields as needed.

Editing, Cloning, and Deleting a Dashboard

To edit a dashboard, click the pencil icon in the Action column of the dashboard you want to edit. Click Save when you’ve made your desired changes.

To clone a dashboard, click the clone icon in the Action column of the dashboard you want to clone. When prompted, click Yes to confirm you want to clone the dashboard. Cloning a dashboard may be helpful for situations when you want to experiment with changes while preserving the original dashboard or you want to ensure a consistent format across multiple dashboards, for example.

To delete a dashboard, click the garbage can icon in the Action column of the dashboard you want to delete. When prompted, click Yes to confirm you want to delete the dashboard. Note that deleted dashboards cannot be recovered, and deleting a dashboard will remove it for all users in ice.

Access and Permissions

Viewing a dashboard requires users to have the correct permissions assigned through Configuration Groups. To change permissions:

• Click on the Settings page in iceManager.
• Click on Configuration Groups under the Administration tab. This page displays all existing groups and can only be managed by administrators. 
  • If the group that you want to be able to access the dashboard already exists or if you are using the Default Configuration Group, click on the pencil icon to edit its settings. 
  • If the group does not exist yet, click the Add button to create a new one. 
• Once inside the group’s settings, go to the Dashboards tab. 
• Here, you can select the dashboards that you want the group of users to view. 
• Click Save to apply the changes.

To stay up-to-date on future Slice of ice webinars and other news and events from ComputerTalk, subscribe to our newsletter!