StudyAccompagnator

Inspiration

During my studies, I used tools like Trello, but I hadn't used anything for utilities like mind mapping. With the idea of making organization easier for students, I created a proof of concept for a Trello-like application, with the aim of developing both a mobile and a web app.

What it does

Currently, my application is a task manager featuring a study/work timer and a rest timer. I integrated a placeholder mind map page because I didn't have enough time to fully develop it. Users can create and customize tasks and timers as they wish. They can also view task deadlines in a calendar and manage completions directly within the task manager's Kanban board.

How we built it

I used Vanilla TypeScript, HTML, and CSS. I implemented a custom Single Page Application routing system to ensure lightning-fast navigation between the Dashboard, Kanban, and Calendar without any page reloads. For the UI, I leveraged AI tools to compensate for my limited design background. The entire project is bundled using Vite and containerized with Docker.

Challenges we ran into

One of my biggest problem was managing state dynamically without a framework like React or Vue. Another challenge was building the StudyAccompagnator Chatbot parser.

Accomplishments that we're proud of

I amincredibly proud of the level of polish and interactivity I achieved in such a short time.

What we learned

This hackathon was a deep dive into the power of modern browser APIs. I learned how much I can achieve with pure DOM manipulation and TypeScript when architected cleanly. I also gained hands-on experience with the Web Audio API for sound synthesis, and I vastly improved my understanding of CSS grid layouts and backdrop-filter optimizations for rendering complex frosted-glass interfaces smoothly.

What's next for StudyAccompagnator

This prototype is just the beginning. My immediate next step is to bring the "Mind Map Studio" to life by integrating a real-time LLM backend (like OpenAI or Google Gemini). This will allow users to actually upload their PDF course materials and watch the AI dynamically generate interconnected knowledge graphs. Beyond that, I plan to implement a robust backend database (like Supabase or Firebase) to introduce user authentication and cross-device synchronization, allowing students to access their StudyAccompagnator environment from anywhere.

Built With

• css-(glassmorphism-ui)
• docker
• typescript
• vanilla-html
• vite