Inspiration
The web is inaccessible for neurodivergent and low-vision readers. Bureaucratic pages — tax credits, benefits, application portals — are walls of dense syntax, buried deadlines, and inconsistent headings. Reader modes strip styling but keep the wording; they never rewrite or extract what to do by when. The ML Empowerment curriculum (https://mlempowermentfoundation.org/curriculum) teaches AI should be practical, ethical, and human-centered. So this build uses the LLM not as author but as a constrained accessibility layer, with person-first language and every claim verifiable.
What it does
Problem: readers with dyslexia, ADHD, or low vision — plus students, job-seekers, and families on deadline — cannot act on bureaucratic pages. Solution: ReadEasy restructures any page into clear formats. Paste a URL (or raw text for blocked sites) and get a split view: cleaned original left, accessible version right. Key features: Focus, Dyslexia/Bionic, Action checklist (tasks with urgency and verbatim deadlines as Step 2 of 4), Listen karaoke, ADHD micro-cards, Ask this page, Reading level with readability score, plus cosmetic toggles, history, and export. Target users: students and adults with dyslexia, ADHD, or low vision, plus educators and families navigating benefits and enrollment pages. Live demo: https://readeasy-ml.vercel.app — code: https://github.com/GhostInHex/readeasy/tree/hackathon/ml-empowerment.
How I built it
Technologies: Next.js 15, React, TypeScript, Mozilla Readability plus jsdom, OpenRouter LLM with fallbacks, browser speechSynthesis, Vercel (no database, no auth). One route owns the pipeline: Fetch → Clean → Restructure → Render. Fetch grabs HTML; Clean strips chrome deterministically. Restructure sends cleaned text to OpenRouter under a strict JSON contract (title, summary, reading time, actionItems, sections) from lib/llm/prompt.ts, with one retry and structured errors. Render is client-side via a mode registry. Curriculum applied: Fundamentals justified the non-AI/AI split; Prompt Engineering shaped the prompt and variants; Ethics set the hallucination ban and privacy design.
Challenges I ran into
First, ssa.gov returns HTTP 403 to server fetches, so a raw-text paste path runs the same restructure with no network. Second, the no-hallucination constraint: urgency derives only from page language, deadlines copy verbatim, and the original stays pinned beside the output. Third, demo reliability: cached fixtures (cleaned text plus screenshots) for the IRS, UT Dallas, and USCIS trio, schema-checked with verify:trio.
What I learned
Grounding is everything: action items are extracted, never inferred, and tests stub the LLM while exercising real HTTP-in/JSON-out behavior. Models drift unless scaffolded, so JSON constraints, variant rules, and fallbacks are load-bearing. Prompts are code: versioned, diffable, tested. And privacy is architecture — stateless, localStorage-only history, raw HTML never stored — while dignity is wording.
What's next
Next is pre-caching a school aid office's ten most confusing pages, adding multilingual variants, and publishing readability-delta benchmarks per fixture. The curriculum journey continues: keep every requirement, deadline, and amount while making every sentence easier.
Built With: Next.js 15, React, TypeScript, OpenRouter, Mozilla Readability, jsdom, Vercel, browser speechSynthesis. Curriculum: https://mlempowermentfoundation.org/curriculum.
Provenance
Built on the ReadEasy Buildverse base (Sep 1–6) and extended for the ML Empowerment Build Challenge 3.0 after completing the Learn AI curriculum, with curriculum-grounded prompt, grounding, and ethics work.
Built With
- jsdom
- mozilla-readability
- next.js-15
- openrouter
- react
- typescript
- vercel
Log in or sign up for Devpost to join the conversation.