Build a custom chatbot for a website in 1 hour
I'll go over steps to build a bot that can reference files and can be embedded in a website. Then discuss takeaways from launching a support chatbot in my last role.
The best way to learn is to tinker. It will make something that Looks Like Magic (LLM) seem less abstract. Even better, you’ ll better understand the capabilities, opportunities, and tools.
I built a custom Chatbot to answer questions about pickleball paddles for a made up landing page to prep for an upcoming interview. It's pretty amazing that I can point the Chat GPT API to a CSV of pickleball paddle data and the chatbot will make sense of it without much context or instructions.
But first, some questions that you are probably wondering:
How this is different than what is offered by Chat GPT?
This chatbot will answer specific questions based on a file you upload, rather than being generic. Custom GPTs can do this as well, but requires users to pay for a ChatGPT Plus subscription.
This chatbot can be embedded in any website - that means users don’t need to go to https://chat.openai.com/ to interact with it.
Is this fine tuning or Retrieval Augmented Generation (RAG)?
In short no to both. This is very basic. Simply providing a file as context does give the model more information to work with, but it does not constitute the active retrieval component seen in RAG, where the model itself searches through a dataset to enhance its responses.
Fine Tuning: Fine-tuning a model involves updating the model's weights on a specific dataset to adapt its knowledge or behavior to perform better on tasks related to that dataset. It's a training process where the model learns from new examples after its initial training phase, thereby improving its performance on specialized tasks or domains.
RAG, on the other hand, involves a dynamic retrieval of information from a large dataset or knowledge base at runtime, where the model queries this dataset to fetch relevant information to augment its response. This process is integrated into the model's architecture and workflow, allowing it to leverage external data in real-time to inform its outputs.
Cost: $5-$25 and ~1 hour of your time. See this Youtube video for step by step instructions if you get stuck, or leave a comment.
Steps
1️⃣ Setup an Open AI API key and add ~$5 to your developer account.
2️⃣ Fork this Replit template, add your Open API Key (note: unless you pay for Replit Core to make this private, your API key would be public). Upload a CSV, pdf or other doc. for example, I used a CSV of paddle info. Look for where there is all CAPS in the file and add the file name you just added and other add bot instructions.
3️⃣ Create a Voiceflow account Download the voiceflow file and open it. Replace the api info with your Replit project URL. Tweak some of the chatbot text and settings. See video for walkthrough.
4️⃣ Optional: If you want people to access your chat bot at all times vs on demand, pay for Replit Core ($20) and deploy your project for the world to see.
5️⃣ If you want to test your bot on a landing page, sign up for Glitch, paste your chatbot code into the index.html file to simulate adding it to a landing page.
6️⃣ Send the Glitch URL to others to get them to test it out
The latency isn’t great, but you could see how this could help a customer navigate through so many options in a much more human and faster than scanning a CSV or inputting each variable one by one via a typical form. For my next iteration, I would add more pre-selected buttons at the start of the chat.
In my last role, I helped launch a customer support chatbot powered by ChatGPT. Here is what I learned:
The first 80% is a breeze, but the last 20% to make it ready for users is a grind. The G in GPT stands for general - it needs lots of work to get it to respond in a way that is helpful and has the right tone. The first iteration is always impressive but take the time to think through the most sensitive issues you want to walk users through and how you want the bot to respond.
Like all coding, it is garbage in, garbage out. If people don’t know what question to ask, the chatbot is useless. Often times people don’t know what their problem is or what questions to ask. Pre-seeded questions are key as a conversation starter.
Along the same lines, ChatGPT can’t reason - it can only pattern match text, but can’t identify issues or human motivations. For example, if a user types “I lost my money! help now!” ChatGPT would need a knowledge base of help articles and chats to recommend options. A way around this is building more logic for sensitive issues like loss of funds since its such a emotionally charged and urgent issue. Especially since the generated responses can sound so convincing, even if they are wrong.
People aren't fans of being outsourced to a bot because it feels impersonal. People are trained to think its not helpful AND it can’t actually take any meaningful actions. It reminds me of when dialing a help number and pounding 0 to get to a person. Make sure to have an escape path to escalate to actual humans so users don’t get stuck in an infinite loop.
So, there you have it! A quick and dirty guide to building a chatbot and some things to watch out for when launching your chatbot.
Nice! Replit is a great tool - I started using it a few months ago, and found it very helpful for rapid prototyping.