YourBubble is a website designed to partner with universities to provide students with accurate, real-time data regarding coronavirus cases on campus.
As students who were all on our respective college campuses this last fall, we were happy with the efforts our universities were making to combat the coronavirus, but not quite satisfied. We were aware there were still thousands upon thousands of kids who decided to stay home, to protect themselves against the virus. We felt that with a tool such as YourBubble, students could come to a college campus feeling both more informed, and safer. Having the ability to view accurate, real-time data from specific locations on campus gives students the information they need to feel protected, and confident about their health.
YourBubble takes coronavirus data straight from universities into its' own database, and displays this information to users in a clean, organized way. Students will be able to pick to either view an interactive map, showing coronavirus "hot-spots" on campus, or calculate a "Covid Risk Score", a score from 1-10, determining how safe it is to go to a certain location at a given time.
The primary languages used were python, javaCcript, html, and scss. We used firebase as a real-time data-base which YourBubble would fetch from. We used this data to run the covid risk index score algorithms.
CSS Styling and Concurrency using firebase. Retrieving Covid Data from the dashboard of universities. First time using mapbox
We ran into problems with the Barbajs transitions library not loading in our different node modules. We found out it was a known bug and we had to use evil eval in some scenarios to get by as recommended by the developers. We also had trouble getting correct information from universities as much of it is not easily acessabile through REST API, therefor we were forced to use a web driver to manually emulate human motions on a website.
We are proud of having developing an extremely clean UI given that none of our team members having any experience in any UI. We are also proud of incorporating real-time database updates from firebase into our front-end by listening to requests. On top of all that we added an interactable map that made the user experience much more enjoyable and presentable.
We learned how to design UI's that are specific to user's needs with no background in UI design. We also learned how to work with real-time databases and mapBox.js.
YourBubble was built to be expandable to colleges across the nation. By partnering with universities, and establishing our own server on which we can run our website and databases, YourBubble can truly become a useful tool for students coming back to college campus in the Spring of 2021.
We built YourBubble by collaborating on Pycharm's plugin "Code With Me", where, just like google drive, all 3 of our team members could work on code at the same time, without having to deal with constantly pushing and pulling code. We used Node.js, and firebase, to do most of the back-end for our website, and used free online fonts and images as our backgrounds and styling choices for our website.