StudyQuest

StudyQuest revolutionizes education by turning learning into an addictive game. Students chase streaks, compete on leaderboards, and crave knowledge like never before.

Comment

StudyQuest - Hackathon Submission

Inspiration

Students struggle with three main problems: lack of progress visibility, overwhelming textbooks, and procrastination on assignments. We wanted to solve these issues by gamifying education and making learning as engaging as playing a video game.

What it does

StudyQuest transforms traditional learning into an RPG-style adventure:

For Students:

  • Level progression system with XP and badges
  • Daily missions that take under 2 minutes to complete
  • Interactive level maps showing weekly content as unlockable levels
  • Boss battles for midterms and finals
  • Streak tracking and leaderboards for class competition
  • Bite-sized learning content through swipeable cards
  • Timed quizzes with instant feedback

For Teachers:

  • AI-powered course generation from uploaded syllabi
  • Automatic creation of weekly content, quizzes, and assignments
  • Student progress tracking and analytics dashboard
  • Class management tools with enrollment and performance insights
  • Video upload and content management capabilities

How we built it

Tech Stack:

  • Frontend: Next.js 14 with TypeScript and Tailwind CSS
  • Authentication: Custom Firestore-based system with SHA-256 hashing
  • Database: Firebase Firestore for all data storage
  • AI Integration: OpenAI GPT-4 API for content generation
  • Animations: Framer Motion for smooth UI interactions
  • Icons: FontAwesome for consistent iconography

Architecture:

  • Role-based routing with separate student and teacher portals
  • Component-based architecture with reusable UI elements
  • Service layer for Firebase operations and AI interactions
  • Custom authentication context for session management

Challenges we ran into

  1. AI Content Generation: Structuring prompts to generate consistent, educational content that matches curriculum standards
  2. Complex Data Relationships: Managing student progress, course content, and analytics across multiple Firestore collections
  3. Gamification Balance: Making the system engaging without overwhelming students with too many game elements
  4. Real-time Updates: Ensuring student progress and leaderboards update immediately across all users
  5. Authentication System: Building a custom auth system instead of using Firebase Auth for better control

Accomplishments that we're proud of

  • Built a complete end-to-end learning platform in a short timeframe
  • Successfully integrated AI to generate comprehensive educational content
  • Created an intuitive gamification system that doesn't feel forced
  • Implemented real-time analytics and progress tracking
  • Designed a clean, professional UI that works on all devices
  • Achieved 100% build success with no errors or warnings

What we learned

  • How to effectively integrate AI APIs into educational workflows
  • The importance of user experience in educational technology
  • Balancing gamification elements without compromising learning outcomes
  • Building scalable Firebase architectures for multi-user applications
  • Creating responsive designs that work across student and teacher needs

What's next for StudyQuest

Phase 1 - Core Features:

  • Complete quiz system with varied question types
  • Enhanced badge system with more achievement categories
  • Parent dashboard for progress monitoring
  • Mobile app development

Phase 2 - Advanced AI:

  • Personalized learning paths based on student performance
  • Predictive analytics for identifying struggling students
  • AI tutoring system for instant help
  • Natural language progress reports

Built With

Share this project:

Updates