Able to detect the structure and color correctly
Program architecture of the web application

Inspiration

Our team decides to tackle the Social Problem Statement as follows, "In a post-COVID-19 world where face-to-face interaction is no longer the main mode of communication, how would you revolutionise making new and/or maintaining relationships?"

In a post-COVID-19 world, due to the long period of safe distancing measures, there will be individuals who would find it more difficult to step out of their comfort zone and socialise. Currently, as a team, some of us face issues in communicating and making new friends with other people from attending online-based programmes such as the Freshman Orientation Programme. Our group aims to create an online icebreaker game that makes it easier to socialise and meet new friends online.

What It Does

The game is recommended for groups of >10 people. Players will be separated into groups.

When a new game starts, all groups will receive an identical incomplete mosaic picture, the goal of the game is to complete the mosaic picture. Different mosaic pieces will be given to each group, each member in the group will receive exactly 1 mosaic piece. They will have a choice to pick and swap mosaic pieces. Using the webcam, players will find objects with shapes and colour corresponding to their mosaic piece, they will fit the object within the outline shown on their live camera feed. If the object is successfully fitted and identified, the mosaic piece will be added to their incomplete mosaic picture. When all players in the group have completed their respective mosaic pieces, new mosaic pieces will be issued to them. The first group to complete the mosaic picture wins the game!

The game tackles the problem statement by ensuring the participation of each member of the group. Various shapes and colours of mosaic pieces are issued, some of which will be harder for individuals to find, trading mosaic pieces with their group members will make it easier to complete the game. A form of communication is necessary so that everyone can complete the task together as one. The game encourages teamwork and communication, it pressurises everyone to play his or her part in completing the rounds together so that their group can finish first.

How We Built It

Our team built it using a simple web application, making use of Google Firebase and Google Cloud Vision API. We made a web interface using HTML, CSS and JavaScript. Thereafter we used Google Firebase as a database to store the images we captured from the live webcam feed. These images will then be sent to Google Cloud Vision API to analyse the images and return the results. Using the Google Cloud Vision API allows us to be able to return the shape and the color of the image.

Challenges Faced

We were unfamiliar with some of the implementations using Google Firebase and Google Cloud Vision API. Therefore we had to constantly search online for samples and inspirations. However, many of them were not what we wanted and we had to try and solve it ourselves. The limited time was also a challenge as we were only given a day to complete what we wanted.

Accomplishments

Despite the short amount of time in this hackathon, it really brought out the best in us, and with a night of work, we managed to get our idea going and produced a prototype. What we learned As a team, we have learned various technical skills, from picking up programming languages to learning about machine learning. We have also learned to work better as a team despite it being an online discussion, that it is important to adapt and be able to achieve our intended outcome.

What's Next For Team Hackerrank

Currently, there is some online communication software such as the Zoom application which does not provide this functionality, and users will have to use third-party websites to play online games together. Hence, our team decides to integrate this feature (perhaps as a plugin) as part of the Zoom application. We are certain that in the near future, continued development will progress for this web application which will allow more communication and coordination among the team to feel more comfortable with an another and not feeling socially awkward online.