GETTING STARTED
Kore.ai XO Platform
Virtual Assistants Overview
Natural Language Processing (NLP)
Concepts and Terminology
Help & Learning Resources
Quick Start Guide
Accessing the Platform
Navigating the Kore.ai XO Platform
Building a Virtual Assistant
Using Workspaces
Release Notes
Current Version
Previous Versions
Deprecations
Request a Feature
CONCEPTS
Design
Storyboard
Overview
FAQs
Conversation Designer
Overview
Dialog Tasks
Mock Scenes
Dialog Tasks
Overview
Navigate Dialog Tasks
Build Dialog Tasks
Nodes & Connections
Overview
Node Types
Intent Node
Dialog Node
Entity Node
Entity Rules
Form Node
Confirmation Node
Message Nodes
Logic Node
Bot Action Node
Service Node
Webhook Node
Script Node
Process Node
Agent Transfer
Node Connections Setup
Context Object
Sub-Intent Scoping
User Prompts
Voice Call Properties
Dialog Task Management
Event Handlers
Supported Entity Types
Supported Company Names
Supported Colors
Knowledge Graph
Introduction
Knowledge Extraction
Build Knowledge Graph
Create Node Structure
Build the Graph
Add FAQs
Add FAQs from an Existing Source
Run a Task
Traits, Synonyms, and Stop Words
Manage Variable Namespaces
Update Knowledge Graph
Introduction
Move Question and Answers Between Nodes
Edit and Delete Terms
Edit Questions and Responses
Knowledge Graph Analysis
Knowledge Graph Import and Export
Prepare Data for Import
From a CSV File
From a JSON File
Importing Knowledge Graph
Exporting Knowledge Graph
Auto-Generate Knowledge Graph
Alert Tasks
Small Talk
Digital Skills
Overview
Digital Forms
Digital Views
Introduction
Widgets
Panels
Train
NLP Optimization
ML Engine
Overview
Model Validation
FM Engine
KG Engine
Traits Engine
Ranking and Resolver
Training Validations
NLP Configurations
NLP Guidelines
Intelligence
Introduction
Default Standard Responses
Contextual Memory
Contextual Intents
Interruption Management
Multi-intent Detection
Amending Entities
Default Conversations
Conversation Driven Dialog Builder
Sentinment Management
Tone Analysis
Test & Debug
Overview
Talk to Bot
Utterance Testing
Batch Testing
Conversation Testing
Health and Monitoring
Deploy
Channels
Publishing
Versioning
Analyze
Introduction
Overview Dashboard
Conversations Dashboard
Users Dashboard
Performance Dashboard
Custom Dashboards
Introduction
Custom Meta Tags
Create Custom Dashboard
NLP Insights
Conversations History
Conversation Flows
Analytics Dashboard Filters
Usage Metrics
Containment Metrics
Smart Bots
Universal Bots
Introduction
Universal Bot Definition
Universal Bot Creation
Training a Universal Bot
Universal Bot Customizations
Enabling Languages
Store
Manage Assistant
Plan & Usage
Overview
Usage Plans
Support Plans
Invoices
Authorization
Multilingual Virtual Assistants
Get Started
Supported Components & Features
Manage Languages
Manage Translation Services
Multiingual Virtual Assistant Behavior
Masking PII Details
Variables
Collections
IVR Settings
General Settings
Assistant Management
Manage Namespace
Data as Service
Data Table
Table Views
App Definitions
Sharing Data Tables or Views
HOW TOs
Build a Travel Planning Assistant
Travel Assistant Overview
Create a Travel Virtual Assistant
Design Conversation Skills
Create an ‘Update Booking’ Task
Create a Change Flight Task
Build a Knowledge Graph
Schedule a Smart Alert
Design Digital Skills
Configure Digital Forms
Configure Digital Views
Train the Assistant
Use Traits
Use Patterns
Manage Context Switching
Deploy the Assistant
Configure Agent Transfer
Use Bot Functions
Use Content Variables
Use Global Variables
Use Web SDK
Build a Banking Assistant
Design Conversation Skills
Create a Sample Banking Assistant
Create a Transfer Funds Task
Create a Update Balance Task
Create a Knowledge Graph
Set Up a Smart Alert
Design Digital Skills
Configure Digital Forms
Configure Digital Views
Add Data to Data Tables
Update Data in Data Tables
Add Data from Digital Forms
Train the Assistant
Composite Entities
Use Traits
Use Patterns for Intents & Entities
Manage Context Switching
Deploy the Assistant
Configure an Agent Transfer
Use Assistant Functions
Use Content Variables
Use Global Variables
Intent Scoping using Group Node
Analyze the Assistant
Create a Custom Dashboard
Use Custom Meta Tags in Filters
APIs & SDKs
API Reference
API Introduction
API List
API Collection
koreUtil Libraries
SDK Reference
SDK Introduction
SDK Security
SDK Registration
Web Socket Connect and RTM
Using the BotKit SDK
BotKit SDK Tutorial - Blue Prism
Widget SDK Tutorial
Web SDK Tutorial
ADMINISTRATION
Introduction to Admin Console
Administration Dashboard
User Management
Add Users
Manage Groups
Manage Roles
Assistant Management
Enrollment
Invite Users
Send Bulk Invites
Import User Data
Synchronize Users from AD
Security & Control
Using Single-Sign On
Security Settings
Cloud Connector
Analytics
Billing
  1. Home
  2. Docs
  3. Virtual Assistants
  4. Builder
  5. Digital Views

Digital Views

Interactions with Virtual Assistants are typically conducted using chat/messaging tools, voice channels, or other types of assistants. In the majority of the cases, the Virtual Assistants respond to the user queries only when the users have requested some information. This works well for conducting on-demand tasks that need user input for execution and the result is usually a short response, confirmation, or acknowledgment. But the need for more proactive user updates and less user input through an engaging interface has become a key requirement. 

Using Digital Views from the Kore.ai XO Platform, you can design and launch rich visual experiences through interactive components, panels, and widgets, to proactively present relevant information to your users or customers. Panels are the placeholders that hold one or more widgets. Widgets are individual components that display information to the end-users. Your users or customers can interact with your VA either in conversation mode or directly get the required information from the widgets.

This article provides an overview of the working and implementation of Panels & Widgets. For step-by-step usage instructions, refer to this article.

How It Works 

  1. Using Digital Views, an organization offers to its VA end-users a single interface for various activities.
  2. Multiple panels constitute a Digital View.
  3. Each of the panels gives access to various functions.
  4. The end-user accesses these panels for information pertaining to each of the functions and performs follow-up actions.
  5. As an example, a Panel within a travel VA  could have multiple widgets showing:
    1. Upcoming Trips,
    2. Completed Bookings,
    3. Canceled Bookings. 

You can access Digital Views by selecting the VA you want to work with then going to Build > Digital Skills > Digital Views

How to use Digital Views?

You can enable Digital Views for your Virtual Assistant by designing the required widgets, adding them to the relevant panels and publishing them on the WidgetSDK channel.

Here are the steps we recommend for efficient design of Digital Views: 

  1. Set up: Panels are containers to host one or more widgets. You may create multiple panels and each panel can host widgets that present relevant information. Widgets are the interactive components that can contain information to be presented to the end-users and allow them to perform actions and follow-ups.
  2. Configure: Define widgets by connecting them either to your tasks or by directly defining the widget. If you have connected your widget to a Dialog Task, make sure to use a Message node to present the required information in the widget using any of the supported widget templates.
  3. Preview & Publish: Preview your widgets from the XO Platform to review the visual representation of the information. Enable the WidgetSDK channel and publish your panels and widgets to make them available for your end-users.
  4. Host with Kore.ai SDK / Host Independently: You can choose to host your widgets independently or co-host them along with the WebSDK. You can download the SDKs from the Kore.ai GitHub page.

General Setup

Here is the general setup process to follow when you want to configure Panels and Widgets for Digital Views: 

  1. Configure Widgets: Define widgets by connecting them either to your tasks or any other source like JavaScript generating JSON file. In cases where you are using a task as a source, ensure that the message is formatted properly for the Widget SDK channel.
  2. Preview the Widgets: Preview your widgets from the XO Platform.
  3. Set up Panels: You may create multiple panels and each panel can host widgets that present relevant information. You can use the predefined widgets or create new ones.
  4. Test the Panels to see how the Panels and Widgets are rendered in the chat window.
  5. Publish the VA: Publish the VAso that the panels and widgets are made available for your end-users.
  6. Host the Panel: You can choose to host your widgets independently or co-host them along with the web SDK. You can download the SDKs from the Kore.ai GitHub page. Do ensure to enable WidgetSDK as a channel.

Configure Widgets

Widgets are individual components that can communicate with the VA for presenting information to the end-users. The source of information for widgets is from a Dialog Task or a JSON using any of the predefined widget templates.

To configure widgets, follow the below steps:

  1. Click Create Widget to create a widget.

  2. The New Widget dialog opens.

  3. On the New Widget window, enter the following details:
    1. Name of the widget
    2. Display Name for the widget
    3. Auto Refresh to set the frequency with which this widget needs a poll for fresh data. The refresh is applicable only when the panel containing the widget is active.
    4. Source for a widget can be set either from the execution of Dialog Task, from JavaScript by defining a JSON, or by linking an existing Digital Form.
  4. Save the Widget when ready.

Configure Widget Sources

Dialog Task

The Dialog Task option allows you to trigger a task and present the output in the widget.

The Select Dialog Task drop-down will list all available tasks in the current VA. Select the task you want to trigger using this widget.
Note: In the connected Dialog Task make sure to use a Message node to present the required information in the widget using any of the supported widget templates.

You can use the icon next to the Dialog Task to open the Dialog Task for checking the task details like entity names etc.

Any entities used by the selected Dialog Task need to be pre-populated with values by mapping Entity Name with Entity Values.

If the selected Dialog Task has any Authorization Profile defined, it is displayed here.

JSON

When selecting JSON as a source, you will be presented with a Javascript editor, where you can add your code.

Digital Form

When selecting Digital Form as a widget source, you will have the option to select the Digital Form, as well as the Dialog Task to trigger upon submission. 

Note that a Digital Form can be used to define multiple Widgets and can also be added to multiple Panels. However, it will be associated with the same Dialog Task across all Widgets and Panels.

Edit, Run & Preview a Widget

After you save, the widget will be In Development state. You can Edit or Delete the widget.

When you Edit widget, apart from being able to modify any of the above fields, you will have the option to Run & Preview the widget. You can save the preview as the thumbnail display for the widget.

Configure Panels

Create a Panel

Panel refers to containers that hold one or more widgets. You can add an existing widget to the panel or create new widgets within it.

  1. Click Create Panel to create a panel.
  2. On the New Panel window, enter the following details:
    1. Name of the Panel.
    2. Display Name for the Panel.
    3. Panel Icon to display in the chat window (URL to the location).
    4. Save the Panel.

  3. After you save, the panel will be In Development and will be displayed on your Digital Views screen. 

Add Widgets

  1. Click Add Widget to add widgets to the panel.

  2. Select widgets from the drop-down list and click Add..You can add multiple widgets to the same panel.

Panel Options

You have the following options for a given panel:

  1. Edit the panel details;
  2. Add Form to add existing forms to the Panel. Once added, forms will behave as a widget with the sourse set to Digital Form;
  3. Add Widget to add existing widgets;
  4. Panel Management to add existing forms/widgets, or remove already added forms/widgets from the panel.
  5. Test the individual panel – this opens the Talk to Bot window along with the panel listing with the current panel active and data presented. You can interact with the VA and test the panel.
  6. Delete the Panel.

Publish

When you publish your Virtual Assistant,  please ensure that the panels and widgets you want to include are selected.

Refer here for details on Publishing a Virtual Assistant.

Host

The Kore.ai XO Platform provides the Widget SDK, which you can use for hosting and managing panels and widgets. You can choose to host your widgets independently or co-host them along with the WebSDK. You can download the SDKs from the Kore.ai GitHub page. Do ensure to enable WidgetSDK as a channel. Refer to this tutorial on how to do so.

Menu