Bring Your Own Survey

1. Prerequisites

• Should have a valid Experience Management account
• Should have Postman app installed
• Should have a webserver set-up to test this reference solution

2. Workflow Diagram

3. Configuration Steps

3.1 Experience Management related configurations

1. Click on this link to launch Experience Management login screen

   
   

2. Sign into Experience Management. Once the dashboard loads, switch to CX Setup using the menu button on the top left of the screen. Select CX Setup.

   
   

3. Next step is to set-up a Questionnaire which should contain the customer facing questions(NPS, CSAT, User Comments etc.) and prefill questions to capture the metadata of the customer such as Name, Employee ID, Department, Call duration etc. You can refer to this video for step-by-step directions to create questionnaire.

4. After the questionnaire is set-up, we would move to create a multi-use survey token. A survey token is required to submit a survey response to Experience Management. In this reference example, for ease of implementation, the same survey token would be used to capture all survey responses. Hence, we would create a multi-use survey token using WXM APIs.

   We choose to create the survey token using the API (instead of creating it from Experience management product UI) as we look to add an additional security layer in the token settings. Passing the field “restrictBySignature” in the request body along with other fields, adds a signature for every response, thereby decreasing the risk of rogue responses. This secures the response submission process. The same signature (passphrase chosen by the brand) must be hashed using HmacSHA256 and then encoded and passed in the API request for response submission to happen successfully.

   This hashing mechanism is already implemented in BYOS reference solution and so in this step we will create a multi-use token using Postman app. The postman collection and documentation can be referred here.

   Primarily we would be using these two APIs mentioned below.

   • Login Token API
   • Survey Token API

3.2 Reference Solution

BYOS reference solution can be downloaded from this link

This is how the solution structure looks like:

3.3 BYOS UI

BYOS provides flexibility to the organization to use any custom UI to represents the customer facing questions. You can add as many questions as you require to display in the UI and can link it with the provided JS code in this reference solution to submit the responses.

Let’s look at the UI we are using in this reference solution.

If you take a quick look at index.html file, you can see these three questions are assigned with id as “text1”, “text2” and “text3” respectively. Screenshot is provided below for “text1”.

If you add more questions in the UI, please go ahead with the same naming convention and add them as “text4”, “text5” …. and so on.

Also, checkout the Ids where the responses entered by the user are captured. These Ids will also be used while configuring the reference solution.

3.4 Configure Reference Solution

Let’s take a look at how the code of the reference solution is submitting the survey responses and how can we configure for any custom UI which is added.

Once the UI is set-up, we will move on the configure and bind these UI elements to a questionId and questionText

In the downloaded solution, navigate to “js” folder and open main.js. Here first few lines are the configurations to be set-up.

Let’s look at the each one of these in detail.

• baseURL – This is Experience management live API Base URL. Should be used as is.

• SurveyToken – Pass the Survey token created using postman collection. Example: KN-12345

• securityPassphrase – Pass security passphrase used in survey token creation in Postman request

• responses are collection of JSON object where each object is required for the UI elements. In this solution, we have three UI elements for three customer facing questions. So, we will be configuring three such objects here. The details of each object are described below.

  1. id – UI element id as described in this section
  2. questionId – QuestionId should be passed for the question which should be linked with this UI element. In this example, it is an NPS question, so we are passing NPS question ID from Experience management questionnaire
  3. questionText – The text which should be displayed to customers for this UI element
  4. questionType – All the questions (customer facing or prefills) created in Experience Management Questionnaire are either Number type or Text type.
     • Number – NPS, CSAT, CES and all rating questions
     • Text – All questions except Number type questions
  5. valueid – pass the element id where the UI is capturing the customer entered response as described in this section

We are all set to configure the customer facing questions linked to UI elements. Now we look at how prefills can be passed dynamically for every response submission.

3.5 Passing Prefills Dynamically

Capturing contextual data (referred to as Prefills) of your customer is important. It helps identify your customer (in case you are looking to close the loop with the customer) and also provides for rich analytics in Experience Management Dashboard. To add any prefills in the BYOS reference solution, you should provide the QuestionId of the prefill question and set the dynamic value of that prefill. For example:

Here, prefill1 is the sample prefills added. Here questionId is taken from the Questionnaire and answer should be passed dynamically. If this solution is integrated in a website, then the customer name should already be known once the customer logs in and that should be set here along with questionId of the question “Name”. Similarly, you can capture more prefills for any such data which is available and helpful in gaining insights.

4. How to test

All configurations are done. Load these files behind any webserver and load the URL in any browser to test. Once the survey response is submitted using browser, it can be verified from Experience Management response section.

5. Browser Compatability