Inspiration

We are a group of 4 friends who were in Mr. Fisher's physics class. Every Friday, we had our Fisher Friday sessions, where we were able to learn different science topics through Youtube playlists. Inspired by this, we resolved to create a platform that allows any age demographic to explore and easily learn topics in a similar, fun fashion while saving time.

What it does

Our product allows the user to input an initial query indicating the general topic they want to learn about. The user is then prompted to choose related topics that go further in depth to allow the them to learn the topic more deeply. Once the desired level of specificity is reached, the user is presented with an AI generated roadmap of online resources that guide them towards successfully learning the topic.

How we built it

Our project was created using a React frontend and a Flask backend connected using axios. We first outlined the basic frontend and backend structure of our project and all of the APIs that we were thinking of including for the various use cases we wanted our project to handle. For the frontend, we brainstormed a variety of different visual features for the UI to add and implemented them in a hierarchical fashion whereby we prioritized features that corresponding to an MVP first before adding anything extra. We prioritized a clean and crisp UI with vibrant colors to pique the ingterest of the user and keep them engaged. By implementing features for the frontend one at a time, we were able to ensure that we were effectively building successfully towards a more complex design. For the backend, we also followed a similar approach whereby we first picked out the frameworks and APIs that we’d be using for our project. Then, we formulated our problem as a tree navigation problem whereby a user will traverse a “tree of knowledge”, starting with an end goal in mind. We then divided the implementation of the backend into three phases: determining what the user wants to learn (the end goal), determining what the user knows, and outputting a curriculum of YouTube videos for them to learn the content.

Challenges we ran into

For the frontend, we faced challenges such as making the interface more interactive with features such as chatHistory and redoButton. Another challenge we faced was linking images and other files to multiple devices which was problematic, as differences in our devices frequently caused errors. For the implementation of the backend, we faced several challenges with determining a valid scoring function to assess the quality of YouTube videos and had to experiment with several different techniques of data normalization and data preprocessing in order to ensured that we were handling all edge cases correctly. Another challenge we faced was integrating the frontend and the backend and had to refactor some portions of our code to ensure that the connection was properly established and that all of the UI features were properly integrated with the backend.

Accomplishments that we're proud of

One of the accomplishments we are proud of is how friendly our user interface is and how it maintains the past data and allows the user to make creative pathways towards their own learning. We are also proud of how the graphic designs for the frontend is very minimalistic as we planned. For the backend, we are proud of how we cleverly designed the scoring function for assessing video quality as we were able to get very reasonable results with our hand crafted function.

What we learned

We learned how to use the React, Axios, and Flask frameworks in order to create a modern looking UI and functional backend for our product. This was our first time using these frameworks, so we are pleased with the amount of knowledge we gained throughout the hackathon in these tools. We also strengthened our algorithmic design skills, as we had to design many of our functions from scratch using ad hoc methods.

What's next for Fisher FridAI

Our product can also be further expanded into other websites including Wikipedia which contain a nice form of structure that can be extracted for learning any topic of desired interest. If we had more time, we could've also connected the backend to Firebase where we can access persistent data. Additionally, we could also implement an agentic framework using Langchain in order to enhance the quality of the responses generated by the LLM.

Share this project:

Updates