A Chrome extension that turns questions into step-by-step explanations with AI tutoring and Manim animations.

TeachMe is a learning tool built at ShellHacks 2025. It allows students to ask questions (typed or uploaded as images) directly through a Chrome extension. The system analyzes the problem using Google’s Gemini models and generates both a conversational explanation and an accompanying Manim animation for visual understanding.

• Problem analysis with Google Gemini (text + image inputs)
• Automatic Manim animations for math, physics, CS, and more
• Conversational tutoring with step-by-step breakdowns
• Chrome extension integration for easy, in-browser access

┌──────────────────┐    ┌──────────────────┐    ┌─────────────────┐
│ Chrome Extension │◄──►│  FastAPI Backend │◄──►│  Manim Engine   │
│ • Popup UI       │    │ • Gemini Models  │    │ • Animation Gen │
│ • Image Upload   │    │ • Agent System   │    │ • Video Export  │
└──────────────────┘    └──────────────────┘    └─────────────────┘

1. Open the extension and enter a question or upload an image.
2. The backend uses Google Gemini to analyze the input.
3. An explanation is generated and paired with curated resources.
4. A Manim script is created, rendered, and sent back as an animation.
5. The animation plays directly in the extension popup.

• Frontend: Chrome Extension (HTML/CSS/JS, Manifest v3)
• Backend: Python (FastAPI, uvicorn)
• AI: Google Gemini Pro & Vision models, ADK multi-agent system
• Animations: Manim CE, AI-generated scripts
• Other tools: Pillow (image handling), dotenv (config), Ruff (linting)

• Python 3.12+
• Chrome browser
• UV package manager (pip install uv)

git clone https://github.com/jkion2/TeachMe.git
cd TeachMe/backend

uv sync
cp .env.example .env   # Add your Google API key

uv run uvicorn main:app --reload --port 8000

1. Go to chrome://extensions/
2. Enable Developer mode
3. Click Load unpacked → select /frontend
4. The TeachMe icon will appear in your toolbar

Input: “Explain the derivative of sin(x)”
Output: Conversational explanation with a Manim animation showing the slope of sine evolving into cosine.

Input: Image of a projectile motion problem
Output: Animation of trajectory, vector breakdowns, and formula derivation.

• Progressive Web App version
• Voice input + text-to-speech output
• Collaborative study sessions
• LMS (Canvas/Blackboard) integration
• Learning analytics and progress tracking

Built at ShellHacks 2025 by:

• Alvin Abraham – Full Stack
• Samarth Upadhya – Full Stack
• Kush Havinal – Frontend
• Marion Forrest – Backend

• ShellHacks organizers
• Google ADK / Gemini teams
• Manim community
• Chrome Extension API

If you like this project, give us a star on GitHub! :D