Built in conjunction with the Girls in Tech Mental Health for All Hackathon: Building an inclusive future requires mental health and wellbeing technologies that cater to all
As a team of fullstack software engineers, our team decided on technologies that could produce a usable, scalable MVP version of the prototype.
- Figma
- Bootstrap UI Kit
- WAVE Web Accessibility Evaluation Tool Chrome Extension
- Web a11y guidelines - Design and Color
Introduction
According to an independent study by McKinsey and Company, “women of color are more likely to face disrespectful and ‘othering’ microaggressions”, which perpetuate workplace trauma. Black women are facing these issues at an alarmingly disproportionate rate.
We are often still expected to produce excellent work throughout these violent experiences and there is not a place for us to be free of judgement to share with other Black women who are also on the healing journey through workplace trauma, which can make us feel alone and lead to depression.
During the trauma, we may not realize that we need to track these instances or need a community. As such, these events often go unreported and our source for proof is defined based on memory alone.
We need a place that we can feel safe to share, or at the very least, keep track of these occurrences so that when the time comes, we will have a list of these things ready for us to make our case.
*SafeSpace.* also collects data on these issues for the world to see the impacts on Black women and how it hits companies’ bottom line. By tracking and fighting back in this way, we can help ourselves and other Black women know that they are not alone and that something must be done to stop workplace violence.
Purpose & Motivation
According to the McKinsey and Company study and our own constant personal experiences, as Black women, we experience more microaggressions than other groups of women, and are three to four times as likely as white women to be subjected to disrespectful and “othering” comments and behavior. We are also less likely to report that our managers check in on our well-being or help us balance priorities and deadlines.The motivation behind this application is two-fold. To provide a SafeSpace. for us to go in the midst of the violent behaviors we endure as a place for relief and centering and to document the incidents. In recording the incidents, not only do we name our trauma and record how we have handled and grown through our healing, but it also provides us with the documentation we need when we decide enough is enough and need to report the behavior.
How does the application work?
Users are able to join and sign into SafeSpace. anonymously by using their email address, which sends them a link to the email address they used to login to the application.When a user logs in for the first time, they are prompted to set up their username, password, and if they are a member of the LGBTQA+ community. Then, they are taken to a Conflict Assessment that tells them a little more about themselves. This also allows other users to see the type of the person with whom they are interacting so, when giving advice, commenters can frame the advice in a way that meets the requester’s style.
For every subsequent login, users are prompted to tell SafeSpace. how they are feeling after which, they enter the journal view where they can very quickly add an entry to their log to keep as reference for private use or to share with the community for advice.
The Journal is the central feature of this application because it allows Black women to keep track of work related trauma associated with different types of microaggressions and work through those at their own pace or have as a recorded reference for future use.
There are options for the user to check out the community posts, recommend stellar companies, add or find inspiration, and/or look through resources for support in their area.
How was the application developed?
As a team, we planned the application by creating user flows, a low-fidelity wireframe and data relationships. Then, we created a prototype in Figma. We built SafeSpace. using Next JS, styled-components, supabase as the database, React Bootstrap, Bootstrap 5, and React Select.We followed accessibility (a11y) guidelines using the WAVE Web Accessibility Evaluation Tool Chrome Extension and Web Content Accessibility Guidelines (WCAG) a11y guidelines.
How to use the application
Users can login to SafeSpace. on any device with an internet connection, create journal entries of workplace microaggressions, follow, comment, and react to community posts, view resources and inspiration, and recommend companies that are doing diversity, equity and inclusion right.Difficulties & Challenges faced during the design and/or development process.
Ensuring that we all were on the right path for the outcomes of the app because it is easy to slip into the social media path, but we intentionally worked as a team to define who and why the app exists and the how and what was easily obtained.Meet the Team
Lead | Dr. Teresa Vasquez
I am Dr. Teresa Vasquez, but you can call me Dr. T. If I could go back in time and talk with that little girl in the picture, I would tell her that although she had already experienced immense loss at her young age, there was much more loss to come from an industry that she would grow to love and that SHE would become a change agent after 20+ years in tech. She, as a tech leader, would own her trauma and demand healing for herself and other Black women like her. That she would accomplish so much more than she ever dreamed because beauty comes from ashes and she would create SafeSpace. with a group of like-minded Black engineers so that all Black women could embody their full potential and dreams along their way to healing.
Front End | Jeressia Williamson
My name is Jeressia Williamson and I am a software engineer currently living in Nashville, TN. I have been in love with technology for as long as I can remember, but I have only worked in this industry for 2 years. In my spare time, I am a creative. I like to do anything that involves making something: I code, I paint, I build furniture, and I’m heavily interested in interior and graphic design. I have 2 dogs, Java & Jumanji, that help keep me active. As a former mental health social worker, this app means a lot to me. Mental health (especially in the black community) is often neglected and dismissed. I love that SafeSpace is an outlet for black women to be vulnerable and reveal workplace stressors without judgment. An app like ours is so important in a world where we are not allowed to be vocal about negative experiences without being labeled “angry black women”.
Front End | Brittany M. Garrett
For as long as I can remember, I’ve been drawn to express myself creatively. As a child, and even in my adult life, I find myself drawing, writing, and creating unique models and designs. I have a love for video games and all things tech related. Aside from my creative abilities and tech interests, I have a heart to serve underrepresented communities. Growing up in Chicago’s Southside, I’ve seen first hand the result of limited resources and a lack of focus on physical and mental health. Safespace. has allowed me an opportunity to align my background in Public Health with my newly established journey in software development to aid in the creation of a platform welcoming women to discuss and journal workplace taboo topics. It has been a privilege collaborating with fellow black female software developers to create a mechanism where women like us can be vulnerable, vocal, and supported. It has been a goal of mine to help bridge the gap of resources and create dialogue surrounding mental health stability, and I believe Safespace. does exactly that!
Back End | Jameka Echols
Hi, I’m Jameka, a software developer and mobile engineer. I’ve been in the tech industry for a little over 4 years. I also help teach during the evening at Nashville Software School where I’m able to connect with future developers and assist them the way I would have wanted to be guided during my early days. For fun I love to read, go to new restaurants, travel with my family and friends, visit museums and go to the theater. When I’m not doing that, I lounge with my dog, Linq and vibe out. Being able to help create this app feels good. As a black woman myself, I have found how hard and how frequent it is for black women to internalize trauma caused by work related situations and having no outlet. This app is here to help those who identify as black women, journal their issues and find meaningful ways to resolve the issue and heal. The entire goal is to effectively bring the issue up, resolve it and heal from it all of which makes me feel extremely excited to be a part of it.
Front End | Yasmeen Cole
Hi, I am Yasmeen Cole. I am a Software Engineer and a recent graduate of Nashville Software School. I have always been passionate about technology since I was a child. I believe that technology can be a tool to improve our lives and can help us be innovative in ways that were not always possible. In my spare time I enjoy spending time with my family and friends, doing yoga, hiking, painting, and learning about space science. One of my future goals is to be a part of a team that develops software that will ultimately help humans travel to outer space and make a home outside of our planet Earth. For me personally, I use technology as a way to: express myself creatively, to learn, to connect with a community of people who share my passions, and to inspire and be a resource to the members of my family. I love that this group of women has decided to give black women a way to express themselves in an open and safe environment by creating this application Safespace. Safespace will help us to inspire, encourage each other, learn from one another and find new ways to navigate our careers.
Go-To-Market
The current version of SafeSpace. is the MVP prototype, but is available for anyone with an internet connection to review at https://safespacemvp.netlify.app. While the team has done aggressive manual testing, there are no unit tests included, which would need to be completed, among other measures, prior to being prod ready.
There would also need to be some algorithms in place to check content standards to ensure content meets guidelines as well as terms and conditions as admins manually reviewing posts is not scalable. There is also a need to ensure that users are actually Black women, which we did not cover in this MVP version.
Once those underlying concerns are addressed, the application runs itself as it was created for and belongs to anyone who identifies as a Black woman. The core is to have a journal and SafeSpace. does this really well.
$ git clone git@github.com:GIT-Hack-SafeSpace/SafeSpace-MVP.git
$ cd SafeSpace-MVP
$ npm i
$ npm run dev- Create an account and project on Supabase
- Update the
.envfile with your secret keys (use the.env.sampleas a guide) - Create tables based on the team ERD
- Open http://localhost:3000 with your browser to see the result.
In order for the project to run locally, you will need to set up your .env file. There is a sample file. DUPLICATE it and rename it .env and reach out to another team member for the keys.
- Connect community comments to posts (decided to descope because of the social aspect)
- Allow users to create multiple journals
- Users can follow other users
- Users can follow community posts
- Users can submit resources
- Users can upvote companies and doing so would move them to the top of companies page
- Data dashboard for sharing details on occurences