Inspiration
We wanted to create an app that was easy to use and that solved a common problem. Inspired by the 123Loadboard challenge, we decided to address the issues of boredom, loneliness, and feeling unproductive while driving😞 and staying awake while driving💤 faced by carriers.
Podcasts can be both educational and entertaining; the presence of other voices can help make listeners feel less isolated, creating social wellness. This makes podcast listening the perfect solution to issues of boredom, social isolation, and unproductivity. A hands-free podcast generator app would be accessible and usable, plus it would introduce users to new podcasts they may enjoy.
What it does
Chatterbox selects a podcast and plays it for you based on your requested genre. Voice commands allow hands-free control of what podcasts to play and when to play or pause. This way, carriers can control what they want to hear, so they can stay awake while being entertained or informed while driving. Users of all kinds can also benefit from Chatterbox. Voice controls in addition to buttons on-screen provide ease of accessibility. Gone are the days when you don't know what to listen to, as Chatterbox generates podcasts for you depending on what genre you're feeling.
How we built it
We used React, the Spotify API, and the web Speech Detection API to build the app. React handles our interface, the Spotify API is used to search for, load, and stream podcasts, and the Speech Detection API provides speech-to-text transcription we used to listen for commands like chatterbox pause and chatterbox next.
Available Commands
chatterbox pause - pauses the playback
chatterbox play - resumes playback
chatterbox next or chatterbox skip - goes to the next podcast in queue
chatterbox back or chatterbox previous - goes to the previous podcast in queue
chatterbox genre [genre] - plays and queues podcasts of the given genre
Challenges we ran into
Since there was no specific theme, it took a longer time to decide on what problem we wanted to tackle and what unique solution we could create. The Spotify API had many restrictions we had to work around, as well as many difficulties in enabling the functionality on mobile devices. The speech detection feature took the longest to implement, because we struggled with it either picking up too much or too little. For a while we had every single word resuming playback!
Accomplishments that we're proud of
We're proud of finishing this app in a short time frame, and implementing the spotify and voice control features. Neither of us had any experience with the Spotify or Web Speech APIs, so it was difficult but rewarding to learn how to use them.
What we learned
It was our first time ever using speech recognition, and we learned lots about React.
What's next for Chatterbox
We want to expand to music and make the app more compatible for all devices!
Built With
- css
- html
- javascript
- react
- spotify
- web-speech-api
Log in or sign up for Devpost to join the conversation.