KEYBored

How often do you find yourself either stressed out or bored out of your mind? Play KEYbored and solve both problems by taking your frustration out on your keyboard for peace of mind.

Comment

Inspiration

During the pandemic, it has been difficult for students to manage their stress levels. It has often led to diminishing performances in academics and their daily lives. To help students relieve their stress, we decided to create an innovative web application that revolutionizes the stress ball, giving it a modern twist on the age-old product.

What it does

Our application helps relieve stress and boredom, hence the name KEYbored. It has 2 modes, float or gravity, which both create shapes whenever a key is pressed. In float mode, the blocks move without resistance, while in gravity mode, the blocks fall towards the ground. Both modes give a visually appealing graphical interface for users to spam keys and stimulate their nervous systems. This not only improves reaction time but reduces both stress and boredom.

How we built it

We created the application using ReactJS for our frontend and Flask for our backend with a MySQL database. We used python to connect to a remote Google cloud MySQL database to store information about the user providing them with their favourite and least favourite keys.

Challenges we ran into

Since we were developing with MySQL for the first time, it was expected that there was going to be a steep learning curve. We did face some early challenges with installation; it was mostly smooth sailing while connecting to a localhost. The challenge came to finding a viable online MySQL domain; after a lot of testing with multiple online databases, we ended up using a Google Cloud SQL Database to store user data. Another challenging portion was to connect our Flask app to our React.js frontend, as numerous errors stood as an immovable obstacle on our path to finish our project in time. Fortunately, through asking for help from mentors and sifting through numerous tutorials, we were able to overcome all our challenges and completed our app.

Accomplishments that we're proud of

Our group takes an enormous amount of pride in the fact that we were able to create such a visually captivating interface utilizing languages and tools that we had previously not used. Incorporating Matter.js into our React.js code to create our animations and using Material UI to display user statistics from our remoteGoogle cloud MySQL database (Thank you, Google!) is an impressive feat considering we had no prior knowledge of both of these tools.

What we learned

During Hack the North 2021, our group not only came out of the event with a finished product to be proud of but valuable experience in programming languages/technologies we had not yet learned, such as MySQL and connecting to the Google Cloud Database, Flask as well as Material UI and the Matter.js engine. We also learned how to create an interactive webpage by connecting our React.js front-end with our Flask backend, where we used Python to communicate with our database. The lessons we learned during this hackathon will help us immensely in our future development of KEYBored and other web applications.

What's next for KEYBored

In the future, we want to make KEYBored a more interactive experience by introducing a Leaderboard for all users displaying the top users who have been most dedicated in their mindless endeavour to press as many keys as possible, most common key pressed by all users, average keypress speed/minute as well as many other fun stats to give a more immersive experience. To accomplish this, we aspire to register our game as a domain. We can also add many fun functions such as generating a list of words generated by unscrambling user entered keys, adding a Tetris-esque game and head to head matchups between users to determine which user can spam the most keys per the given interval of time.

Share this project:

Updates