Inspiration

The Verizon website currently has an existing chat feature but requires a human representative due to the complex nature of recommending products. By using our generative A.I. chatbot and newly-created mascot Verizy, we can enhance the user experience and reduce costs.

What it does

Verizy leverages the GPT 3.5 Turbo Large Language Model to generate responses dynamically based on user input. Upon application startup, we prompt the language model to act as a Verizon sales representative. We also configure it to return data in JSON format. Users have the option to input their questions into the search bar directly or use our live autofill buttons to find solutions even faster.

How we built it

The frontend user interface is built in React.js. The backend utilizes Express.js and Node.js to call the OpenAI API and return responses. React uses Axios to send and receive backend responses.

Challenges we ran into

The animation of Verizy was our greatest obstacle. This was our first time working with animation states on the frontend, so there was a long learning process. The design, implementation, and display of Verizy each required a completely unique development process. However, we are extremely satisfied with the end product and believe that he is a fantastic addition to our webpage.

Interdisciplinary collaboration

We utilized digital design applications like Figma to bring Verizy to life. We combined graphic design, animation, and programming to calculate Verizy's fluid movements. This not only required us to learn graphic design elements, but also to understand how this interacts with the app on a larger scale.

Accomplishments that we're proud of

We are proud of how we were able to prompt the language model to produce the exact output we required (JSON). This took a significant amount of testing, but it is an integral part of our application. We are also proud of our user interface overall: we believe its simplicity creates a very straightforward user experience.

What we learned

We learned how to animate vector graphics in a web server, utilize the OpenAI API, manipulate raw data, alter the user interface dynamically, and merge the work of several team members into a single polished product using Github.

What's Next

As a team of entirely first-years, we are passionate about continuing our education at the University of Florida and developing our technical and professional skills.

Share this project:

Updates