MathGuru

Inspiration

My inspiration for this project comes from the way math shaped my childhood. I was that student who always wanted to go further—finishing exercises early, jumping ahead in the textbook, and constantly looking for the “why” behind every concept. But with limited internet access, exploring deeper wasn’t easy. I often felt like my curiosity was bigger than the tools I had.

This project was born from that feeling. It’s built for the child I used to be—and for every explorative learner who wants to stretch their mind, push past the basics, and discover more than what the classroom can offer. My goal is to create a space where curiosity doesn’t have to wait for better resources or faster Wi-Fi. It can grow right here, at its own pace.

What it does

MathGuru is an interactive mathematics learning platform that gamifies education through a galaxy-exploration metaphor. Students navigate a constellation of 40+ interconnected math topics, from basic algebra to advanced calculus, capturing "territories" through quizzes and unlocking progressively complex concepts. The app features AI-powered tutoring using Ollama's local Llama 3.1 8B model for instant, free math explanations, interactive visualizations with live parameter controls, and automatic progress persistence across sessions. The unique territory-capture mechanic creates an engaging progression system where mastering one topic intelligently unlocks related areas, ensuring structured but flexible learning paths.

How we built it

The application was built using modern React 19 with TypeScript, leveraging Vite as the build tool for fast development and optimized production bundles. The frontend utilizes Tailwind CSS with shadcn/ui for consistent, accessible design system components. State management combines React hooks with localStorage for persistence, Zustand for global state, and React Query for server state handling.

Mathematical visualizations are powered by custom SVG implementations with Math.js for computations, while Recharts provides statistical graphing capabilities. AI integration uses Ollama's local inference server (running Llama 3.1 8B) with graceful fallback to OpenAI GPT via their API when local LLM is unavailable. The backend consists of Supabase for cloud features with a heavy focus on offline-first architecture.

Key components include GalaxyMap for exploration navigation, LearningSession for rich interactive lessons, Quiz system for assessments, and AI service for conversational math tutoring. The topic library in JSON structures the curriculum with dependency relationships for intelligent progression unlocking

Challenges we ran into

One significant challenge was integrating the local Ollama AI model with reliable performance across different platforms. The Llama 3.1 8B model required careful setup instructions and fallback logic to OpenAI when the local server wasn't available, ensuring users always had access to explanations.

Creating interactive mathematical visualizations that were both educational and performant posed another hurdle. Building custom SVG-based graphs with real-time parameter updates while maintaining 60fps animations required careful optimization and state management strategies.

Mapping out intelligent topic unlocking systems based on mathematical dependencies was complex. We needed to model curriculum hierarchies that aligned with how mathematics actually builds upon itself, ensuring logical progression from basics like linear equations to advanced topics like multivariate regression.

Cross-platform compatibility for the Ollama server installation across macOS, Linux, and Windows required extensive documentation and testing to handle different system configurations and user setups.

Accomplishments that we're proud of

Successfully implementing zero-cost, completely offline AI tutoring using Ollama's Llama 3.1 8B model stands out as our greatest achievement. Users get instant, high-quality math explanations without any API fees or cloud dependencies, enabling truly accessible learning.

The galaxy-themed exploration system creates an engaging, game-like learning experience that makes abstract mathematical concepts more approachable. The territory capture mechanic turns rote learning into an adventure, with beautiful animations and visual feedback that celebrates every conquered topic.

Building comprehensive interactive visualizations for complex mathematical concepts - like live quadratic transformations, geometric constructions, and statistical distributions - provides students with intuitive understanding that textbook diagrams cannot achieve. The ability to manipulate variables in real-time and see instant visual feedback revolutionizes how users grasp mathematical relationships

What we learned

Working with local large language models like Llama 3.1 8B taught us about the practical challenges and rewards of running AI inference locally. We gained deep insights into model optimization, hardware requirements, and creating user-friendly setup processes that accommodate different technical proficiency levels.

Developing interactive mathematical visualizations revealed the power of combining computer graphics with educational content. SVG animations and real-time JavaScript calculations showed how visual exploration can make abstract concepts tangible and enjoyable.

The project highlighted the importance of curriculum design in educational software. Researching mathematical dependencies and building intelligent progression systems taught us about scaffolding learning from pre-requisites to advanced applications.

We learned the value of offline-first architecture and graceful degradation. Building features that work seamlessly with or without internet connectivity, and designing fallback systems that maintain functionality under adverse conditions, proved essential for educational tools that need to be reliable everywhere.

Finally, the project demonstrated the impact of gamification on user engagement. Coupling meaningful mathematical concepts with visual rewards and achievement systems showed us how educational software can leverage psychological principles of motivation and progression to create compelling learning experiences.

What's next for MathGuru

MathGuru's future roadmap includes immediately completing lesson content for all 40+ mathematical topics currently showing as "under construction," implementing voice-based AI tutoring for hands-free learning, adding multiplayer gaming with competitive leaderboards and cooperative study groups, and enhancing visualizations with 3D interactive geometry. In the medium term, we'll launch native mobile apps for iOS and Android with robust offline AI capabilities, introduce cloud synchronization for seamless progress across devices, develop teacher dashboards with classroom analytics and curriculum management, and implement AI-driven adaptive difficulty that adjusts challenges based on individual student performance. Long-term, MathGuru will expand into a comprehensive "Guru" ecosystem with sister apps for Science, Chemistry, and Physics, incorporate virtual and augmented reality for immersive math exploration like walking through probability distributions or algebraic surfaces in 3D space, launch global mathematical challenge competitions with real-world prizes, and create deeply personalized learning paths powered by advanced AI that proactively predict and address individual learning gaps. This evolution will transform MathGuru from an engaging galaxy explorer into a revolutionary educational universe that makes mathematics irresistibly attractive through cutting-edge technology, community features, and innovative pedagogy.

Built With

• custom-svg-graphs-**mathematics**:-math.js-library-**ai-integration**:-ollama-(local-llama-3.1-8b)-with-openai-fallback-**database**:-supabase-**routing**:-react-router-dom-**code-highlighting**:-prism.js-**development-tools**:-eslint
• eslint
• ollama
• openai
• postcss
• prism.js
• react
• react-query-(@tanstack/react-query)-**forms**:-react-hook-form-with-zod-validation-**animations**:-framer-motion-**data-visualization**:-recharts
• shadcn/ui
• tailwind
• typescript
• vite
• zustand