The Math AI Tutor for Everyone

Next-Gen Education

Comment 1

Inspiration

Many students struggle with learning mathematics when they don't have someone to guide them step by step. We wanted to create a tool that acts like a personal tutor, especially for situations where a student might be studying alone. The idea was inspired by observing how students often get stuck on problems not because they cannot solve them, but because they lack guidance and feedback at each step.

What it does

Our project is a math learning chatbot that helps students solve problems step by step. The student uploads an image containing a math problem, and the chatbot guides them through the solution without ever giving the direct answer. It asks for the next step, evaluates the student’s input, provides hints if necessary, and only proceeds when the student is ready. The system also tracks the total number of questions asked and correctly solved, and displays these statistics on a leaderboard.

The chatbot has three modes:

  • Guided Mode (default): Only asks for the next step, gives feedback, and waits for the student to proceed.
  • Soft Mode: Evaluates each student answer, explains mistakes, and provides the correct solution for that step before moving on.
  • Practice Mode: Students select a topic from the practice page, and the system generates a series of related problems for them to practice. Each session gives feedback on mistakes and highlights areas to focus on.

How we built it

We built the project using modern frontend and backend technologies, cloud services, and local storage for state management. The chatbot supports image input, generates step-by-step guidance, and maintains chat history, expected solution steps, and current progress.

Frontend:

  • React 18 + TypeScript for a robust, type-safe UI
  • Vite for fast development and bundling
  • Tailwind CSS + shadcn/ui for styling and components
  • React Router for routing
  • TanStack Query for efficient data fetching and caching
  • KaTeX for rendering mathematical expressions
  • Framer Motion for smooth animations

Backend:

  • Lovable Cloud (Supabase) for database and user/session management
  • Deno Edge Functions for serverless API endpoints
  • Lovable AI Gateway using Google Gemini 2.5 Flash model for problem analysis and step-by-step guidance

Storage:

  • localStorage for storing user data, session information, and topic statistics

This architecture allowed us to create a fast, interactive, and responsive math tutoring chatbot capable of handling multiple sessions, different guidance modes, and practice mode with feedback and step tracking.

Challenges we ran into

Designing a chatbot that could respond appropriately to incorrect answers without giving away the solution was a key challenge. Handling practice mode, where multiple problems are generated and feedback is provided for each, added complexity. Ensuring smooth session management, leaderboard updates, and consistent chat experience required careful planning and validation.

Accomplishments that we're proud of

  • Developed a fully functional step-by-step math tutoring chatbot
  • Implemented guided, soft, and practice modes for different learning styles
  • Created a leaderboard and progress tracking system
  • Designed the system to be accessible for disabled students
  • Maintained a fully English-language interface for global usability

What we learned

We learned how to design a guided learning system that balances between giving hints and allowing independent problem-solving. practice mode highlighted the importance of structured feedback and tracking mistakes to improve learning. We also gained experience in handling interactive chat sessions, step validation, and integrating image input with problem analysis.

What's next for The Math Tutor For Everyone

In the future, we plan to:

  • Expand accessibility features for disabled users
  • Enhance image recognition for more complex problem types
  • Integrate real-time math rendering for better visualization
  • Provide more detailed feedback on common mistakes and learning gaps
  • Add gamification features to motivate learners
  • Improve practice mode with adaptive problem difficulty based on student performance

Built With

Share this project:

Updates