Inspiration

One of the biggest things that COVID took away from us was human interaction. Gatherings, parties, and get togethers were all cancelled because of COVID. This has led to many people isolating themselves from their friends. There is so much research discussing how healthy relationships and social interaction can improve our mental health leading to a better lifestyle. Our team thought that shooting texts and emails to your friends is meaningless, because their text or message can get lost in someone's inbox. Phone calls can also be insignificant and the conversations could also be meaningless. We wanted to help people maintain a healthy and meaningful relationship with their friends.

What it does

Our website LettrBox, is a platform where users can write digital letters and send it to their friends. Once a person signs up with their email they will be able to view the letters they have received as well as send letters to their friends. The user would be able to write a message and once they enter their friend's username that message is sent to their friend. Their friend would then be able to view that message on their own account.

How we built it

We built a mockup of the website using Figma. The Front-End of the website was built with HTML, CSS, JavaScript, and the Bootstrap library. The Back-End of the website was made with Firebase, Python, Flask, as well as deploying the website to the Google App Engine. We were able to create accounts/sign in people using the Firebase Authentication. We were also able to give users distinct usernames to each user and give ownership to different letters using the Realtime Database. Essentially, the whole sending/delivering letters was done with the Realtime Database. We also registered our domain name "lettrbox.online" with Domain.com.

Challenges we ran into

For half of our team, this was their first hackathon as well as first side project. Some of them were really intimidated and felt like they would not contribute to the project because the other half of the team have participated in many hackathons. Other than this being their first hackathon it was also their first time using HTML, CSS, and the Bootstrap library in a project. Some of our members ran into trouble learning and understanding the Bootstrap documentation because they were also learning HTML and CSS at the same time. It made some of them feel a lot of pressure because we had to complete a project under two and a half days as well as learn some new languages and frameworks. We also had trouble figuring out how to send letters from one user to another, and were stuck on how to complete this feature.

Accomplishments that we're proud of

As mentioned before, it the some of our members very first hackathon, and have accomplished so much in the short time. It was one of our member's first time ever creating a webpage. Some of our members were very proud of what they created because it was their first time being exposed to a web dev project, so it was their first time implementing a form, navbar, and etc. We were very pleased to see each web page interact with each other. It was also our backend engineer's second time implementing the Realtime Database, and they had to configure the website so one user could send a letter to another.

What we learned

We learned a lot about HTML, CSS, and Bootstrap. As well as how to utilize the Realtime Database in different ways.

What's next for LettrBox

We want to implement a way for users to add other users as friends, that way instead of having to input their friend's username, they could just send use a dropdown menu of their friends usernames and select from there. We also want to rebuild the UI to make it more visually appealing. Another feature we want to add is a way to see all of the letters one user has, as well as the ability to delete users. We also want to have some form of notification, just so a user could see when they have received a new letter.

Share this project:

Updates