WorkSafe is a web application that crowdsources user comments about workplace locations, and allows other users to scout out establishments to see if they are a welcoming environment.
WorkSafe was developed as part of PenApps2017, in the Social and Civic Hacking Route.
We actually were inspired to do this project from attending a Civic/Social Hacking Workshop. Before the workshop, our project was a smart closet, an ATM Wrestlemania game, less sketchy webMD, bikeshare route optimizer, and an auto-tour guide app. We were cycling through ideas like there was no tomorrow. At the workshop, we were challenged to narrow down ideas from big, broad concepts: no more "solve racism" or "make students better at handling money", but rather "focus on specific ethnic community integration" or "incentivize day-to-day recycling". One of the big concepts we were thinking of was dealing with gender inequality, but that is one of those big up-there concepts that's hard to pin down. In the workshop, we inadvertently realised that one narrow, but manageable issue is the idea of workplace harassment. Workplace harassment isn't just gender inequality though: it can be almost anything that makes employees uncomfortable, feel discriminated against, or feel directly attacked by.
To attempt to "solve" the idea of workplace harassment, we initially tried to figure out what problems caused workplace harassment. Obviously, there's huge ideas like societal bias, but dealing with that in a hackathon is very hard. But there's also another aspect of workplace harassment: information asymmetry. Basically, people who experience workplace harassment might not be familiar with what constitutes workplace harassment, or how to deal with it. They might not know that other people, all over the world, are facing the same problems that they are. Employers might not know that what they're doing is wrong, or that their employees are experiencing harassment. So, we aimed to make an application to remove that information asymmetry, and bridge that information gap.
We ran into a lot of challenges during development; here are a few:
- Figuring out an idea: we ran through more than 10 different ideas before settling on WorkSafe
- Learning web design: 2/4 of our group members were relatively new to web design, including general principles and using frameworks. But, they were able to learn on the fly!
- Differentiation: originally, our app was very similar to software such as Yelp; but, we added and brainstormed different features to make our app unique
- Co-operation: using version-control software, and working on different pages on the same time, was a big pain as a group of 4. There were many merge conflicts.
Through developing this app, our team members learned more about HTML and CSS, and how concepts such as block-level vs. inline elements or inheritance work, which is super awesome! In addition, they learned about how websites work, using Git and GitHub, and how to use terminal to install things (mostly through npm).
In addition, the fourth member had PenApps as their 2nd hackathon ever, and while they were a somewhat experienced web developer, they had never used Firebase. During the creation of this project, they spent many sleepless hours learning how Firebase works, and learning how to use it!
First, we need to install firebase. You'll need node for this (we used v7.4.0).
npm install -g firebase-tools
Then, let's clone our repo.
git clone https://github.com/malsf21/penapps2017.git
Finally, get into our directory, and serve our app with firebase!
cd penapps2017 firebase serve
Congrats, you've successfully built our site! Visit whatever address is outputted in your terminal to take a swing with our app.
We'd like to thank PenApps for holding an awesome hackathon! For our team members, this was an amazing learning experience, and a great way to meet other cool hackers. We learned a lot from developing WorkSafe, and we hope you enjoy using it!