StudySpark AI

An AI study assistant that turns any lesson into simple explanations, quizzes, flashcards, and personalized study plans in Arabic and English.

Comment

Inspiration

Students often spend more time organizing their notes than actually studying. Long or unstructured lessons can make it difficult to identify the most important ideas, test understanding, and decide what to review next.

I created StudySpark AI to transform any lesson into a focused and personalized learning experience. Instead of only generating a summary, StudySpark follows the learner through a complete adaptive learning cycle and creates a study plan based on their actual quiz mistakes.

I also wanted the platform to be accessible to Arabic-speaking students, so StudySpark supports both Arabic and English, including RTL layouts and Arabic learner-facing AI content.

What it does

StudySpark allows a student to paste a lesson and choose:

  • The content language
  • Educational level
  • Study goal

It then generates a complete study kit containing:

  • A clear explanation
  • Key concepts
  • Flashcards
  • Multiple-choice quiz questions

After the student completes the quiz, StudySpark:

  1. Calculates the score deterministically.
  2. Identifies the topic IDs connected to incorrect answers.
  3. Explains the learner’s weak areas.
  4. Generates a prioritized personalized study plan.
  5. Provides practical tasks, suggested durations, and measurable outcomes.

The platform also includes:

  • Arabic and English support
  • RTL support
  • Dark, light, and system themes
  • Persistent quiz progress
  • Responsive design
  • Safe error and retry states

How I built it

I built StudySpark using a separate frontend and backend architecture.

Frontend

I built the frontend with:

  • HTML
  • CSS
  • Vanilla JavaScript
  • JavaScript modules
  • LocalStorage

The frontend handles lesson input, form validation, language and theme preferences, study-kit rendering, flashcards, quiz interaction, deterministic scoring, saved progress, results, and personalized study-plan rendering.

Backend

I built the backend with:

  • Python
  • Flask
  • Flask-CORS
  • Pydantic
  • Google Gemini API
  • Pytest

The backend workflow:

  1. Validates the lesson request.
  2. Analyzes the lesson.
  3. Generates structured study content.
  4. Validates the Gemini response using strict Pydantic models.
  5. Receives validated quiz results.
  6. Extracts unique weak-topic identifiers from incorrect answers.
  7. Generates a personalized study plan.

Gemini uses structured JSON output. API keys remain in backend environment variables and are never exposed to the frontend.

Challenges I faced

One major challenge was making structured AI responses reliable.

Strict Pydantic models generated additionalProperties fields that were not accepted by the Gemini structured-output endpoint. I solved this by creating a reusable recursive schema-cleaning function, sending the cleaned schema through response_json_schema, and still validating every returned response with Pydantic.

Another challenge was managing browser state. Previous lessons, quiz answers, results, and study plans could appear during a new learning session. I solved this by creating a clear LocalStorage contract for:

  • Active lesson
  • Unsubmitted lesson draft
  • Study kit
  • Quiz state
  • Quiz result
  • Personalized study plan

Arabic support also required more than translating labels. I implemented RTL behavior, Arabic AI instructions, Arabic quiz and study-plan content, and the Cairo font.

I also encountered Gemini free-tier quota limits. StudySpark now safely handles these failures, preserves the student’s draft, and prevents backend stack traces or API secrets from reaching the frontend.

Accomplishments that I am proud of

I am proud that StudySpark is not only an AI summarizer. It creates a complete adaptive learning loop:

Lesson → Study Kit → Quiz → Deterministic Evaluation → Weak-Topic Analysis → Personalized Study Plan

Other accomplishments include:

  • Full Arabic and English support
  • Secure server-side Gemini integration
  • Strict request and response validation
  • Deterministic quiz evaluation
  • Personalized plans based on actual mistakes
  • Saved quiz progress and results
  • Safe handling of AI-service failures
  • Responsive dark and light interfaces
  • Automated backend tests

The completed backend test suite passes all implemented tests covering schemas, API endpoints, structured-output cleaning, quiz-topic extraction, and error handling.

What I learned

Building StudySpark taught me that reliable AI applications require more than sending prompts to a model.

I learned how to:

  • Design multi-stage AI workflows
  • Validate generative AI output
  • Separate deterministic logic from AI reasoning
  • Build secure API integrations
  • Handle quota and service failures
  • Design bilingual RTL interfaces
  • Manage state across multiple pages
  • Test AI-powered services without depending on live API calls

Most importantly, I learned that educational AI should respond to demonstrated learner needs rather than simply generating more content.

What's next for StudySpark AI

Future improvements include:

  • Student accounts and learning history
  • Progress analytics across lessons
  • Spaced-repetition scheduling
  • Targeted follow-up quizzes
  • Teacher dashboards
  • PDF and document uploads
  • Voice-based lesson input
  • Cloud deployment
  • Additional languages
  • Optimized AI calls to reduce API usage

My long-term goal is to make StudySpark a practical learning companion that helps students understand what to study, why they need to study it, and what action to take next.

Built With

Share this project:

Updates