WeeGo

a mobile application designed to help people in NYC find restrooms near them that meet their needs
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

What is WeeGo?

WeeGo is a mobile application that is designed to provide people in NYC with the ability to find restrooms near them that meet their individual needs.

With WeeGo, users can see restrooms near them and filter by amenities, ratings, and accessibility.

Timeline: 12 Weeks
Role: UX Researcher, UX/UI Designer
Software: Figma, FigJam, Google Slides
Project Type: Academic Capstone

Problem Space

New York City does not provide enough public restrooms to meet the population’s needs and many of the ones available are not maintained properly.

This has led people to rely on private businesses for restrooms. Yet, there is not a comprehensive resource available that shows people in NYC restrooms near them.

Research Key Insights

The public restroom situation in New York City is problematic, as shown below. This has led most people to rely on private businesses for restrooms

73% of NYC public restrooms do not have changing tables

Source

only 31% of NYC public restrooms are ADA accessible

Source

There are only 16 restrooms for every 100,000 residents

Source

Interview Key Insights

In order to verify this was a problem many people were experiencing, I interviewed several New Yorkers, and collected the following insights:

1. Participants rely on restaurants, large brand name stores, and their place of work to use the restroom while in NYC

2. All participants had experience using restrooms in NYC that were not clean and did not have the proper supplies.

3. They all would prefer restrooms to be clean, well stocked, and smell nice

4. All of the interviewees are frustrated with not knowing where the nearest restrooms are and the lack of available restrooms in NYC

How Might We....

inform people in New York City of available restrooms near them so that they can have access to more restrooms that meet their needs?

Persona

I created a persona based on my user interviews, which showed that most people rely on private businesses for restrooms.

Experience Map

Then I crafted an experience map in Brian's current journey with searching for a restroom in NYC that meets his needs in order to identify opportunities in Brain's journey to intervene with a digital solution

Develop

What does the app need to do?
User Stories

after laying out the How Might We statement and the pain points of my persona, I created several user stories pertaining to restrooms in NYC. The User Stories were then categorized by user type, which was tourists, New Yorkers, parents, and disabled people

Core Epic

the core epic that came from my user stories was filtering nearest restrooms by user's individual wants and needs. So I focused on making a filter option for my users.
Now that I have identified areas of opportunity for a digital solution to my persona's pain points, I created my core value proposition to guide my design for my mobile app.

Core Value Proposition

provide users with the locations of restrooms near them with the ability to filter the results by restroom amenities to better meet the user's needs.

Task Flow
After identifying my core epic for my user, I started creating a task flow to guide my sketching process.
Primary Task: the main task flow for WeeGo was to filter the nearest restrooms by a person’s individual needs.
Secondary Task: login to app, leave a review, and favorite restrooms the user likes

Sketching Process

After determining the task flow for the app, I began sketching possible layouts for the screens in the task flow. Below you can see a few options I explored for each screen. During the sketching process I utilized the Crazy 8 process in order to quickly explore a range of different layouts.

Low Fidelity Wireframes

After finalizing my layout plans on paper, I moved on to low fidelity wireframing in Figma

User Testing

 Now that I had a general flow laid out for my app, I conducted two rounds of user testing with five participants each round to get feedback on my product and identify areas that needed improvements

Task Overview

  • Login
  • Navigate to Search
  • Filter search results by personal need
  • Select a location from search results
  • Get directions to selected location
  • Write a review

Scenario

the scenario presented to participants was to imagine they are a father of two children who needs to find a restroom with a changing table by using the WeeGo application

Main User Test Insights

User Testing Round 1 Iterations

Home Screen

  • Got rid of search bar, replaced with magnifying glass at top right
  • Added logo to location cards for clarity
  • Added user’s location and restroom locations on map

Filter Menu Screen

  • No longer forced to search through filter
  • Filter is now an icon on homepage that you can click and it has a pop-up modal with filter options
  • Can also access filter option from magnifying glass

Location Screen

  • Moved location name to above the images
  • Added rating label
  • Added 5th star in rating
  • Added hours/day specification added 5th star in rating
  • Color update for clarity

Directions Screen

  • Updated map image for further distance
  • Added screen for arrival at location with reminder of helpful tips

Review Screen

  • No longer force user to leave a review in the primary flow, access through “My reviews”
  • Updated screen to have interactive star ratingsMade photo sharing more clear
  • Made photo sharing more clear
  • Simplified the written area of review
  • Added a quick star rating pop-up after directions arrival

Revised Prototype

Design System

Brand Identity

Now that I had the flow of the app and a low-fidelity prototype done, it was time to start figuring out what WeeGo really was as a brand.

I started the Brand Identity process by creating a “More A than B” list, then I chose adjectives that I felt WeeGo embodied

Brand Keywords

  • Clean
  • Relieved
  • Trustworthy
  • Accessible
  • Helpful

More A than B List

  • More winter than summer
  • More clean than busy
  • More helpful than condescending
  • More accessible than isolated
  • More calm than stressed

Mood Board

In order to further flesh out WeeGo’s brand identity, I created a Moodboard that was based on the keywords and more A than B list feelings I want people to identify with WeeGo

Blue skies and bodies of water portrayed the relieved and refreshed feelings I wanted users to have

I found that plants were a good way to translate the cleanliness and calm that I wanted WeeGo to portray

Color

I extracted colors from my Moodboard to create WeeGo’s brand colors. These extracted colors ranged from blue to green, ultimately I went with blue as my primary color because it felt more clean and also is a nod to NYC’s flag color

Accessibility

After extracting colors from the moodboard, I made sure the combinations I was using passed WCAG AA compliance for accessibility considerations.

Typography

After choosing my brand's color palette, I moved on to brand typography. Typography is one of my favorite subjects, so I did an in depth search for fonts for WeeGo.

I got too excited about font exploration and lost sight of WeeGo's brand identity. After some peer review and a refocus on brand mood and adjectives, I landed on the following fonts for WeeGo:

Prototype

After creating the design system overview following the atomic structure, I had a finished prototype that I was ready to share with people. This led to the creation of a marketing website.

Next Steps
Update Review Flow
I want to flesh out my process for leaving reviews.
  • Add ability to leave a comprehensive review of a restroom
  • Add ability to read past reviews with sort/filter capabilities
  • Create ability to report a restroom
Clean up UI
I want to re-examine my User Interface and update it
  • Update color use throughout the design
  • Update icons for consistency
  • Streamline layout for ease of use and understanding
  • Evaluate screen layouts and update
Make Map Interactive
I want to update my map screen to be more interactive
  • Update map to be movable
  • Make map zoomable
  • Make map easier to navigate
  • Update map’s location icons for better visibility
  • Create a “Night Mode” map view