As a huge basketball fan, I noticed it was difficult to connect with others online. The COVID-19 pandemic has made it virtually impossible to do so, as everyone is afraid of getting sick. Correspondingly, finding basketball courts that are safe from covid and kidnapping incidents is a very difficult task. Also, finding a user-friendly site with NBA players is difficult as well. Thus, someone needed to create a "Hub" for basketball fans. As a result, BallHub was born!

What it does

BallHub is the one-stop shop for basketball fans! You can view players through the "Home" page, as well as filter them by skill level, chat with other people interested in the sport online, using the "Discuss" option, and use ML to predict your favourite player's points next game! In addition, you can click on "SafeMap" to view basketball courts in the area based on safety metrics, such as COVID and kidnapping. Not to mention, you can experience AR on your mobile devices!

How we built it

Using the Qoom platform, I created various pages using HTML and CSS. Furthermore, the machine learning investigation on player points was accomplished through Google Collab using the python language, coupled with the Scikit-Learn library. As a matter of fact, I used python mining to create the basketball player database. Moreover, I integrated the ML findings in the "Predict" tab using Javascript. In addition, the basketball court model was designed using TinkerCad, and was then converted into an AR experience using EchoAR. The SafeMap was made using the Maps API. Lastly, the chatting functionality was accomplished through the SocketIO Javascript library. Overall, BallHub was created using a variety of tools, frameworks, libraries, and technologies.

Challenges we ran into

When I started this project, I was a beginner in HTML and CSS. As a result, I found it difficult to style my pages and create a user friendly design. By the same token, I did not have much experience with connecting the back-end to the front-end, which made completing the "Predict" page a task.

Accomplishments that we're proud of

I am proud of the fact that I was able to incorporate numerous features into my website, all using code. In particular, I am happy that I created clean pages in HTML and styled them well using CSS. To the same extent, I am pleased with the fact that I created a responsive UI, which automatically readjusts to smaller/bigger screen sizes using the "@media" query. Similarly, I am proud that fans can chat with other fans online, all through one site. Lastly, I believe that the predict feature allows the user to get more invested in the game, since they would like to see how close the ML prediction was to the actual result.

What we learned

In my opinion, the biggest thing I learned was the proper usage of HTML and CSS in websites. I found it to be pretty amazing that impressive sites can be built using those languages. Thanks to this experience, in the future, I will easily be able to perform web design as I now have the necessary experience and skills to officially add HTML/CSS to my tool belt.

What's next for BallHub

The next step for this project would be adding more players and creating different chat-channels for various types of conversations, such as "Favourite Players" or "Game Predictions". Not to mention, adding more features, experimenting with various ML models, and improving the point predictions. Finally, I would like to add more basketball court data in the SafeMap, for a wider outreach to users across the world.

Share this project: