Hey everyone, Daniel from Voiceflow here. So I'm going to walk you through how to use this GPT chatbot template that we've created.
So, you can see the Voiceflow project, and then on my other tab, I've got our server that we've set up.
On the Voiceflow project, you have two core flows. The first flow is to ask a question and the second one is to load up a new website.
In this first flow, this first block is actually setting some variables that we're going to go pass over to our server to start parsing our website.
The first one I've got here is where your endpoint is. So when you start a new server, you're actually going to put the endpoint for the server here between these quotations.
The second one is just setting your Voiceflow API key. You can find your API key here in the integration section and click dialog API. Find the API key right here so you can hit copy. You're going to want to go and put that in a set step as well with quotations.
The third one is a target URL. We're going to put this in the website that you want to start with. So for me, I want to use the Airbnb S1. This is a really dense document and it talks all about the health of their business right before they do an IPO.
I don't want to read 300 pages, so I'm going to use this in our demo. It's going to copy the link, go back to Voiceflow, and I'm going to put the URL right within here. I've got our URL within here, then it's going to go to this component.
The component is a shared folder, so you see I've got it here and I can use it all by flow, and inside I've got an API call that's actually sending the website to be parsed to our server. If I open this up, you see I've got the endpoint here, so I'm using a variable for the endpoint slash API slash parser. I've got a header and then in the body, I've just got the URL and my Voiceflow API key.
Now going back to the home page here, those are kicking off the flow and it's going to load our website into our server to be parsed. After that, a user can ask a question. It's going to capture the question and send it over to a server so it's just a different endpoint here, but it's the same format—and then it's going to return the answer and allow a user to either ask another question or add in a new website to try out.
We're going to actually get this going. So on the side —and I’ve got this up on Replit here—I’m going to go start off and launch server so I'm going to go ngrok http 3200 so you can see the port I'm using is this 3200 port and the first thing I'm going to do is, I want this endpoint. I’m going to go ahead and copy this foreign and let's go ahead and add this to our project. So in Voiceflow for the endpoint, I'm going to go ahead and add in the URL here. Cool.
Back in our console we're going to go ahead and start this off, so let's hit start and you can see that it's now listening on Port 3200.
So let's go ahead back to our assistant and actually run it through the test. To start off we're going to go hit play, and we want to make sure that we train our assistant. This is going to make sure that all of our intents that we have on canvas are up to date and they’re trained, so if a user decides to free type, ask a question, or try to navigate through it, it'll actually pay attention.
This usually takes maybe about 20 seconds or so, but let's wait until it finishes.
It’s going to take a little bit to start just because it's loading a number of steps in the background. But as soon as it kicks off, you're going to start seeing it move through the canvas.
So you can see that it actually went through our three set steps here, it went through our API call, and now it's saying we've loaded the web pages from this specific URL into the database.
If I go check the database, I can see that a new folder has been created that actually has the information from the source.
Now I can start asking it questions. I'll ask it something like, “Who is the CEO of Airbnb?" and what it's doing is sending that to the API and responding back. So the CEO of Airbnb is Brian Chesky. I'm going to say, “How many shares does Brian Chesky own?"
Let's go ahead and make sure that name is right, and let's see what it comes up with. Cool, so Brian Chesky owns 76,938,518 shares of Class B common stock, and does not own any Class A common stock.
This allows you to ask any kind of questions to the Airbnb S1, depending on what's in there. So I can go ahead and do something even more specific like, “Who are the directors of Airbnb?" And as it responds, this really gives me a good sense of if my prompt is correct. I'm going to say, “How much does Ann Mather make?"
So you might get some answers like this where if the model isn't able to find specific information in your document, it's not going to try to make up any information. It'll respond back, but this will give you a really easy way to start actually combing through some of these big documents and optimizing it as we go.
In this GPT chatbot template that we've got, if you did want to change up the prompt of that, scroll to it, you can see over here that we've got our template which is dictating the prompt that we're sending over. So, “You are a contact assistant. Try to answer the following question. If you don't know the answer, just say I'm not sure. Don't try and make up an answer."
You can start modifying this prompt to really get more specific answers back from your AI assistant, whether you want them to have a persona, whether you want them to only use the information and the embedding, or whether you want them to kind of cater your props a bit more.
But go ahead and test it out—it's a super powerful chatbot once you set it up. Let us know if any questions.