ReadAble

ReadAble Extension
Readable extension - Sidebar
Readable extension - Sidebar 2

Inspiration

Of all Americans with disabilities, about 75% of them use the internet daily*. We were inspired by the lack of accessible and customizable tools available for web users.

What it does

ReadAble provides multiple accessibility features for users to have while browsing the internet. These accessibility features help anyone. These includes reading aids like reading mode, customizable fonts and sizes, focus timers along with goal settings, and Text to speech feature.

How we built it

We built ReadAble using React for the user interface and was mainly handled in JavaScript. We used Chrome's extension APIs to interact with the browser and manipulate its elements. The accessibility components were implemented using content scripts to inject styles into the page.

Challenges we ran into

A challenge we ran into were implementing some accessibility features were only functioning in the extension portion of the browser and not the actual webpage. To fix this, we had to inject the styles into the page using content scripts.

Accomplishments that we're proud of.

We're proud of creating an impactful extension helping users focus better and counter disabilities.

What we learned

We learned how to create a chrome extension using React and JavaScript.

What's next for ReadAble

Implementing a select text menubar which offers a wide range of functionality including, speak selected word, picture dictionary, search up words, and translation feature. We also want to provide a better UI experience with improved designs.

*From link