Accessify – Accessibility Tools for Everyone

• 

  Homepage of Accessify showcasing inclusive tools like Text-to-Speech, Speech-to-Text, Accessibility settings, and Help.

Inspiration

What it does

How we built it

Challenges we ran into

Accomplishments that we're proud of

What we learned

What's next for Accessify – Accessibility Tools for Everyone

Inspiration Accessify was inspired by the need to make digital experiences more inclusive for people with disabilities. Millions of users face barriers when accessing online content, especially those with visual, auditory, or motor impairments. Our goal was to create a beginner-friendly yet impactful AI-powered web application that supports these users in their daily tasks, using accessible, open-source technology.

What We Built We developed a simple, responsive website with five key accessibility tools:

Text-to-Speech Tool: Converts typed or pasted text into spoken voice using the Web Speech API.

Speech-to-Text Tool: Converts spoken audio into live text using browser-based voice recognition.

Dark Mode & High Contrast Toggle: Supports users with low vision or color blindness.

Keyboard Navigation: Allows users to navigate the entire site without a mouse.

Help Chatbot: A built-in chatbot that answers common usage questions using pre-programmed logic.

How We Built It We used React.js for the frontend, styled everything with Tailwind CSS, and integrated Web APIs like speechSynthesis and webkitSpeechRecognition for speech-based features. The UI is fully responsive and designed with accessibility-first principles: semantic HTML, focus outlines, aria-labels, large fonts, and big buttons.

We deployed the project using Vercel, making it available for real-world use instantly. All routes are SPA-compatible and designed for speed and accessibility.

What We Learned How to use the Web Speech API for real-time audio processing.

Designing for accessibility (ARIA, keyboard navigation, contrast modes).

Responsive UI/UX with Tailwind and React.

How to simplify AI concepts into beginner-friendly tools.

Challenges We Faced Ensuring speech APIs worked consistently across browsers.

Managing fallback options for unsupported features.

Balancing simplicity with functionality.

Testing accessibility features thoroughly across devices.

Built With

• focus
• html5-apis:-web-speech-api-(speechsynthesis
• languages/frameworks:-javascript
• react.js
• semantic-html
• tailwind-css
• webkitspeechrecognition)-deployment:-vercel-accessibility-tools:-aria