Umzies (012)

• 

  Lifehack-Umzies

Inspiration

Due to COVID-19, schools around the world have had to pivot towards Home-Based Learning (HBL). While schools have largely adapted well through the use of video-conferencing technologies such as Zoom and Microsoft Teams, we find that social interaction among students is still starkly lacking.

During the past 2 “online-semesters”, many students felt lonely. Without organic social interactions arising from physical tutorials and lectures, it is difficult for students to find friends within their modules. As such, many do not have a study support group with which they can collaborate with, hindering learning.

To combat this, we sought to provide a solution that allows NUS students to easily find and connect with friends who are enrolled in the same modules as them. Through this, we hope to build a more collaborative and interactive learning environment amid the pandemic.

What it does

Our website serves as a one-stop platform for students to find friends who are taking the same modules easily. The features of our application include, an authentication page where students are allowed to sign up and sign in to their accounts, a “Find a Friend” feature where students may view and connect with a list of people taking similar modules as well as a “Find a Group” feature where students may join other groups with their friends.

Main Features

Main Features: 1. Landing Page - Sign up / Log in button 2. Sign Up Page - Fields: Email, Password, Name, List of modules (dropdown), Telegram user ID, Self-intro 3. Log In Page - Fields: Email, Password 4. Home Page - Display current pairs and groups, Find a friend, Find a group button Find a friend: When users first sign up, they will not be allowed to join a group. Instead, they have to connect with one other person first to form a pair, before they are allowed to form a group with other pairs on the site. Find a Group: After users have their pairs, the pair may find another pair which takes similar modules to form a group. 5. Find a Friend - The Find a Friend page shows a list of other users and the common modules they have in common with the user. The user may connect with any of them and this should link them to the “Join Chat” page on Telegram. 6. Find a Group - Users may then join other pairs to form a group. The Find a Group page allows a user to select the pair he/she wants to form a group for. Then, users will be redirected to a page which lists all other pairs and the number of common modules with the user’s selected pair. They may then join the other pair, and they should be redirected to the “Join Chat” page on Telegram, where the chat would comprise both pairs.

How we built it

Our team developed a website using Vue.js. The website was configured to easily link users to their Telegram accounts for easy communication. This method was chosen as opposed to a Telegram bot as it allows for an easy-to-use front-end user interface to be developed. Our back-end was established using Firebase and the website is hosted via Heroku.

Challenges we ran into

One of the challenges we faced was developing a program to ensure that students actively participate and do not “ghost” the groups that they join. By enforcing hat the user finds a partner (friend) before they are allowed to find a group with their new friend, it encourages active participation in the chats/groups they join without having to worry about being awkward/shy (since they would be joining up with other pairs with their friends).

Accomplishments that we're proud of

Given that it was my team’s first time competing in a hackathon, we were extremely surprised that we managed to complete the entire ideation and web development process within a short time span of 24 hours. We were able to efficiently allocate work among the 3 of us, allowing us to complete all the different functions of the website within such a tight timeline. This was definitely a great first-hackathon experience!

What we learned

Throughout this hackathon, we managed to significantly improve our technical skills. This was especially so since all 3 of us do not come from a software engineering background. Hence, prior to this hackathon, we had limited experience with full-stack development.

Additionally, we picked up many soft-skills such as project-management within a tight timeline. This involved active communication and learning to prioritise the development of certain features over others.

What's next for Umzies (012)

Future stages of this project could include extending the product to account for other schools. Additionally, beyond connecting students based on the modules they take, we can also consider connecting them via their career interests, past internship experiences and hobbies. Additionally, we plan on further improving the user-interface of the website, ensuring that it is user-friendly and visually attractive.

Built With

• css
• firestore
• heroku
• html
• javascript
• vue