ManimViz - Interactive Math Visualization Platform

A free, local-first platform for learning mathematics through beautiful Manim animations. Powered by local AI models (via Ollama) - no API costs.

Features

• 📚 Structured Courses - Integration and Differentiation courses with 9 lessons
• 🎬 Manim Video Rendering - Pre-built scenes for every lesson
• 🤖 AI Visualization Generator - Type any concept, get a custom Manim animation
• 📈 Interactive Function Plotter - Real-time plotting with derivative/integral overlays
• 🎯 Interactive Tools - Riemann sums explorer, tangent line explorer

Architecture

┌─────────────────────────────────────────────┐
│              Frontend (React + Vite)         │
│  Courses │ AI Visualizer │ Function Plotter  │
└──────────────────┬──────────────────────────┘
                   │ HTTP
┌──────────────────▼──────────────────────────┐
│              Backend (FastAPI)               │
│  Manim Renderer │ LLM Service │ Course API   │
└──────────────────┬──────────────────────────┘
                   │
          ┌────────▼────────┐
          │  Ollama (Local) │
          │  Local Models   │
          └─────────────────┘

Prerequisites

1. Python 3.10+ with Manim installed
2. Node.js 18+ for the frontend
3. Ollama with local models (e.g., qwen2.5-coder:7b)

Setup

1. Backend

cd backend
pip install -r requirements.txt
python main.py

The backend will run at http://localhost:8000.

2. Frontend

cd frontend
npm install
npm run dev

The frontend will run at http://localhost:3000.

3. AI Tutor server (realtime whiteboard)

The AI Tutor page needs its own WebSocket server (separate from the API above):

python backend/tutor_server.py

It listens on ws://localhost:8765 (override with HOST/PORT env vars). Without it, the Tutor page shows "Tutor server not reachable" and lessons can't start.

4. Ollama

Make sure Ollama is running with your models:

ollama pull qwen2.5-coder:7b
ollama pull gemma4:4b
ollama pull gemma4:31b

Usage

1. Browse Courses - Go to the home page and pick Integration or Differentiation
2. Watch Lessons - Each lesson has text content + a "Render Video" button that generates the Manim animation
3. AI Visualizer - Type any concept (e.g., "show me the chain rule") and the local AI will write and render Manim code
4. Function Plotter - Enter any function like x^2 or sin(x), see it plotted in real-time, toggle derivative/integral overlays, or render it as a Manim video

API Endpoints

Method	Endpoint	Description
GET	/health	Health check
GET	/courses	List all courses
GET	/courses/{course_id}	Get course with lessons
GET	/courses/{course_id}/lessons/{lesson_id}	Get specific lesson
POST	/generate	Generate Manim code from prompt + render
POST	/render	Render provided Manim code
GET	/render-scene/{scene_name}	Render pre-built scene
GET	/models	List available Ollama models

Project Structure

manimviz/
├── backend/
│   ├── main.py              # FastAPI server
│   ├── llm_service.py       # Ollama integration
│   ├── courses.py           # Course/lesson data
│   ├── scenes/              # Pre-built Manim scenes
│   └── rendered_videos/     # Rendered MP4 output
├── frontend/
│   ├── src/
│   │   ├── components/      # React components
│   │   ├── pages/           # Page components
│   │   └── App.jsx          # Main app with routing
│   └── package.json
└── README.md

Customization

Adding a New Lesson

1. Add a Manim scene in backend/scenes/
2. Add the lesson data in backend/courses.py
3. The lesson will automatically appear in the course

Adding a New Course

Add a new course object to the COURSES list in backend/courses.py.

Changing the Default AI Model

Edit backend/llm_service.py and change the default_model attribute.

Troubleshooting

• "Failed to connect to Ollama" - Make sure Ollama is running: ollama serve
• "Manim render failed" - Check that Manim is installed: manim --version
• Videos not loading - Make sure the backend is running on port 8000