Inspiration

From having to navigate campus in the dark, returning from 8:00 PM computer science classes, campus can seem scary. These struggles of having to find restrooms on campus with period products, traversing campus safely at night, and even finding inclusive spaces are experiences our team has been through on multiple occasions.

What it does

With ZotBright, we wanted to solve these issues with a multi-faceted website that allows you to open a map of our campus and see which restrooms have period products and which pathways are best lit/are dark. With features such as the sunset time, as well, users can plan their routes accordingly and stay safe. In the case that of immediate danger, we provided an SOS page where users can immediately call the UCI Police for help, alongside other health/safety resource numbers. With our period products feature, users can update whether or not restrooms they visit are stocked, using the Updates page.

How we built it

We built ZotBright as a web application using HTML, CSS and Javascript for the frontend coupled with PHP and Python for the backend. Our database of locations of paths and their brightness as well as the bathrooms and their period product availability is accessed using SQL. For the map we used the API from Leaflet.js.

Challenges we ran into

Since this was our very first hackathon and we do not have much web development experience, we were learning how to use HTML, CSS, Javascript, and PHP along the way. We were also relatively unfamiliar with version control using Git, so that, too, posed a challenge in the beginning and at certain points along the way. We were able to get a lot of the frontend up and running but the work that it took to connect things like Leaflet.js to the frontend or putting the backend in accessing the database together was difficult.

Accomplishments that we're proud of

This was our very first hackathon so we are very proud of actually getting a website up and running. We are proud of getting all the different technologies of frontend and backend together, since most of us have not worked with things like an API outside of school courses, only know Python and SQLite, and some of us have little experience in HTML.

What we learned

We learned about web development as part of an iterative design process and what the design process looks like for building a project from start to finish. We discussed the features that we wanted, delegated tasks, communicated when working, and learned about version control. In implementing our technology, we learned coding in various languages. We also learned how to work as a team.

What's next for ZotBright

We want to add extra features for women-owned businesses, with icons that show women-owned businesses so that we can support community that help our economy. We also want to add a walk with a friend feature, where we would allow you to send your destination to a friend and allow them to watch your walk there in real time for security.

Built With

css HTML Javascript PHP Python SQL git Github

Try it out

link Github repo

Share this project:

Updates