Inspiration

Our biggest inspiration was 3Blue1Brown's Manim animation library. It's frankly one of the biggest reasons we even decided to pursue math in university. However, the library is in Python and pretty complicated to use — it's no wonder there aren't many math-visualization channels out there. We wanted to build something that can take natural language and translate it into visualizations anyone can enjoy. Mathphic is our first step toward that goal: it turns plain human language into complex mathematical visualizations. Try it out by asking it to visualize delta-epsilon proofs or Fourier transforms — it's as intuitive as playing a video game.

What It Does

Mathphic is an AI-powered math visualization engine.

  • Prompt Input: Users describe what they want visualized in natural language. In general, the more specific the prompt, the better the output.
  • AI-Driven Storytelling: A multi-agent pipeline (Gemini + Claude) generates educational scripts based on user questions and produces an animated visualization.
  • Immersive Audio: ElevenLabs text-to-speech integration narrates the mathematical explanations as the visuals play.

How We Built It

  • Frontend: Next.js (React), integrated with the Desmos API for graph rendering and MathJax for LaTeX display.
  • Backend: FastAPI (Python) orchestrating the AI pipeline and serving TTS streaming.
  • AI Pipeline: A sophisticated chain using Google Gemini for planning and Anthropic Claude for interpreting mathematical logic into a visual script.
  • Scripting Language: We built a small scripting language called Desq that abstracts much of the complexity, allowing the LLM to generate visuals more reliably.
  • Code Execution: The frontend executes the Desq code to produce beautiful, dynamic animations.
  • Audio: ElevenLabs API for high-quality, human-like narration.

Challenges We Ran Into

  • Prompt Engineering: There were many ambiguities in our instructions, and the LLM initially struggled to generate correct Desq output. It took iterative chain-of-thought prompting and carefully structured instructions to get reliable results.
  • Latency: We originally started with a more complex agentic architecture including validation models, but the latency stretched into minutes — so we simplified to our current pipeline.
  • Vercel/FastAPI Integration: Configuring Next.js rewrites and handling environment variables across a hybrid serverless/API architecture proved tricky.

Accomplishments We're Proud Of

  • Developing a highly interactive delta-epsilon visualizer that responds to cursor movements, making the formal definition of a limit immediately understandable.
  • Building a seamless multi-LLM pipeline that can take a simple prompt like "Explain the Central Limit Theorem" and turn it into a narrated visual sequence.

What We Learned

  • The power of multimodal education: combining visual, auditory, and interactive feedback drastically improves concept retention.
  • How to manage a complex multi-agent pipeline under time constraints, including prompt engineering for precise output and choosing the right model for each task.

What's Next for Mathphic

  • Integrate External APIs: We want to expand Mathphic beyond Desmos and MathJax by integrating additional tools into Desq, giving the agent the ability to handle a wider variety of visualizations.
  • Open Source: We plan to open-source the project for the mathematical community to contribute to and extend its capabilities.

Built With

Share this project:

Updates