Nowadays every one of us is very familiar with ordering products via the web. But have you ever wondered why it is that difficult to get proper customer service when there are issues with your order or simply want to provide feedback?
Gathering experience data (X-Data), however, and combining it with the company’s operational data (O-Data) is a crucial factor in today’s competitive environment. To support customers in their approach to X+O, my team has been dealing with exactly that order process challenge lately and an innovative solution has been developed which combines the two worlds of user-friendliness and practicability.
In our Proof-of-Concept (PoC) scenario, we include a QR code attached to a card enclosed in a delivery. It represents the central touchpoint for every concern the customer may have with the product or the order. The customer detects a product malfunction and uses it to access the SAPUI5 application which gives a short overview of the respective order and provides the opportunity to enter the support chatbot component of the application, which was implemented with SAP Conversational AI. In the course of the conversation, the chatbot directly offers solutions to the issue and the possibility to provide feedback with its integrated Qualtrics surveys. The end-to-end process of the scenario is visualized in the image below.
Source: Own Image
How did we implement and integrate all those different components? Great that you ask because this blog post has got you covered!
Qualtrics
Firstly, let’s have a look at the implementation in Qualtrics. As already mentioned, we set up two different surveys that will be integrated into the SAP Conversational AI chatbot. The first one gets triggered immediately when the chatbot section of the SAPUI5 application is entered. It contains questions related to the NPS score (1-10), the reason for the rating (product damaged, product malfunction, high price, wrong delivery, long delivery time etc.) and further details (free text area). In the context of our PoC we set the account id, contact id, and product id, which we use as information input to the SAP Service Cloud ticket creation, statically embedded in the Qualtrics survey flow. In a productive environment, this data would be fetched dynamically.
Source: Qualtrics
Furthermore, we implemented a webhook inside of the survey flow which calls an endpoint of our Node.js middleware to trigger the creation of the service ticket as soon as a certain point along our survey flow is reached. In our case, this happens directly after filling in the reason field. To do this, we send a POST request and we add the previously defined embedded data fields as body parameters (see image below).
Source: Qualtrics
The second survey comes into play at the end of the first one if a solution was successfully delivered via the chatbot. Its objective is to gather feedback data for the customer service chatbot. Therefore, it contains only the following question:
I am happy to hear that! On a scale from 1 to 10, how would you rate my service today?
(Multiple choice with the fields 1-10)
Unlike the first survey, the second one doesn’t have any webhooks or embedded data integrated. However, its answers can still be reviewed and analyzed in the Data & Analytics section of Qualtrics.
Furthermore, we need to make sure that every survey question resides in a separate question block. Thus, only one question at a time is sent over the REST API of Qualtrics. The last thing we need to do in Qualtrics is to save the token and ID which we need for the API authentication and the identification of the correct survey. You can find them under Account Settings -> Qualtrics IDs. The ID for the survey starts with the pattern “SV_” and can be found on the left-hand side. The API token for authentication can be found in the middle of the screen under the section API.
SAP Conversational AI
In SAP Conversational AI, SAP’s SaaS solution for the creation of chatbots, we have to set up the main conversation flow and the needed chatbot actions. The very first thing we need to do is to insert the base URL of our Node.js middleware into the field of the Bot Builder URL (see image below). By doing this, we only need to use the specific endpoints into the webhooks of our actions instead of the complete URL.
Source: SAP Conversational AI
Our first chatbot skill delivery_feedback_survey_session will be triggered when the trigger-survey intent is-present (see image below).
Source: SAP Conversational AI
The intent can contain any expression we define as long as we send that very same expression by the frontend when the chatbot is supposed to start (see also chapter SAPUI5 App). In the action section of our skill, we are doing just three things (see image below).
-
- We send a POST request to our Node.js middleware which will start the Qualtrics session,
-
- we set the memory field delivery_feedback_entry_triggerto true (will be important later on) and
-
- we redirect to our second skill delivery_feedback_survey_entrywith the option to wait for user input.
Source: SAP Conversational AI
The actions section of the next skill is almost as simple as the first one. We have an If-statement, in the beginning, to check if the before mentioned memory field has the value true (see image below).
Source: SAP Conversational AI
If it does, we create another memory field that contains the last answer which was submitted by the user (see image below).
Source: SAP Conversational AI
Afterward, we send another POST request to our middleware, but this time to another endpoint. The triggered function will then send the answer to Qualtrics. Next, we use a little trick: We redirect to the very same skill to create a loop with the option to wait for user input. We keep running through the loop until our middleware identifies the last question of the Qualtrics survey and sets the memory field delivery_feedback_entry_trigger to false. This will break the loop and the SAP Conversational AI skill will redirect to the next skill.
Node.js Middleware
To handle the communication between the different software components and to add custom logic, we implemented a Node.js middleware that runs in a Cloud Foundry environment on our SAP Cloud Platform. The application performs the following tasks:
-
- It starts the Qualtrics survey session,
-
- it translates the SAP Conversational AI message model to the Qualtrics model and vice versa(for the models see the documentation from SAP Conversational AI and Qualtrics),
-
- it detects when the end of the survey is reached and sets the conversation memory field to false, which breaks the chatbot loop and thus ends the conversation and
-
- it creates a service ticket in the SAP Service Cloud when specific answers are given by the user.
SAPUI5 Application
Now let’s have a look at the SAPUI5 application, which will serve as the frontend in our scenario, to see the final result of our scenario. On the first screen of the application, a basic overview of the specific sales order will be shown (see image below).
Source: Own Image
The sales order data is directly fetched from our SAP S/4HANA Cloud system, while the images will be retrieved from SAP Commerce Cloud, where our product images are stored.
If the “Rate us!” button is pressed the user gets directed to the chatbot part of the application and the expression, which was previously defined as the trigger-survey intent, is sent to SAP Conversational AI to start a new conversation. We then receive the first Qualtrics NPS question, which is displayed in the chat window. The complex communication between our different components is further described in detail in the followings section.
We implemented the chat application look and feel using the SAPUI5 List component with custom list items, which is populated using a JSON model that contains all the messages.
Application Sequence
Since the communication between the different components of the application during the chatbot processes is rather complex, a sequence diagram visualizing it is provided in the image below. It starts with the initial trigger which we have previously defined as an intent in SAP Conversational AI. Thus, a new chatbot conversation is started.
Source: Own Image
Technical Architecture
In order to understand the big picture, let’s now have a look at the architecture of our scenario. It is displayed in the image below. Eye-catching is that we entirely use SAP technology including many cloud applications. Also, it can be seen that the SAPUI5 app fetches the data from SAP S/4HANA Cloud and SAP Commerce Cloud directly, while the Node.js middleware handles the communication between SAP Conversational AI, Qualtrics and SAP Service Cloud.
Source: Own Image
Key Takeaways
We can implement solutions by combining several standalone applications from SAP, to tremendously increase the customer experience during sales orders. This can be achieved by providing users with a direct touchpoint for feedback and guidance along with deliveries. For me personally, this solution is exactly what I need if I have difficulties with an order. Also, by taking advantage of SaaS applications, the implementation effort is kept at a low level.
Especially important is that through the integration of Qualtrics and SAP Conversational AI, we have access to many possible use cases, thanks to the strength of these tools.
About Me
Hey guys, thanks for reading this far into my very first blog post! My name is Robert, and I am a developer in the team Cloud Innovation Practice. We are developing PoC applications for international customers in a fast design thinking approach. My focus capabilities lie in cloud development and machine learning.