Echo-Lingo

Inspiration

When brainstorming, we thought of current challenges students and other technology users may face. One of our group members mentioned that she has difficulty concentrating when reading long class materials. This sparked an idea to create a text-to-speech chrome extension, allowing for an effortless and hands-free learning approach. Additionally, we wanted to make it accessible for visually impaired users and those learning English as a second language, helping with text pronunciation and comprehension.

What it does

Our Chrome extension allows users to convert text into speech seamlessly. Users can copy and paste text into the provided text box and press play to hear it read aloud. This enhances accessibility and productivity, making it easier to consume written content.

How we built it

For the design, logo and media, we used Figma and ProCreate. Then, for the front-end aspect, we used React, Vite and Tailwind CSS. For back-end, we used express.js. Finally, for the text-to-speech API, we integrated the SpeechSynthesis Web Speech API. We have also deployed the extension to the Chrome Web Store, but it will take a couple business days to be reviewed.

Challenges we ran into

Implementing automatic text selection as input for the extension
Ensuring smooth API integration and communication between the client and server
Syncing the extension with web pages for real-time usability
Keeping the API key secure
Trying 4+ backend technologies
Endless merge conflicts
Making 8+ repos :(((((

Accomplishments that we're proud of

Went through many challenges, bugs and other issues but are still proud to submit a working project
Learned about chrome extensions: none of our group members have worked on them before!
Brainstormed and properly chose the best API to use

What we learned

API Integration and authentication, managing requests, and handling responses efficiently
Chrome extension development
Client-server communication
Good security practices