New Feature, New Grindr
Grindr is a location-based dating mobile app designed “for gay and bisexual men,” though gender is malleable and their user base is much wider. Its mobile interface is based on a tile grid of profile pictures sorted linearly by their user’s device’s distance from the active user’s device, combined with a basic instant-messaging platform and a robust system of filters.
Problem Statement
In response to the uprisings of May 2020, Grindr announced they would remove the controversial “ethnicity” filter. However, this was met with debate over whether the filters protected or harmed Black and brown users.
Solution
We chose to develop a functioning prototype of a redesigned Grindr that:
allows users the option to utilize filters, while;
suggesting the negative impacts that discriminatory bias has.
The Team
Product Manager
Data Scientist
Product Designer (Me)
My Roles
User Researcher
UX Designer
Visual Designer
Deliverables
Academic Literature Review
Competitive Analysis
User Interviews
Domain Research
User Survey
User Personas
Annotated Sketches
Mid-Fidelity Wireframes & Prototype
Scope & Constraints
Grindr is already an established brand, so we were working within a design ecosystem that already exists. In choosing to improve an experience that already exists, we had to innovate while maintaining consistency with the brand.
Process
I conducted a survey of users of Grindr’s website in order to ascertain two pieces of information: belief’s about Grindr and experiences of racism on Grindr.
Of the 22 respondents, their ages ranged from 18 to 39 and comprised specifically Black and brown queer and trans users, as well as white users of gender-variant experiences. This was done to combat what felt like a bias towards a white, cis gender user that the topic literature seemed to have.
The majority of these users said that identity based filters either improved or had no impact on their individual experience of the platform, with less than 5% saying they believed it would worsen their experience.
The primary issue users had with identity filters was for with them being behind paywalls. More than half of users stated they believe these filters have no material impact on society at large.
With this in mind, it became clear that these filters had a function that should be investigated. The decision to remove them felt like an act of virtue-signaling without taking into account what users who experience racism actually feel on the matter.
Competitive Analysis
For context, I compared the apps Jack’d and Hinge. Intimate platforms, a term borrowed from the Cornell study this case study is responding to, refers to all kinds of dating and hook-up apps. Within that category exists two separate smaller categories: hook-up apps and more long-term dating apps. I wanted to compare one of each with Grindr, given the data which suggests over half of gay couples meet online.
Jack’d is widely considered the Black and brown version of Grindr. It also allows all users to use ethnicity filters without a subscription. Jack’d falls into the hook-up category of intimate platforms, but their subscription features are centered around filters and tools that investigate the types of relationships users are looking for, suggesting an investment in the depth of the relations users are seeking.
Hinge falls into the more long-term category, with its slogan being “the app that’s meant to be deleted.” Hinge also allows users to set ethnic preferences but adds a question, “Is this a dealbreaker?,” prompting the user to interrogate their relationship to the filter they are implementing. I found this to be intriguing as it creates a dialogue between the user and the platform via its settings and suggestions. Without the dealbreaker button activated, users will be exposed to users of all races once they have exhausted their preferred users within a given geographic area.
Personas
Kia (25, Performance Artist) has been using Grindr since before she began transitioning, stayed on for the community. She finds Jack’d to be the least racist of these types of hookup platforms but prefers Grindr’s interface. She uses filters on Jack’d because she sees fewer passively racist profiles that way.
Richy (36, Dancer), primarily uses site to hookup and chat with other gay men. He iews Grindr as primarily a hookup platform and spends little time on it besides trying to hookup, needs it simple and straightforward.
Richy is bothered by the idea that there are users opting-out of seeing him because of his race since he has dated men of all races before. He has experienced fetishization but thinks that is unavoidable on intimate platforms.
User Stories
Kia wants to avoid the racists around her because she is also worried about transphobia, but finds people who are attracted to her more easily on a queer-oriented platform like Grindr.
She uses Grindr to get to know guys and to also publish writing about her experiences in the dating world.
Richy has a busy schedule and is looking to find quick, easy hookups with whomever is nearby and meets his (non-ethnic) standards. His busy schedule also means he won’t want to regularly update his filters and will actively ignore the racism he encounters.
Sketches
Wireframe Sketches
Modeled my sketches on the original Grindr filter layout and moved Ethnicity and Gender to the basic section, bringing it from behind the paywall
Interviewee Galen’s response saying “I use these filters to see more people like me” left me with the impression that the filter itself is worth its protective bias.
Initially I went with a slider, like Grindr’s existing interface uses, to maintain uniformity.
I included messaging for users that selected dealbreaker to have them think twice about their choice to self-segregate.
I returned identity filters to the Basic Filters section to help users better curate their own experience of Grindr.
Digital Wireframes
I used racist names for profiles to signify the passive racism both Jeremy and Galen reported in their interviews. I maintained the box-based structure of Grindr’s main feed, while opting for two squares and not three to highlight visual cues. I only used one color in the wireframe, Grindr-yellow, to signify where the user is located. I used the Abel font to best approximate the clinical-looking, minimalist interface of Grindr . I incorporated Grindr’s bubble icons within the filter setting to emphasize the impact of one’s choice after the truncated main filter page. I implemented the Dealbreaker feature here, from Hinge.
Branding
My color choices derived from the style guide that is Grindr’s current branding. I iterated upon certain elements, like the buttons for various pages, so as to differentiate my design from the work of Grindr’s team.
Preference Tests
I presented multiple prototypes of multiple colors text placements to get a sense for preference. Users reported: a preference for the white background as it highlighted the colors on the page, issues with the text beneath the images as she felt the attention was too widespread, and discontinuity between placements of elements between pages. Overall, users loved this iteration’s attention to visual unity.
Usability Tests
Tasks
Users were asked to log-in and access their main feed.
Users were asked to access their ethnicity filters.
Users were asked to turn off the Dealbreaker feature.