DEV Community

Cover image for ExplainIt: Turning Complex Documents into Simple Answers
Akshaj Shetty
Akshaj Shetty

Posted on

ExplainIt: Turning Complex Documents into Simple Answers

This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend

What I Built

I built ExplainIt, a web app that helps people understand difficult or confusing documents.

The idea came from a simple situation: someone in your family receives a document — such as a medical report, lab result, or other technical document — and asks:

"What does this actually mean?"

ExplainIt lets them upload the document, extracts the text using OCR directly in the browser, and uses Gemma to turn that text into a simple explanation.

It supports English, Kannada, and Hindi, with optional voice playback.

I also wanted to be careful about uncertainty. OCR can misread text, especially numbers and tables, so ExplainIt is designed to avoid silently guessing or correcting uncertain values.

For medical documents, ExplainIt is an explanation tool, not a diagnostic or medical-advice system.

Demo

Live Demo

ExplainIt

ExplainIt

ExplainIt

Code

GitHub Repository

How I Built It

ExplainIt is built with Next.js, React, Tailwind CSS, Tesseract.js, Gemma, and Gemini TTS.

The core flow is:

Document
   ↓
Tesseract.js OCR
   ↓
Extracted Text
   ↓
Gemma
   ↓
Simple Explanation
   ↓
English / Kannada / Hindi
   ↓
Optional Voice Playback
Enter fullscreen mode Exit fullscreen mode

I use Tesseract.js to perform OCR directly in the browser. The original document is not sent to the AI model. Only the extracted text is sent to the server-side API for explanation.

Gemma is the core AI model behind ExplainIt's main feature. It takes the extracted document text and turns it into an easier-to-understand explanation.

The application also supports English, Kannada, and Hindi, and uses Gemini's text-to-speech capability for optional voice playback.

Why Does Open Innovation Matter?

For ExplainIt, the AI model isn't just an additional feature. It is what makes the main workflow possible.

Using Gemma, Google's open-weight model, gave me the ability to build the application around an openly available model rather than treating AI as a completely closed component.

That matters especially for independent developers and students. Open-weight models make it possible to experiment, build focused applications, and decide how the model fits into the product.

For ExplainIt, that meant I could take a specific problem — helping someone understand a difficult document — and build the application around that problem.

The project also combines open-source tools such as Tesseract.js with Gemma, showing how different pieces of open innovation can come together to solve a practical problem.

Prize Categories

  • Best Use of Gemma — Gemma is the core model used to transform extracted document text into simple explanations.

Top comments (0)