Adaptive AI Learning Prototype

Inspiration

We (the dev team) are very new to hackathons, and to coding in generals. I've only been programming for about three months now, while my partner barely has any coding experienced. I learned about hackathons a week ago - my partner was the one to introduce me to it, and to this specific hackathon as well. We aren't the best at this kind of stuff as it's our first time, but we wanted to create something to fix a problem we were facing ourselves, and a lot of other kids face. Studying.

Most kids don't know how to study. So our goal was to fix it, and make it accessible to everyone. All the things that someone would need are in our project, and even though it isn't perfect and there are a lot of things to be improved, the reason I did this is to hopefully help kids study, wherever they are or whoever they may be.

What it does

The current Prototype accepts a few things from the user, including their interests, struggles, and topic they want to learn. It takes all of that and uses it as a prompt for the AI. After inputting these variables, the user is taken to a dashboard with a few things: a timer, a quiz generator, a context dump area, and a tutor chat. The quiz generator creates quizzes based on the things the user inputted. The chat helps the user learn their topic based on the things the user inputted. The context dump can be used to add any new information the user would like included in the quizzes. And the timer is there as a small plus, so users can manage their studying effectively and not burn themselves out.

How we built it

I'll keep this simple.

1. Research a TON about all the things we needed. I knew the basics, how to get an API key from OpenRouter, but I had no idea how to use it. My partner knows about web dev more than me, so I had her create the frontend for the webapp, using nextjs and tailwind. She also created the color theme for the website and logo. While she was doing this, I was learning as much as I could about web development.

2. Set up the project folder. I set everything up, and slowly while using youtube tutorials, I got the website to a point where it was semi functional, and I could run it on my computer. The only thing remaining was adding the AI part.

3. Add the AI Part - I learned how to do this through more youtube tutorials, basically having the AI generate json that I could plug back into my code to generate the quizzes.

4. Testing - We started this hackathon only a few days before the deadline listed, so we had to cram a lot. Only a bit of time was spent on testing.

5. Final outcome? - We have something working, but it isn't what we envisioned completely. This is our submission, but we will continue improving on it.

Challenges we ran into

Everything was a challenge. Since I didn't know much. But I ran into a lot of trouble trying to get the AI to give the right format of stuff back and actually use that to create the quizzes, it was a pain.

Accomplishments that we're proud of

Getting it actually working! We have never done something like this before.

What we learned

I mostly learned how to integrate the AI features into the webapp, and get everything working in that part. That was the most important thing I learned.

What's next for Adaptive AI Learning Prototype

Make it WAY BETTER! There needs to be other sections, like a storyline mode using the interests that the user suggested to take the user through a storyline around a concept of the topic they selected. The quizzes need to use the context better. The chat needs to be formatted properly. There are a LOT of things to add!

Built With

• deepseek
• lucide
• next.js
• node.js
• npm
• openrouter
• radix
• react
• shadcn
• sonner
• tailwind
• typescript
• vaul
• vscode