Inspiration
The pandemic has deprived us of traditional social interactions where we had to think on our feet during conversations. With restrictions easing in Ontario, we can now get out and start talking to people once again However for someone like Shy Shane who spent his full quarantine Leetcoding, this may seem far too intimidating What if there was a solution to help us ease back into social interactions, something that would enable Shy Shane to speak more fluently Introducing BreakThrough a tool to empower individuals to become articulate and become more comfortable with thinking on the fly
What it does
Breakthrough immerses the user in a training session with a difficulty to suit each user's ability, to become more confident in rhythm and poetry (rap). The goal is to be able to include the given key word into your freestyle We can choose the difficulty level depending on how confident the user is. The harder the level, the faster the words are thrown at you.
How we built it
Figma Mockup Began with mockup and styled to match our desired interface Next.js & React provides all the features you need for production: hybrid static & server rendering, TypeScript support, smart bundling, route pre-fetching Automatic code splitting Hot Reloading Chakra-ui component manager Is a modular component library which allows us to create accessible React apps with a great user experience and smooth transitions as you saw in the demo
Light/Dark Mode add customizability and comfortable use to user Smooth transitions Accessible components for screen readers and for those vision impaired CI Pipeline Using Github actions, we Type check and format code on all pushes and commits Auto deploy pull request to make sure we don’t break production
Challenges we ran into
Fetching data to generate a random list of words.
Accomplishments that we're proud of
What we learned
What's next for Breakthrough
With the time constraints we had, we weren’t able to add all the features we wanted. In the future, we plan to further extend our product to include... Words will match the tempo of the beat. Choose words based off of word frequency and syllables A user can record their rap session and save the clip locally. A user can see a list of words that rhyme with the keyword. account based system where user sessions/recordings are stored and they can access their history, where they can play their previous rap sessions in the app. Store all data in the cloud with metadata DB and object storage DB Authenticate users and manage/store user sessions Securely store/encrypt user password
Built With
- chakra-ui
- nextjs
- tailwindcss
- typescript
Log in or sign up for Devpost to join the conversation.