MindMap AI

Inspiration

Learning should be an adventure, not a chore. We've all experienced the frustration of trying to understand complex topics by jumping between your screens, losing our train of thought, and struggling to see how concepts connect. Wanted to create a tool that transforms knowledge exploration into an immersive and visual journey that shows you the web of concepts unfold in 3D space. My inspiration came from the realization that human brains naturally think in networks and associations, so why shouldn't learning tools reflect that?

What it does

MindMap AI is an AI-powered 3D knowledge graph visualization platform that transforms how people explore and understand information. Users simply type a query or upload an image, and MindMap AI creates a beautiful 3D network of related concepts they can explore by clicking, rotating, and diving deeper into each node.

How we built it

Frontend (Next.js+React.js)

Three.js and react-force-graph-3d for stunning 3D visualizations
Modern glass-morphism UI with smooth animations
Server-side rendering for optimal performance

AI Backend (Python + FastAPI)

Google Gemini 3.0 Flash Preview for multi-agent AI research
Google Gemini Multi Modal model for computer vision in understanding image uploads and extracting key related information from the web.
Sentence Transformers (all-MiniLM-L6-v2) for semantic embeddings
Three distinct AI agent personas running in parallel
Wikipedia API integration for metadata enrichment

Vector Engine (C++)

Custom-built high-performance vector similarity search
Optimized dot product calculations for 384-dimensional embeddings
Binary storage format for 2000+ pre-computed vectors
HTTP server using cpp-httplib for sub-millisecond responses

Infrastructure

Docker containerization for all services
Microservices architecture with inter-service HTTP communication
Deployed on Render with environment-based configuration
Automated CI/CD pipeline

Challenges we ran into

Host Platform Issues: Because of the multiple systems this project entails (c++ engine, python backend, and react frontend), finding a host compatible for all three and one that could accommodate the vast amount of data being extracted was a challenge. I juggled through many different hosting platforms (Render, Vercel, Railway, AWS), and finally settled on using railway to host MindMap AI.

***Cross-Language Integration*: Getting C++, Python, and JavaScript services to communicate seamlessly was tricky. We had to carefully design our API contracts and handle serialization/deserialization across languages.

Performance Optimization: Rendering 100+ nodes in 3D with smooth physics simulations while maintaining 60fps was challenging. We implemented aggressive optimizations and careful state management.

Accomplishments that we're proud of

Full-Stack Innovation: Successfully integrated C++, Python, and modern React into a cohesive, production-ready application
AI Multi-Agent System: Created three distinct AI personalities that provide genuinely different perspectives, making research more comprehensive
Performance Excellence: Achieved sub-millisecond vector search times and smooth 60fps 3D rendering with physics simulations
Beautiful UX: Crafted a polished, glass-morphism interface that makes complex technology feel approachable and fun
End-to-End Deployment: Successfully deployed a multi-language microservices application to production with proper orchestration
Image Analysis: Integrated vision AI to extract concepts from images—something we implemented on a whim that turned out amazing
Complete Documentation: Created comprehensive architecture docs, deployment guides, and API documentation