LearnLens

💡 Inspiration We noticed a fundamental flaw in modern digital education: one-size-fits-all learning. Most platforms follow a rigid loop: Lesson → Question → Answer → Next Question. When a student gets an answer wrong, they are typically given the exact same explanation again. But two students can fail the same Binary Search question for entirely different reasons. Student A might not understand search-space reduction, while Student B might understand the logic but struggle with calculating time complexity. We wanted to build a platform that doesn’t just tell a student they are wrong, but actively figures out why they are wrong and dynamically changes how it teaches them. 🚀 What it does LearnLens is an adaptive AI learning engine that identifies knowledge gaps and misconceptions, then dynamically adapts its teaching strategy to fit the student. Unlike generic AI chatbots, LearnLens enforces a strict pedagogical loop: Learn → Practice → Analyze → Detect → Adapt → Improve. When a student struggles, LearnLens: Analyzes their specific answer and reasoning. Detects the root misconception (e.g., "You are confusing O(n) with O(log n)"). Adapts the teaching strategy in real-time (e.g., switching from a text explanation to an interactive, step-by-step visualization). Reassesses with a tailored practice question to prove mastery. The platform securely remembers the student’s learning history, updating their profile, progress charts, weak areas, and personalized learning path after every session. 🛠️ How we built it We built LearnLens as a production-grade, full-stack application with strict security and performance in mind: Frontend: React, TypeScript, and Vite for a fast, type-safe user interface. Styled with Tailwind CSS and animated with Framer Motion for a premium, engaging UX. Chart.js handles progress visualization. Backend: Python and FastAPI. We deliberately routed all AI requests through our backend to protect API keys and enforce strict Pydantic validation. Database & Auth: Supabase (PostgreSQL). We used Supabase Auth for seamless Email/Password and Google OAuth flows. Security: We implemented strict Row Level Security (RLS) policies in PostgreSQL, ensuring students can only query their own progress, attempts, and profiles. The FastAPI backend verifies the Supabase JWT on every request. AI Engine: Integrated via the FastAPI backend to generate lessons, evaluate answers, detect knowledge gaps, and recommend next steps using structured JSON outputs. 🚧 Challenges we ran into Structuring AI for Reliability: Early on, the LLM would sometimes hallucinate generic feedback instead of identifying specific, actionable misconceptions. We solved this by enforcing strict JSON schema outputs in our FastAPI backend, forcing the AI to categorize errors into predefined pedagogical buckets that our frontend could reliably act upon. The "AI Wait Time" UX: LLM analysis takes a few seconds. Instead of a boring loading spinner, we engineered contextual, narrative-driven loading states (e.g., "Analyzing your response..." → "Finding the concept you're struggling with..." → "Adapting your lesson..."). This turned a technical limitation into a dramatic, engaging part of the user experience. Complex State Management: Tracking a live learning session (initial score, current question, AI feedback, updated progress) across multiple components was challenging. We streamlined this by creating a dedicated, centralized state hook (useLearningSession) to keep the UI perfectly synchronized with the backend. 🏆 Accomplishments that we're proud of Nailing the "WOW" Moment: We successfully built the core adaptive loop. Watching the app seamlessly transition from a wrong answer → "Misconception detected" → a dynamic shift to an interactive Binary Search visualizer → and finally showing a tangible score improvement (42% → 78%) is incredibly satisfying. Building a Real Engine, Not a Chatbot Wrapper: We resisted the urge to just build a chat interface. LearnLens has dedicated dashboards, progress tracking, weak area analysis, and structured learning paths. Enterprise-Grade Security in a Hackathon: Implementing and rigorously testing Supabase Row Level Security (RLS) and JWT verification on all FastAPI endpoints ensures that student data is genuinely private and secure. 🧠 What we learned Pedagogical AI requires guardrails: Letting an LLM "freestyle" teaching is less effective than guiding it with structured prompts, predefined misconception categories, and deterministic fallback logic (e.g., "IF score < 50%, reduce difficulty and provide an analogy"). The "Middle Mile" of UX matters: How an application behaves while it is processing is just as important as the final result. Contextual feedback builds trust and keeps the user engaged. Deepened Full-Stack Skills: We gained practical, hands-on experience connecting a modern React frontend to a secure Python/FastAPI backend, while managing complex PostgreSQL relationships and RLS policies. 🔮 What's next for LearnLens Subject Expansion: Moving beyond our MVP focus on Computer Science (Binary Search, Sorting, Graphs, Time Complexity) to include Mathematics, Natural Sciences, and Language Learning. Multi-Modal Input: Allowing students to upload photos of handwritten math problems or code snippets for the AI to analyze and provide visual feedback on. Spaced Repetition Integration: Combining our knowledge-gap detection engine with a spaced repetition algorithm to automatically schedule reviews of weak concepts at the optimal time for memory retention. Educator Dashboards: Providing teachers and parents with anonymized, cohort-level insights to see which concepts are causing the most widespread friction in a classroom. LearnLens doesn't just answer questions. It learns how you learn.

Built With

• base44