Crisp
What is Crisp?
Crisp is a simple and affordable customer center tool.
It can allow you to add a human touch to your chatbots.
Crisp has some really interesting features such as routing rules, advanced stats on agents and mobile apps to let them answer user requests on the go.
You can check their website for more details on their product.
Our integration with Crisp
With Smartly.AI expertise in Conversational AI and Crisp expertise in human handover, you get the best of breed solution.
Basicaly, your chatbots will always be in front of the user, automating what they can. That means that for instance, all discussions will continue to happen on Smartly.AI's webchat, facebook page,...
When necessary, your bot will be able to pass the relay to a human agent within the same channel.
If no agent is available during the escalation, the chatbot will detect it and ask the user to come back later with a customizable message.
Below is a vizualisation of the different flows happeining with Smartly.ai <> Crisp integration.
What are the supported channels ?
Our Crisp connector allows you to escalate on conversations occuring on the following channels
- Webchat
- Facebook Messenger
Step by step tutorial
Here is the different steps to follow to add Crisp handover to your chatbot:
1) Sign up to Crisp
To do so, simply follow this link and fill the form
2) Set up your Smartly.ai <> Crisp integration
From the Builder module, click on Integrations > Crisp
Now, let's see how we will find / use the information available in this integration ! 🙂
Token Identifier / Token key
To get your token, you will have to call the Crisp API using this cURL:
curl -H "Content-Type: application/json" -X POST -d '{"email":"YOUR_ACCOUNT_EMAIL","password":"YOUR_ACCOUNT_PASSWORD"}' https://api.crisp.chat/v1/user/session/login
YOUR_ACCOUNT_EMAIL
andYOUR_ACCOUNT_PASSWORD
must be replaced by your actual Crisp email and password.
Website ID
As for the Website, it's not complex either, you can find it by browsing the following UI path in your Crisp console: Settings > Website Settings > Setup instructions
Then simply copy/paste it in the dedicated field in your Smartly.ai console.
Sources
This field is aimed to let you choose on wich fields you want the escalation to happen.
Currently, Crisp livechat is only available on Smartly.ai's webchat
It will soon be also available in Messenger & Twitter too.
Message if no agent is available
This message will be sent in the situation where a user is asking for handover but no agent is available.
The default message will be shown if no agent is available.
You can also define a more advanced message using our rich messages json syntax.
Here is an example you can use in this field
[
{
"quick_replies": [
{
"payload": "Contact me back via email",
"title": "Contact me back via email",
"content_type": "text"
},
{
"payload": "Continue with the bot",
"title": "Continue with the bot",
"content_type": "text"
}
],
"text": "It seems that nobody is available right now "
}
]
putting the json above here...
will lead to this:
Webhook URL
In order for Crisp to send agent messages as well as conversation resolution status, you will need to create a webhook.
To do so go to Settings > Website Settings > Advanced configuration
and click on Add a Web Hook
You will then have the following form to complete
Here is the information will need at this point:
- Name for hook: give a name related to your webchat / chatbot so you can remember it easily later
- Url To Be Called: this url can be found in the Crisp integration in Smartly.AI, simply copy and paste it
- Filter Events: here is the events you will need to properly set your integration:
=>message:send
=>message:updated
=>message:received
=>session:set_state
With this, click Add Hook Target and your webhook is created .
That's it, you can now hit save, your Crisp integration is up and running! 💯
Define when the handover should happen
The best solution is to have an intent attached to a Bot Shows
object.
From there, add a message like "Ok, I will check if an agent is available right now"
Click on Show more options
and Escalation and bot muting
this means that from there, an escalation request will be done to Crisp.
Another option is to do it programmatically using a Bot does..
object and the following code
output.muted = true;
output.need_help = true;
Addtionally you can define a user segment using the following code
output.muted = true;
output.need_help = true;
output.handover_category_name = "Customer";
What happens during the escalation
From the user perspective, if an agent is available on Crisp, the escalation request will be accepted and the user will wait for your agent to answer.
Meanwhile on Crisp, a conversation will be created, with an audio notification or even a browser notification if you have accepted them. From there your agents will be able to answer directly.
Note: from the agent perspective, each new conversation start with the following message.
Hi, this user need your help.
You can find the conversation history here: [Link to the conversation with the bot]
By clicking on the link, your agents will then be able to answer directly to the user.
Here is a sample link, and the result will be the following
Once your agent is handling the user, each agent messages is pushed directly to the user webchat.
To make sure that the user will read he incoming agent messages, a short audio sound is played at each new message reception.
Once the conversation is over, the agent can set the conversation to Resolved
by clicking on the big red button.
This button will become green.
This action will also allow the user to talk to the bot again after the escalation.
Sending user information to Crisp
As part of the escalation the following information will be sent:
- available data in the
user_data
field - a link to a page with the whole conversation history
- the customer segment if defined with
output.handover_category_name
Also we are doing the mapping for you, that means that if the user is logged and we know its name it will be shown in Crisp, along with the phone and email.
A good reason to send the user email to crisp is that you can the continue the conversation via email on Crisp, even if the user has left your website!
For instance, here is what you will see in the Crisp console if you set the following user_data
field in your website
var SMARTLY_USER_DATA = {
"first_name":"Anakin",
"last_name":"Skywalker",
"email":"[email protected]",
"phone_number":"0605776995",
"gtu_accepted":"false",
"comments":"in this guy, the force is strong"
};
You can have all those features with Crisp's free plan, so what are you waiting for to set your Crisp integration? 🙂🚀
Updated 10 months ago