One day, my friend who is transitioning told me, “I don’t quite feel comfortable entering a men’s or women’s restroom.” This blew my mind. Before this, I, as a cisgender woman, had never considered this problem to even exist—one restroom betrays my friend and who they are, and in order to be safe, they can’t use their preferred restroom without being considered “passing” by the general public.
As soon as I heard that they felt uncomfortable stepping into gendered restrooms, I knew that there needed to be a database somewhere that was made to help people in the same situation as my friend. I found that there was a lot of untapped potential that I could seek to unfold through a redesign.
Refuge restrooms is an open-source application that allows users to access and add to a database of restrooms that are unisex and/or accessible. As its website promotes, the webapp seeks to “provide safe restroom access for transgender, intersex, and gender nonconforming individuals.”
Based on searching through their social media presence, it seems that this app doesn’t have a big following yet, and there are many people who discover the application to find that it is really useful for their travels.
Overall, Refuge Restrooms is difficult to use for first time users because of its unconventional interactions and icon usage.
To help me take a more empathetic approach towards this redesign, I created two personas that best represented the stakeholders of Refuge Restrooms.
While I had some of my own ideas when first opening this app, to get an idea of what could be improved about this application, I conducted three user interviews, observing users complete a task list and checking any pain points that they ran into. I went through a rapid ideation process to jot down the different ideas that I came up with in brainstorming.
I decided to tackle my problem statement in two ways:
I then went through numerous iterations of wireframes for each phase of the user flow. I decided to focus on four main user interactions: an onboarding experience, the main interface, the restroom details, and adding a restroom.
When creating a brand identity for this project, two words kept coming up as core themes: accepting and nonconforming.
I then created a series of icons that could be used throughout the application. In this icon pack, I tried to focus on making them legible, which meant that i needed to make some adjustments to the existing symbols associated with restrooms and gender identity.
This ended up expanding to creating a design system that I could use across screens as I approached creating my final mockup.
I finished off this project with creating high fidelity mockups that combined the wireframes with a formal design system.
To encourage people to contribute more to the database, I decided that it was necessary to have an onboarding experience to teach users of the different features that this app could offer. This is broken up to an onboarding screen, and then a short tutorial sequence to teach users of the side icons that they can use on the main map interface.
The main interface brings down the “Add restroom” feature down to the bottom right of the interface, bringing the tap target close to a right-handed user. This will likely break down the barriers for users who find new restrooms to contribute to the Refuge Restrooms database.
One of the most confusing interfaces of the original app design was the information cards of the individual restrooms. I simplified the interface to be more intuitive to existing social media interfaces, breaking down some of the barriers of getting to know the restroom.
Breaking up the submission form onto multiple screens would help the user feel less intimidated by the amount of input fields that are offered to adding a restroom. I made sure not to change the input criteria for the database, as I didn’t want to tamper with the collection of restrooms that has been built up to this point.
Additionally, drop-down menus were transformed to switches to decrease the amount of hover menus that appear on the interface.
After creating a first set of mockups, I ran into a few setbacks and received feedback from some volunteers and my talented peers. Here are some of the things that were good while they lasted.
One of the biggest next steps would be to optimize the user experience of their website to match the branding and usability of the phone app. For this project, I decided to limit the scope to that of the mobile screen, making sure that I created a strong enough branding that could be translated to the computer screen as well.
Although this project started as an unsolicited redesign, I am planning on reaching out to the team behind Refuge Restrooms to see if I can contribute in any way to the open-source project. I see really amazing potential in this application and can’t wait for it to go further and reach a wider audience.