TutorMe

• 

  landing

• 

  dashboard

• 

  list_course

• 

  lesson

TutorMe: AI-Powered Personal Active Learning Tutor

Track: Education
Built for: OpenAI Build Week Hackathon

Tech Stack: React, Tailwind CSS, ElysiaJS, Prisma, MySQL, OpenAI GPT-5.6, OpenAI Codex

💡 Inspiration In today's digital era, self-directed learners and students preparing for high-stakes exams (like UTBK-SNBT entrance exams in indonesia) face a critical hurdle: Information Overload and Passive Learning.

Students watch hours of video tutorials, feeling a false sense of comprehension, only to freeze when facing real problem-solving tasks. We wanted to solve this by creating TutorMe—an AI-powered personal tutor platform wrapped in a comforting, hand-drawn pastel graph-paper notebook UI that turns passive content consumption into active, bite-sized practice.

🚀 How We Built It TutorMe was engineered from scratch as a modern full-stack web application, accelerated extensively by OpenAI Codex: Frontend Architecture: Built with React, TypeScript, and Tailwind CSS. Designed around a custom pastel notebook aesthetic with hand-sketched doodles, washi-tape accents, and custom SVG mascot components. Backend Engine: Powered by ElysiaJS on Node.js/Bun for ultra-low latency routing. Database & ORM: MySQL managed through Prisma ORM. We designed a robust relational model enforcing canonical uniqueness constraints for chapter quizzes and final exams. AI Generation & Evaluation: Integrated Vercel AI SDK with gpt-5.6. It dynamically generates structured course roadmaps, lesson contents, per-lesson quizzes, and provides real-time AI grading for open-ended essay responses. 🤖 OpenAI Codex & GPT-5.6 Integration Codex served as our primary AI co-developer throughout the hackathon: Architectural Scaffolding: Codex engineered our 4-layer backend architecture (schema, service, controller, route) across 10 distinct domain models. Prisma Schema Optimization: Codex formulated complex relational schemas and written zero-downtime migration scripts: $$\text{CanonicalKey} = \text{userId} + \text{":"} + \text{quizId}$$

Prompt Engineering for Structured JSON: Leveraged GPT-5.6 to guarantee strictly validated JSON outputs for curriculum generation.

🧠 What We Learned Active Practice > Passive Watching: Structuring learning into a sequential progression where every lesson is immediately followed by active practice improves retention by a measurable margin. AI-Driven Pedagogy: Designing LLM prompts that act as a constructive tutor rather than just giving away answers requires careful balance in system instructions.

Codex-Accelerated Fullstack Workflows: Working alongside Codex allowed us to ship a production-grade fullstack application in days instead of weeks, delegating repetitive CRUD logic while focusing on core UX and AI features.

🚧 Challenges We Faced Deterministic Sequential Ordering: Ensuring that AI-generated modules and lessons maintain strict sequential ordering without array shuffling. We resolved this by implementing explicit index tracking: $$OrderIndex_i = i, \quad \forall i \in [0, N-1]$$ and enforcing orderBy: { orderIndex: 'asc' } in database queries. Real-time Essay Evaluation: Grading open-ended student essay responses dynamically required prompt tuning to prevent hallucinated scores while giving actionable, empathetic feedback.

State & UI Harmony: Blending a playful doodle design system with complex web app states (Pomodoro timers, quiz analysis modals, and progress graphs) while keeping rendering snappy.

🔮 What's Next for TutorMe Gamified Study Guilds: Allowing students to study in collaborative digital rooms. Multimodal AI Support: Enabling students to snap photos of handwritten math problems and receive instant step-by-step guidance. Expanded Exam Preparations: Adding pre-built tracks for international curricula and university entrance exams.

Built With

• codex
• elysiajs
• firecrawl
• mysql
• openai
• prisma
• react
• tailwindcss
• typescript