Lumen

Inspiration: We built Lumen to make learning more engaging by combining AI, personalized learning paths, and gamification instead of static courses.

What it does Lumen creates personalized learning journeys with AI-generated lessons, quizzes, coding challenges, an AI coach, daily missions, and progress tracking.

How we built it

Frontend:React, Vite, Tailwind CSS, Framer Motion Backend: Serverless APIs with OpenRouter AI integration Auth & Storage: Supabase-ready architecture with local demo mode State & Routing: React Router, Context API, localStorage

Challenges we ran into**

• Supporting both demo and live AI modes
• Managing authentication without backend secrets
• Keeping API keys secure during development

*Accomplishments

• Built a working AI-powered learning platform
• Added gamified learning modes and AI coaching
• Created a scalable architecture for future growth

**What we learned

• Building hybrid demo/live applications
• Separating AI, backend, and frontend cleanly
• Managing secrets securely with environment variables

**What's next

• Real Supabase data sync
• Smarter AI coaching and recommendations
• Study groups, leaderboards, and collaborative learning

Built With

• framer
• javascript
• node.js
• react
• supabase
• tailwindcss