Accessibility Assistant Extension

Let's make the internet for everyone.

Comment 1

Accessibility Assistant Extension Inspiration

The inspiration for this project came from a desire to make the web more inclusive for people with disabilities. Accessibility is often an afterthought in web design, leaving many users excluded from experiencing the internet in its full capacity. By leveraging AI, I aimed to create a tool that empowers individuals with features like text simplification, text-to-speech, and speech-to-text capabilities, enabling a more accessible and enjoyable online experience. What it Does

The Accessibility Assistant Extension enhances web accessibility with the following features:

Text Simplification: Converts complex text into simpler language for easier comprehension.
Summarization: Provides concise summaries of long articles or pages.
Rewrite: Rewrites text in different tones or styles for better readability.
Text-to-Speech: Reads aloud text on the web, providing audio support for visually impaired users.
Speech-to-Text: Allows users to input text via voice commands, reducing typing effort.
Website Navigation: Users can voice commands like "Open Google" or "Navigate to YouTube," and the extension will direct them to the desired website.
Web Page Accessibility Enhancements:
    Contrast Adjustment: Toggles high contrast for improved visibility.
    Font Size Adjustment: Increases or decreases text size on the page.
    Dark Mode: Enables dark mode for reduced eye strain.
    Link Highlighting: Highlights all links on a page for better navigation.
    Line Focus: Adds a visual focus line to guide reading.

How We Built It

The project was built as a Chrome Extension using:

Frontend: HTML, CSS, and JavaScript for the extension interface.
Backend: Python with Flask to handle AI requests using the Google Gemini API.
AI Integration: Google's Gemini Nano AI model for text simplification, summarization, and rewriting.
Speech Recognition and Synthesis: Utilized browser-native APIs for speech-to-text and text-to-speech functionalities.
Content Scripts: JavaScript scripts to interact with and modify web pages for accessibility features.

Challenges We Ran Into

Learning Chrome Extension Development: As this was my first Chrome Extension, understanding how manifest files, content scripts, and background scripts work together was a steep learning curve.
API Integration: Setting up the Google Gemini API with proper authentication and handling edge cases was challenging.
Cross-Origin Restrictions: Dealing with CORS errors when making API calls required configuring both the backend and extension permissions.
Web Page Accessibility: Ensuring features like font size adjustment worked consistently across various websites with different CSS structures was tricky.
Speech Recognition: Implementing a seamless speech-to-text and voice command system that worked across browsers required significant debugging.

Accomplishments That I am Proud Of

Successfully built a fully functional Chrome Extension with advanced AI features that make the web more accessible.
Integrated multiple accessibility tools into one cohesive interface.
Overcame significant technical challenges, such as API authentication and managing browser limitations.
Created a user-friendly design that adheres to accessibility principles.
Implemented real-time voice navigation, a feature that feels intuitive and futuristic.

What I Learned

Chrome Extension Development: Gained deep insights into building and deploying Chrome Extensions, including managing content and background scripts.
AI Integration: Learned how to use and integrate APIs like Google's Gemini Nano for NLP tasks.
Accessibility Best Practices: Developed a better understanding of web accessibility needs and solutions.
Speech APIs: Learned to implement browser-native speech recognition and synthesis effectively.
Debugging Complex Systems: Enhanced skills in troubleshooting and debugging cross-system interactions between front-end, back-end, and APIs.

What's Next for Accessibility Assistant Extension

Accessibility Customization:
    Add user profiles to save preferences like font size, contrast, and dark mode.
Improved AI Capabilities:
    Expand AI features with more advanced rewriting styles and languages.
Browser Compatibility:
    Extend support to other browsers like Firefox and Edge.
Advanced Navigation:
    Incorporate AI-powered predictive navigation to suggest frequently visited or related websites.
Community Feedback:
    Gather feedback from users with disabilities to refine and enhance features further.
Open Source Contributions:
    Invite the open-source community to contribute and expand the extension's capabilities.

By working solo on this project, I not only grew as a developer but also contributed to a cause that has the potential to impact millions of users positively. The Accessibility Assistant Extension is a step forward in making the web more inclusive for everyone.

Built With

Share this project:

Updates