-
-
-
Prompt which appears after the extension is clicked
Inspiration
At the hackathon, we realized we all shared a similar challenge: our parents struggled to read long online articles, either because of age-related difficulty or language barriers. Wanting to make the web feel less overwhelming for them, we created SummaWeb, a tool that turns complex pages into simple, easy-to-understand summaries. As we built it, we realized that reading struggles aren’t limited to older adults, so we adapted the design and formatting to also support people with dyslexia—using clearer layouts, friendlier wording, and accessibility-focused options. In the end, we built something that helps our families and makes reading more accessible for everyone.
What it does
SummaWeb takes any long or complex webpage and instantly turns it into a short, easy-to-understand summary. It rewrites the content in simple language, breaks it into clear sections, and formats everything so it’s easier to read for older adults, people with dyslexia, and anyone who struggles with long text. It basically makes the web more readable and less overwhelming.
How we built it
We built a small system consisting of a browser extension paired with a local Flask backend: the extension detects highlighted text, shows a floating action button over the selection, and when clicked sends the selected text to the backend which calls Google’s generative model to produce a concise, dyslexia-friendly summary; the extension parses the returned JSON (including handling cases where the model emits JSON-as-string), splits the summary into separate points, and displays each point in a small floating panel using a dyslexia-friendly webfont, while background logic manages injection/cleanup across tabs and frames and the backend provides a CORS-enabled JSON endpoint that normalizes model output and handles errors.
Challenges we ran into
Key challenges included reliably detecting and positioning UI over user text across many editing environments (standard pages, complex editors, and nested frames) while replacing deprecated caret APIs and falling back to robust text-node probing; ensuring the floating UI behaves correctly with scrolling and maintains event listeners without leaving stale state; injecting resources like fonts and styles into page context securely and making them available to page scripts; handling cross-origin and mixed-content issues so the page can fetch results from a local service; making backend calls resilient to variable model output (including JSON encoded as strings) and normalizing that output for the UI; coordinating enable/disable and cleanup across multiple tabs/frames and avoiding uncaught messaging errors; and designing the UI/flow to be accessible and readable (dyslexia-friendly) while keeping performance and error handling tight.
Accomplishments that we're proud of
Our hackathon accomplishments include building a seamless UI and background pipeline that automatically detects user-selected text, sends it through an optimized summarization model, and returns clean dot-jot insights in real time. Throughout the process, we learned how to fine-tune and optimize API usage, handle unpredictable model output, and design a smooth user workflow that feels natural inside the browser. These achievements highlight not only our technical skill but also our adaptability. We overcame integration challenges, refined the user experience, and delivered a polished, fully functional prototype under tight time constraints.
What we learned
The project is a very frontend based plugin with the backend being AI plugins. We've learned how to implement AI responses and present it to the user on the screen. We've learn multiple methods of creating a frontend view and the looks of the extension.
What's next for SummaWeb
Since SummaWeb is designed to assist elderly or dyslexic citizens in their ability to read. The next steps for SummaWeb are more debugging and test with possible bugs with the extension. After all the potential issues are fixed, the plan is to add more features such as eye protection mode, text to speech on both the summary and the original text and the final feature in consideration is a translation feature.
Log in or sign up for Devpost to join the conversation.