Inspiration
Last year, we made a project that randomly selected a string from a large array using the Math.random() method. While it worked, we wanted it to feel more dynamic and personalized. We had the idea of connecting it to AI so each response could be unique, but at the time, we were still new to coding and had no idea how to make that happen.
This year, we were determined to build something that truly used AI as the backbone of the project. After exploring a few ideas, we landed on Explain It Like I’m 5 (ELI5)- a tool designed to help anyone learn something new, get clarification on a topic, or understand a concept at exactly the level they need.
What it does
Explain It Like I’m 5 (ELI5) allows users to enter any question or topic they want to learn about and choose how detailed the explanation should be. Using a scale from beginner-friendly explanations to more advanced, in-depth explanations, ELI5 adapts its response to match the user’s level of understanding. This makes it useful for students learning something for the first time, as well as more experienced users looking for deeper clarification.
How we built it
We built the project using Visual Studio Code as our primary code editor. Before writing code, we spent around 2 week planning out how we wanted the project to work and how the front and back end would communicate. We started by developing the front end and user interface to make sure the site was simple and intuitive to use. After that, we focused on the back end, where we used OpenAI's API(ChatGPT). Connecting the AI API and properly sending and receiving data between the front end and back end took the most time, but it was also the most rewarding part of the project.
Challenges we ran into
One of our biggest challenges was working with an AI API for the first time. Setting it up correctly, handling requests, and interpreting responses took a lot of trial and error, along with many tutorials and documentation deep-dives. At one point, our back end was successfully sending requests to the AI platform, but a bug in our code prevented the front end from receiving the response correctly. This caused confusing errors and empty explanations, which took time and debugging to resolve.
Accomplishments that we're proud of
We’re proud of creating a clean, modern user interface that looks good without being overwhelming or confusing. We’re also proud of successfully integrating an AI-powered back end and making the entire system work end-to-end. Completing a fully functional AI-based project was a big milestone for us.
What we learned
We learned how to work effectively as a team, plan a project from start to finish, and break down a large problem into manageable steps. We also gained valuable experience working with APIs, debugging client-server communication, and building a real-world web application.
What's next for ELI5
In the future, we’d like to add a feature that allows users to save and revisit past explanations. We also want to gather feedback on the UI and continue refining the design to make the experience even better.
Built With
- css
- github
- html
- java
- javascript
- maven
- openapi
- springboot
- visual-studio
Log in or sign up for Devpost to join the conversation.