Crisislens

Emergency documents fail people at the worst moment. CrisisLens highlights urgency, translates jargon paragraph-by-paragraph into plain Odia/Hindi/English, and keeps humans in control.

Comment

Inspiration

I live in Kalahandi, Odisha. NH-56 runs through here, and accidents on that road are not rare. What stuck with me is what happens after the ambulance leaves: families go home with hospital papers in English they cannot read quickly, insurance forms with tight deadlines, and government letters full of words that sound official but mean nothing to someone reading under stress.

For USAII Challenge 1A (Crisis-to-Action Translator), I wanted to build something for that moment. Not another chatbot where the original letter disappears in a thread. A workspace where the real document stays on screen, and help shows up paragraph by paragraph in Odia or Hindi when the person needs it.

What I learned

I learned that "AI translation" is the easy part. The hard part is trust. If the app hides the source text or guesses urgency with the model, people will not rely on it when the stakes are real.

So urgency labels (CRITICAL, TIME-SENSITIVE, INFORMATIONAL) come from keyword rules, not from Gemini. Deadlines and medical terms get highlighted with regex before any LLM runs. The model only explains one paragraph at a time, with strict JSON output and a banner that says the original document is still the source of truth.

I also learned how much design matters for someone who is scared and in a hurry. Big touch targets, a mobile gist drawer, demo mode that works without an API key, and UI text in English, Hindi, and Odia were not extras. They were part of the product.

How I built it

CrisisLens is a Next.js 16 app deployed on Vercel.

  • /welcome: upload a PDF or TXT (up to 5 MB) or pick a demo document
  • /: landing page with three sample crisis letters
  • /viewer: 55/45 split pane on desktop (document left, analysis right); bottom drawer on mobile

Pipeline: parse text into paragraphs, classify urgency with rules, highlight jargon/deadlines/instructions, then on paragraph click either load pre-cached demo gists or call Gemini 2.5 Flash via /api/gist.

Demo mode is on by default so judges can open the app in seconds with no API key. Live mode uses GEMINI_API_KEY on the server for uploads and ?demo=false.

I used Google Stitch for the visual direction, Material 3 tokens in Tailwind, Vitest for core logic, and Playwright to capture production screenshots for the README.

Challenges I faced

Getting PDF text extraction working on Vercel serverless took longer than I expected (pdf-parse v2 API, size limits, empty scans).

Gemini live summaries were another headache. Environment variables on Vercel do not apply until redeploy, and a bad key or model name fails silently as a generic 500. Demo mode saved the project for the hackathon demo while I sorted production config.

Hindi gist coverage is still partial (Odia and English have full demo JSON; Hindi falls back to a template in v1). That is honest scope, not a stretch goal I pretend is done.

The biggest challenge was resisting the urge to make it look like a generic AI SaaS landing page. The final UI is closer to a plain document reader, which fits the use case better.

Built With

  • google-gemini-2.5-flash
  • google-generative-ai-sdk
  • lucid
  • material-design-3-(stitch)
  • next.js-16
  • pdf-parse
  • playwright
  • react
  • tailwind-css
  • typescript
  • vercel
  • vitest
Share this project:

Updates