AltSpeakify

No alt text? No problem - just AltSpeakify it! This extension helps those who are visually impaired better navigate the web.

Comment 2

Inspiration

I was inspired when I saw a social media post contemplating the lack of alt text available for many images across countless websites. Even on social media, many people are pushing for regular users to attach "alt text" to any media they upload. However, many people fail to provide accurate/significant alt text, if at all.

What it does

This extension communicates with a vision compute (image "describer") AI through a third-party API. This API responds with a detailed description of the image. This description is then passed to a speech synthesis (text-to-speech, aka "TTS") API, which responds with the audio explaining the image.

How I built it

This extension was made in Javascript, with some aspects like the popup/settings page being made with HTML and CSS.

Challenges I ran into

Manifest V3 is Google Chrome's new "extension platform", and it is notoriously terrible. This new manifest version may bring important security changes to the platform, but it makes creating certain extensions unbelievably difficult and tedious. I could have easily made this extension in the deprecated "V2" manifest version, but such an extension would not be supported on the Chrome store.

Accomplishments that I'm proud of

I'm proud to present a (mostly) working accessibility extension that will soon be published on the Google Chrome Extensions store/catalog. I hope the extension will make browsing the web an easier and more comfortable experience for those with visual impairments.

What I learned

  • Learning some basic HTML
  • Learning some (very) basic CSS
  • Learning some JS

What's next for AltSpeakify

  • Bug fixes! So many bug fixes!
  • Better "voice ID" picker for ElevenLabs (drop-down menu instead of text box)
  • Configurable volume settings for the audio (error sound, wait sound, describe TTS/alt txt, etc.)

Built With

Share this project:

Updates

posted an update —

The "gh.gcpins.dev" link does not work on Clemson University eduroam network! This is due to a URL filtering service incorrectly flagging the domain. This should be fixed within 30 days of this post going out.

Also, AltSpeakify is in the process of being approved for the Chrome store! I will post the link here once it is published! For now, follow the installation instructions on the GiHhub!

P.S.: Eventually, I will release a version of this extension that works across more browsers (this would likely use "Manifest V2" or another framework).

Log in or sign up for Devpost to join the conversation.