WebChat Using Amazon Lex Connect
Last updated
Last updated
This guide provides you a quick information on how you can quickly create a web chat for your website by using a Skill on the VoiceWorx platform.
An active AWS Account
You should have an active AWS Account. If you do not have it, you can create an AWS account at https://portal.aws.amazon.com/billing/signup#/start
AWS Accounts Include 12 Months of Free Tier Access
IAM Credentials with access to AWS Lex
AWS credentials are required to create a connection with Lex. This is going to be used while creating a Lex bot from the VoiceWorx platform.
A configured Amazon Connect instance If you want to use agent chat and voice call in your webchat, you should have a configured and running Amazon connect instance.
If you are new to Amazon Connect, you can start by creating a Free Tier Amazon Web Services account.
Create a new instance of Amazon Connect and obtain a phone number using this official documentation from Amazon. Depending upon your location and the location of your target customers, you might need to perform some additional work here. Help from technical department might be required depending upon the scenario.
After creating the instance, Amazon Connect Home will look like this:
A VoiceWorx Account
For steps to create a VoiceWorx account, follow the steps at https://docs.voiceworx.ai/general/voiceworx-create-account
To proceed with these steps, you should have all the pre-requisites satisfied. If you are missing something, please go back and make sure you satisfy all of them.
Once done, you are ready to get started using VoiceWorx platform with Amazon Lambda.
Note:
This document is a quick checklist only and it’s assumed that you are familiar with the VoiceWorx platform.
To create a connection, navigate to the Integration > Connect system from left navigation and create a connection using Integration Category = Custom and system type = Amazon Connect
When Amazon connection is used with Amazon Lex for the WebChat, it is required to do some configuration in the Amazon account. This is taken care by the VoiceWorx platform, so you do not have to do this manually, however this requires certain permissions granted to the IAM user that you are using here in Amazon Connect configuration screen.
You can click on the required permissions link, and you will get the information on required policy document.
Once you have entered required information, click on “Validate and save settings” button to create an Amazon Connect connection. We will be using this in upcoming step.
To create a connection, navigate to the Integration > Connect system from left navigation and create a connection using Integration Category = Custom and system type = Amazon Lex. You will need this at later stage.
This step is required if you want to use Amazon Connect agent with the Web Chat. If agent support is not required, you may skip this step.
To configure this, from left menu, navigate to the administration > Connection Admin and click on Add new. If you already have any, you may edit it.
The add screen should look like as shown below. Provide the required information as shown in below screenshots
Click on Save & Configure button and VoiceWorx will configure the required resources for you. To be specific, it’s doing following configuration.
An IAM policy is created (if not present)
A IAM Role is created using the newly created policy.
A lambda function is created and assigned the newly created Role.
These configuration makes sure that while using VoiceWorx WebChat and Agent Chat is initiated, above lambda function is triggered and it can communicate with the Amazon Connect contact flow.
Note: if the Amazon Connect account does not have required permissions as recommended in this document, the VoiceWorx platform will not be able to create or configure these required resources so make sure the connection you are using has the required permissions.
Login to the VoiceWorx portal at https://portal.voiceworx.ai
To create a skill, browse to Custom Skills > Manage Skills and click on Create New Custom Skill button.
Follow this document to create a custom app in VoiceWorx.
On the publish tab of the app that you’ve created, create a new publish profile nd provide required information as shown below.
Select Channel = Amazon Lex | Lex V2
Note: Lex V2 supports response card and Lex V1 does not support response card in web chat.
You can configure Welcome Card as shown in above screenshot.
Similarly, You can also configure Help Card as shown in below screenshot.
Once you click on Publish, you will see another screen where you have to select the Amazon Lex connection – select the connection that you have already created in step#2 and click on Publish button.
Once skill is published on Amazon Lex, you can get the webchat widget code from the skill publishing page.
Click on the action button as shown above and you should get a Web Chat settings screen as shown in the below screenshot.
Copy the Webchat widget code to use in next step.
Paste the above widget code into any web page of your website where you want to enable to Web Chat and upload to your hosting server.
Congratulations! Now your website has Web Chat that uses Lex Bot and Amazon Connect Agent feature.
Once you have applied the widget on your website, when website is loaded, you should see following icon at the right bottom corner.
Click on it to start doing a chat.
When you open a webchat, By default, a Lex Bot is connected so for any of your messages, Lex Bot will be answering. You can access it from Direct Chat Link .
To initiate an agent chat, first you need to have a contact flow setup in your Amazon Connect account, where you can define where to direct the agent chat. You can find a sample contact flow creation in Amazon Connect here. You can type “Chat to an agent” and in background, VoiceWorx will establish connection with the Amazon Connect Agent using the lambda function that was created from the admin configuration.
The chat window might display progress as shown below.
(Note: The messages depend on Contact Flow configuration in your Amazon Connect account).
You can disconnect by clicking on disconnect button.
Once disconnected, you will be automatically connected with Lex Bot and Lex Bot will reply for any of your messages.
On the webchat settings screen, click on the Agent Settings tab. Check Enable Agent Chat and call using Amazon Connect. Also select the Amazon connect Instance in the drop down, as shown below:
To request for a voice Call with an agent, you can type, talk to an agent and once asked, provide your number and you should receive a callback on your phone.
You can refer to the below screenshot.
Congratulations!! You have configured and tested Agent Chat & Agent from VoiceWorx Webchat using your Amazon Connect instance and a Lex Bot account.