(Autogenerated transcript)
[00:00:00]
Okay, so now let's take a look at the suggestion response type, suggestion chip response type rather and this is a good response type in my opinion and it's something that you can use to have buttons in your Dialogflow agent in your website chatbot widget. So what I'm going to do is add show suggestion chip type, show me suggestion chips and we'll go to the response section, add a custom payload and just copy the whole thing and paste it over here and save it. Now I want you to see the different options that you have in this suggestion chip over here. Now notice that it actually has of course the type is chips and then you have this options
[00:01:00]
array inside that each item in that array has a link, it could be pointing to a hyperlink and it has some text and it also has an image, right. Now what I want you to do is unless you have a good reason not to do that, I think that it would be good to use this as just a button which you can click and it will take the text in the button and render it into the chat widget as if the user had typed it and not use it as a feature for hyperlinking out. So just to give you an example, let me just show you what happens if you keep the hyperlink. So let's have google.yahoon.com and you have chip one and chip two and I think that the images are probably going to be wrong but we'll just go with this and see what happens.
[00:02:00]
So let's do that and I'm here in my editor, open this and allow it to load, show me suggestion chips and of course it loaded these two buttons and you do notice that the logo image is pointing to an invalid URL which is why it comes with this like broken image sort of representation and notice that it has this arrow pointing out and if you click on it, okay, so this is great, it does go to google.com and now you see that both the chips are basically gone from this widget and I don't like this behavior for a couple of reasons but the first thing is that when you click on a link, it links out and so I guess I'm not going to
[00:03:00]
say I don't like this feature but I'm just pointing out that there are two different ways to use it, one of which is not very optimal. So this is what happens if you actually had the hyperlinks, so let's close this. Now what I'm going to do is I'm going to remove the link from these two chips, okay, and let's go ahead and save it. So what happens here is that you have these two options, you have chip one and chip two but you don't have any hyperlinks associated with the suggestion chips. So if you were to open your chat widget and ask for the suggestion chips again, now notice that if I were to click on it, first of all you don't see this like arrow pointing away sort of like a new URL icon, so you can see that this is not associated with any URL but the other advantage of this is that look at what happens if I click on this button.
[00:04:00]
So it actually loaded or rather it actually sent this message chip one and it deleted the old suggestion chips. Now it actually reloaded the chips again because of the way we've constructed the bot, it's actually taken this phrase and it's effectively sent that as if the user typed that but because this is quite similar to this phrase over here we have, it's again been mapped to the same intent effectively. Now to avoid that what I'm going to do is let's close this, instead of having it say chip one I'm just going to say yes and then instead of chip two I'm going to say no as if the user is making a choice and let's save that. Now let's run it again, show me suggestion chips and you have this yes and no, so now
[00:05:00]
let's say if I say, if I click on this yes, what happened is the behavior is as if the user clicked on or typed the word yes and if they typed yes there's nothing handling the phrase, the word yes in the intent in the agent right now so it just went to the fallback which is why you're seeing this, what was that. So this is a great, I think this is a great option like in other words these suggestion chips allow you to do two things, first of all whenever you have, you're asking the user to input something but it can be represented whatever you're asking them to input can be represented as a list of options, they can just, you can just present that information to them as suggestion chips and if they just click on one of them it not only types that
[00:06:00]
text into the chat widget and it's also going to send that text across to Dialogflow just to be clear but also it deletes those two suggestion chips and the user can't like accidentally go back and click on them again. Now that's, that behavior is actually different from the other rich response types you have seen before, if you remember I showed you the button where I was able to click on it once and it launched a hyperlink or you know it triggered an event or something like that but while the, when it was in the chat widget it was showing in the chat window I was actually able to click on the button one more time even though that conversation turn had actually already elapsed, right. We had moved on later to a later point in the conversation but that button was still clickable and I just think that that's not good user design, like that's not good user interface design because if the user were to go back and click like if they just say
[00:07:00]
scroll up and like they click a very old button which was already there in some previous step now what happens if they do that is that suddenly it's not possible for you to design your bot to handle the expected users inputs. So you will actually have to handle a lot more unexpected things on the other hand with the suggestion chips like what we have here and the user clicks on the chip it disappears and it's as if the user typed the text and you have a way to handle it we move on to the next step in the conversation and now you can see that the user can't do anything other than go to the next question. So this is why I like this suggestion chip feature. Now one more thing I just want to I guess show before we move on if I remove the image field from this altogether save it and go here show me suggestion chips and you can
[00:08:00]
see that it's coming with these two buttons it's very nice you don't it's it doesn't require that you have an image associated with the suggestion chip and I think that this is even better so you can just click on it and as expected it triggered the fallback intent one more time. So that's the behavior of the suggestion chip and in fact I think that it's a great feature and I can imagine that it's going to get a lot of use as people build their website chatbots where they want to provide a way for users to select between multiple predefined options.
About this website
BotFlo1 was created by Aravind Mohanoor as a website which provided training and tools for non-programmers who were2 building Dialogflow chatbots.
This website has now expanded into other topics in Natural Language Processing, including the recent Large Language Models (GPT etc.) with a special focus on helping non-programmers identify and use the right tool for their specific NLP task.
For example, when not to use GPT
1 BotFlo was previously called MiningBusinessData. That is why you see that name in many videos
2 And still are building Dialogflow chatbots. Dialogflow ES first evolved into Dialogflow CX, and Dialogflow CX itself evolved to add Generative AI features in mid-2023
