Inspiration
The web claims to be universal, but it often overlooks users with cognitive, visual, or attention-related differences. We were frustrated by how many "accessibility" tools are just one-size-fits-none fixes, like adjusting font size or switching to dark mode. We wanted to create something that recognized that true accessibility is about personalization. Everyone should be able to experience the web in their own language, tone, and format, whether they're neurodiverse, visually impaired, or feeling overwhelmed.
What it does
Universal Adaptive Web Layer (UAWL) is a browser extension that changes any website into a version customized to the user’s specific accessibility and cognitive needs.
Features include:
Cognitive Adaptation: Automatically simplifies dense content for users with ADHD, dyslexia, or neurodiversity.
Visual Support: Adjusts fonts (like OpenDyslexic), contrast, and spacing for better readability.
Voice-First Mode: Allows users to navigate and consume content using only voice; no mouse or keyboard required.
Child-Friendly Mode: Instantly converts content into age-appropriate summaries.
Emotion-Sensing (optional): Detects confusion or stress via webcam and shifts the interface to calmer, simplified versions.
URL-to-Universal: Just paste a link, and UAWL instantly creates an adaptive version.
How we built it
Frontend: React and Chrome Extension API for injecting adaptive overlays.
AI/NLP: Used OpenAI and HuggingFace models for text simplification, summarization, and reading level adjustments.
Voice Interface: Web Speech API for speech-to-text and text-to-speech.
Accessibility: OpenDyslexic fonts, ARIA standards, and layout reflowing.
Emotion Layer (experimental): OpenCV facial emotion detection for adaptive mode switching.
Challenges we faced
Ensuring layout consistency while transforming DOM elements in real time.
Balancing personalization with usability; some users prefer minimalism while others like enhanced visuals.
Speed versus adaptability; AI transformations can be slow, so we had to optimize models and revert to simpler logic when necessary.
Making the extension universal; some websites break when you overlay or rewrite content dynamically.
Accomplishments we’re proud of
We built a functioning Chrome extension that can instantly adapt websites.
We successfully integrated multiple modes: child summaries, dyslexia-friendly layouts, voice browsing, and even emotion-based switching.
We created a user flow that requires no technical knowledge; users just paste a URL and go.
We received genuine “wow” reactions during testing from users with neurodiverse needs.
What we learned
Accessibility isn’t a checklist; it’s an experience that needs to be fluid and adaptable like the users themselves.
Even simple changes like switching fonts or decluttering layouts can significantly improve user comfort and understanding.
Combining AI with user experience thinking can create powerful tools for inclusion, especially in educational and professional settings.
Hackathons are the best place to challenge long-held beliefs about what a "normal" web experience should be.
What’s next for Universal Adaptive Web Layer (UAWL)
Expand to mobile browsers and PDF/document reading.
Add multilingual translation so users can access adapted content in their native language right away.
Build a user profile system to remember preferences across devices and sessions.
Collaborate with schools and accessibility organizations to integrate UAWL into education and digital literacy programs.
Turn UAWL into a public open standard that others can use, making adaptive user experience a default, not an afterthought.
Built With
- aria-accessibility-standards
- chrome-extensions-api
- huggingface-transformers
- javascript
- openai-api
- opencv
- opendyslexic-fonts
- react
- web-speech-api
Log in or sign up for Devpost to join the conversation.