Kagaz AI

Inspiration

Every academic year, educators around the globe spend hundreds of thousands of collective hours manually grading paper worksheets. This administrative burden leads to widespread teacher burnout and creates a massive delay in providing students with actionable feedback. Furthermore, while digital testing platforms exist, they fail to accommodate the pedagogical advantages of raw, handwritten problem-solving—especially in math, science, and foundational early education.

We were inspired to build Kagaz-AI to bridge this exact analog-digital divide. By turning a simple smartphone photo of a handwritten student worksheet into a rich, structured pedagogical critique instantly, we aim to eliminate classroom paperwork while keeping the core human elements of writing and drawing intact.

What it does

Kagaz-AI is an automated educational evaluation platform designed to give teachers macroeconomic classroom intelligence alongside micro-level student diagnostics.

• Handwritten OCR Processing: Teachers simply capture or upload images of handwritten worksheets directly through the Next.js web application.
• Intelligent Grading & Gap Tracking: The system transcribes the handwriting, parses the student's methodology, runs it against target answer criteria, and calculates granular scoring distributions.
• Pedagogical Insight Engine: Instead of just declaring an answer "right or wrong," the platform identifies the exact step where a misconception occurred (e.g., systemic arithmetic errors vs. conceptual formula misapplications).
• Macro Classroom Dashboards: Aggregates real-time student data into a macro intelligence layer, visually mapping out which concepts require immediate whole-class remediation.

How we built it

Kagaz-AI is engineered using a robust, highly decoupled, asynchronous full-stack architecture contained within the haroon2109/kagaz-ai repository:

• Frontend: Built using Next.js and styled cleanly with Tailwind CSS and Shadcn UI components. We designed dedicated modules like WorksheetGrader.jsx, class-analytics.jsx, and camera-capture.jsx to ensure smooth, responsive teacher workflows.
• Backend Framework: A high-performance FastAPI application structured to expose scalable RESTful endpoints for student/teacher authenticated workflows and document management.
• Asynchronous Processing Layer: Because OCR transcriptions and Multimodal Large Language Model evaluations are computationally heavy and time-intensive, we implemented an asynchronous task pipeline using Celery backed by a Redis message broker. This ensures that the frontend remains completely interactive while backend background workers grade papers in isolation.
• Data Flow & Storage: Handled via structured models for worksheets, teachers, and student metrics, alongside customized image compression hooks to optimize processing speeds before files hit the evaluation pipeline.

Challenges we ran into

One of our biggest hurdles was handling the raw volatility of user-uploaded images. Real-world classrooms yield crinkled paper, inconsistent lighting, dark shadows, and diverse handwriting styles. Initial synchronous API calls frequently timed out when handling multiple high-resolution multi-modal image prompts back-to-back.

We solved this performance bottleneck by building a custom image compression engine on the client side (image-compressor.js) and completely shifting the core grading architecture to an asynchronous Celery task worker pattern (celery_tasks.py). This prevented the FastAPI application from blocking traffic and allowed the user interface to render beautiful skeleton loading states while tasks executed behind the scenes.

Accomplishments that we're proud of

• Production-Grade Queue Integration: Successfully implementing a robust Celery background worker system, proving that the app can scale beyond a toy prototype to handle actual classroom concurrency loads.
• Multimodal Pedagogical Translation: Crafting structural JSON evaluation sheets directly from messy, unformatted handwriting images.
• Elegant Data Visualization: Constructing a beautiful, intuitive Next.js dashboard that visualizes dark, complex relational classroom gap analytics into simple, scannable data grids.

What we learned

Building Kagaz-AI taught us the immense value of Vibe Coding combined with strict software engineering practices. We learned how to deeply optimize full-stack asynchronous states and coordinate complex state transitions between Next.js hooks and FastAPI backend tasks.

Furthermore, we reinforced our mathematical modeling mindset by learning how to abstract human pedagogical evaluation criteria into strict programmatic constraints, ensuring the AI engine remains objective, unbiased, and technically precise.

What's next for Kagaz AI

The immediate roadmap for Kagaz-AI focuses on scaling its impact and refining accessibility:

• PDF/CSV Analytics Exporter: Allowing teachers to instantly print or email localized performance summaries directly to school administrators or parents.
• Offline Storage Capabilities: Finalizing the local storage infrastructure (offline-storage.js) to support educators working in low-connectivity environments, syncing local drafts back to the cloud once an internet connection is established.
• Fine-Tuning Localized Multi-Modal OCR: Training lightweight, open-source edge models to handle multilingual handwriting styles, reducing heavy dependencies on external closed proprietary APIs.

Built With

• cloud
• css
• fastapi
• gemini
• github
• next.js
• ocr
• python
• react
• vercel