Chosen Problem Statement

Traditional education systems often adopt a one-size-fits-all approach, leaving students who learn differently or at varying speeds behind. According to UNESCO (2023), approximately 260 million students globally fail to achieve minimum proficiency levels due to inflexible educational methodologies.

Solution Overview

LearnAI aims to revolutionize the way students learn and prepare for exams by offering an intelligent quiz-generation system. Students can upload PDFs, and our platform, powered by Gemini, will automatically extract key information and generate comprehensive quizzes. The application features a user-friendly interface for taking quizzes, tracking progress, and viewing rankings among peers. This project addresses the challenge of creating engaging and effective study materials, reducing the manual effort for educators and enhancing the learning process for students.

Key pages include:

Dashboard Page

The dashboard page provides an overview of the application and quick access to the application's key features. The dashboard also shows the following data:

  • Current Streak: 7 days (shows consistency and gamifies progress)
  • Total Quizzes Completed: 24 (tracks user activity)
  • Average Score: 87% (gives performance feedback)
  • Weekly Goal Progress: 65% (visual progress bar)
  • Weekly Progress Section: (reinforces weekly targets with both percentage and visual progress bar)
  • Recent Topics Section: (provides easy recall and topic tracking)

Upload Page

Allows users to upload their study materials (e.g., PDF documents) for AI processing and quiz generation.

Quiz Page

Where users can take the AI-generated quizzes. We currently have two modes:

  • Normal quizzes (regular set of quiz questions with varying difficulty)
  • Adaptive quizzes (quizzes that tailors questions based on your assessed proficiency of the topic)

Team Page

Enables users to manage their classes and collaborate with classmates in a shared learning environment. Key features include:

  • Class Overview: Displays the number of members, total quizzes completed, and the average class score for group performance insights.
  • Member Statistics: View each class member's learning streak, quiz activity, and average score.
  • Invite Classmates: Easily expand your class with a shareable class code or email invitation.
  • Class Achievements: Motivational badges (e.g., Class Player) recognise group milestones and encourage consistent engagement.

Rankings Page

Displays user rankings based on quiz performance and streaks.

Technical Implementation

Client-side:

  • Next.js: React framework for building server-rendered and static web applications.
  • React: JavaScript library for building user interfaces.
  • TypeScript: Superset of JavaScript that adds static typing.
  • Tailwind CSS: A utility-first CSS framework for rapid UI development.
  • Shadcn UI: Reusable components built with Radix UI and Tailwind CSS.

Server-side:

  • Node.js: JavaScript runtime environment.
  • Express.js: Fast, unopinionated, minimalist web framework for Node.js.
  • SQLite3: Lightweight, file-based relational database.
  • Multer: Middleware for handling multipart/form-data, primarily used for uploading files.
  • PDF-Parse: A utility to extract text from PDF files.
  • Gemini API: Google's AI model for generating content, used here for quiz generation.
  • dotenv: Module to load environment variables from a .env file.
  • cors: Node.js package for providing a Connect/Express middleware that can be used to enable CORS with various options.
  • nodemon: A tool that helps develop Node.js based applications by automatically restarting the node application when file changes in the directory are detected.

Development Process

We began by sketching our mockups by hand, which allowed for collaborative discussion on UI components and their placement. This approach also helped us visualize the overall user flow and identify the key functionalities required for our application.

Future Improvements

Currently, our application supports quiz generation only from text-based PDFs. In the future, we plan to enhance its capabilities by incorporating support for visual content (e.g., diagrams and images) and auditory notes, enabling multimodal quiz generation. In addition, we plan to enable the creation of different question types (true/false, short answer).

Built With

Share this project:

Updates