Kingston's website is the place to go when having questions about having life in Kingston or when searching for events going on in the city, but navigating through the hundreds of the city's webpages for an answer can be gruesome. We were all interested in AI and wanted to challenge ourselves to build a chatbot website.

What it does

Kingsley is a chatbot built to help residents in Kingston with their inquiries. It takes in user input, and responds with a helpful answer along with a link to where more information can be found on the city of Kingston website if applicable. It has an option for voice input and output for greater accessibility.

How we built it

  • Kingsley uses a GPT-3 model fine-tuned on data from the city of Kingston website.
  • The data was scraped using Beautiful Soup.
  • A GloVe model was used to find website links relevant to the user's question.
  • Jaccard similarity was used to find relevant text that specifically mentioned key words in the user's question.
  • Relevant texts were narrowed down and passed as part of the prompt to GPT-3 for an answer completion.
  • The website along with the voice functionality were created using React.

Challenges we ran into

The CityOfKingston website has a huge amount of pages, a lot of which are archived, calendars, or not very useful. OpenAI's API on the other hand only allowed a limited context. so to have the bot be able to read relevant pages as its context, we had to go through multiple methods of data filtering to find the relevant pages. We spent a great amount of time implementing speech-to-text and text-to-speech for our webapp. Many of the solutions on the internet were of little help, and we tried using several npm packages before being successful in the end.

Accomplishments that we're proud of

We successfully made a working chatbot! And it references real facts! (sometimes)

What we learned

Throughout the project, we gained experience working with various APIs. We learned how to use and combine different natural language processing techniques to optimize accuracy and computation time. We learned React hooks useState and useEffect, Javascript functions, and how to use React developer tools to debug components in Chrome. We figured out how to link backend Flask with frontend app, setup a domain, and use text-to-speech and speech-to-text libraries.

What's next for Kingsley

Due to free trial limits, we chose to use the Ada GPT model for our chatbot. In the future if we had more credits, we could use a better version of GPT-3 in order to produce more relevant and helpful results. We are also interested in expanding Kingsley to reference data from other websites. It can also be adapted as an extension or floating popup that can be used directly on top of Kingston's website.

Built With

Share this project: