GentlePage — a browser extension that makes the modern web senior-friendly
What it is (TL;DR)
GentlePage is a browser extension that turns cluttered, hard-to-use webpages into clean, senior-friendly versions. It groups the important actions (like “Pay,” “Book,” “Call,” “Add to Cart”) and presents them in a simple, high-contrast layout with large tap targets and minimal distractions.
The problem
For many seniors, today’s websites are a maze: tiny buttons, pop-ups, sidebars, infinite menus, and ads everywhere. Essential actions get buried under a pile of UI noise, leading to confusion, misclicks, and abandoned tasks. We set out to make common tasks obvious, reduce cognitive load, and restore confidence online.
How it works
- Scrape & clean: The extension sends the current page’s HTML to our Python backend, which scrubs scripts/trackers and normalizes the DOM.
- Understand the page: With help from LLMs (ChatGPT & Gemini), we label key elements (primary actions, navigation, forms, contact paths) and infer the user’s likely goals.
- Generate a simple layout: We assemble a custom “gentle” layout: big primary buttons, readable typography, clear sections (Do this, Learn this, Contact), and optional details tucked away.
- Inject back into the page: The simplified HTML/CSS is injected client-side, preserving functionality while removing clutter. Users can toggle between Original and Gentle views at any time.
Key features
- Action hub: Prominent, grouped primary actions at the top of the page.
- Large, high-contrast UI: Bigger fonts, generous spacing, and accessible color contrast.
- Distraction filter: Hides ads, pop-ups, sticky sidebars, and non-essential widgets.
- Smart summaries: Optional page summary for quick orientation.
- Always-visible essentials: Search, Back, Help, and Contact stay fixed and easy to find.
How we built it
- Frontend (extension): JavaScript content scripts to capture page HTML, manage toggles, and inject the simplified DOM/CSS.
- Backend (Python): A lightweight API that sanitizes HTML, runs our element-detection pipeline, and orchestrates layout generation.
- AI assist (LLMs): ChatGPT & Gemini help classify elements, identify primary tasks, and draft the simplified structure, which we post-process to enforce accessibility rules (touch targets, headings, landmarks).
- Heuristics + rules: On top of the LLM output, we apply deterministic rules (e.g., expose a single clear primary action per view, collapse duplicate CTAs, elevate phone numbers and “book/call/pay” flows).
Challenges we ran into
- Ambiguous pages: Some sites bury the “real” action under modals or nested frames. We solved this with a fallback rule set and a safe Original view toggle.
- Maintaining functionality: Simplifying without breaking forms, carts, or logins required careful event forwarding and attribute preservation.
- Consistency across sites: We built a small design system to keep the Gentle view predictable regardless of the source site.
Accomplishments we’re proud of
- A real, clickable one-tap action hub that works across very different websites.
- A pipeline that blends LLM insight with strict accessibility guardrails.
- A painless toggle between Original and Gentle views so users always feel in control.
What we learned
- Accessibility isn’t just about contrast ratios—information architecture and reducing choices matter just as much.
- LLMs are great at intent detection, but pairing them with conservative UI rules avoids surprises.
What’s next
- Personalization: Let users pick larger text sizes or an “extra simple” mode.
- Task presets: Shopping, booking, payments—pre-tuned layouts for common tasks.
- On-device mode: More processing locally for speed and privacy.
- Keyboard/voice: Full keyboard navigation and optional voice prompts for core actions.
Try it
- Install the extension, visit a busy site (news, ecommerce, government portal), click “Gentle View.”
- Use the Action hub to finish a task—checkout, book an appointment, or find a phone number—without the noise.
Log in or sign up for Devpost to join the conversation.