As a queer designer, I try my best to have inclusion be a part of my process. This could be something as simple as intentionally selecting diverse stock imagery for client presentations or using same-sex couples in illustrations.
I make an effort to be inclusive when creating products because I know the emotional and psychological impact of being underrepresented, and as a designer, I feel an obligation to do my part to correct the issue. As a result, I’m constantly challenging my own assumptions and biases.
Recently, when creating an onboarding flow for a product, I found myself designing a gender selection field, and was surprised at how binary these fields can be, often driven by marketing needs to collect gender data in order to better segment and sell to people.
I decided to do some research into the topic and felt compelled to pass along my learnings, because our trans and gender non-conforming (GNC) friends need tech love too.
What does “inclusive design” mean?
Inclusive design is the practice of creating products with edge cases in mind. It ensures that we as designers are crafting experiences that can be enjoyed by everyone.
The most common application of design inclusion is accessibility, which can range from small tasks like selecting accessible color palettes to larger scale efforts like adhering to W3C 2.1 guidelines.
One area of inclusion that’s less talked about is gender identity—how an individual views their own gender, regardless of biological sex—and its implications for product design.
Why gender inclusivity matters
According to a recent study by the UCLA Center for Health Policy Research, 27% of California teens identify as gender non-conforming (GNC), meaning they do not adhere to binary (male vs female) gender norms. That’s in California alone.
A similar study conducted by the Walter J. Thomson Innovation Group found that 80% of Gen Z (people born from the mid-1990s to the early 2000s) believe that gender does not define a person as much as it used to, and over 50% said that they knew someone who went by gender-neutral pronouns (“ze” or “they”). Keep in mind that Gen Z comprises 25% of the U.S. population, making them a larger cohort than millennials and baby boomers.
With these trends in mind, it’s clear that perceptions of gender are rapidly changing, and there’s an opportunity for digital products to follow suit. GNC folks are increasingly finding themselves in situations where they need to classify their gender, and not always finding an option that works for them.
Gender is a spectrum
When thinking about gender, it’s best to imagine it as a spectrum with varying degrees of gender identity and gender expression. Because of this, there are many ways people identify with gender. While I’d love to go in-depth here, in the interest of brevity I will be focusing on a few common gender identities and gender expressions. You can read an exhaustive list of gender terms here.
Some terms you should be familiar with:
-
Gender identity is how a person internally views themselves and their gender.
Gender expression is how a person externally expresses their gender.
Gender non-conforming (GNC) is an umbrella term that refers to people do not adhere to established gender norms.
Trans refers to people whose gender identity does not align with their sex assigned at birth.
Also important to note: gender identity and gender expression are completely separate from sexual orientation.
Tactical tips
Here are some tactical tips for incorporating gender inclusive best practices into your products.
1. Use gender-neutral imagery
The world around us is diverse, so the imagery we use within products should be a reflection of that. Next time you’re designing an illustration, challenge yourself to include characters that lean gender neutral, meaning they aren’t overtly male or female.
If you need a jump start for creating illustrations, check out Pablo Stanley’s new illustration library for Sketch or InVision Studio. It’s a mix-and-match library that allows you to quickly put together illustrative scenes and there are a good mix of gender-neutral elements.
An example of an illustration for a recent product we worked on at Handsome.
2. Be upfront about intent when collecting data
If you’re going to collect gender data, make sure that the audience knows why you’re collecting it, and how it will be used. For some trans and GNC people, the collection of gender data can be a triggering experience, especially if they are still in the process of figuring out their gender identity. The last thing we want is for someone to feel uncomfortable or afraid that their gender information will be misused. Use language that’s clear, welcoming, and reassuring.
Notice that in this example, the form both assures the user that their responses are kept private and offers at tooltip explaining why they’re asking for the information.
3. Give more than two options, ideally multi-select
While the request for gender data may be a marketing requirement, we as designers need to be cognizant of the variants in gender identity, not only as advocates for trans and GNC people but for the business.
There’s no need to burden trans and GNC conforming people with choosing from a list of your marketing team’s segmentation. Give an exhaustive list on the front end, and for data analysis, group however you’d like on the backend.
Facebook, for example, does a great job giving multiple options for gender as well as asking for pronoun preference.
4. Make it optional—or don’t ask if not needed
In the same vein, oftentimes we will add in gender fields as a habit, without really understanding if it is needed or if the request will produce meaningful data.
If this is the case, ask yourself, is this really necessary? If not, consider taking the field out altogether. At the very least, giving an option like “I’d Rather Not Say” or “Prefer Not to Disclose” gives people the choice to opt out.
Gender-inclusive design is the only way
Hopefully, this has been helpful for you. Think of this as the start of the conversation. While these are some quick explanations and tips, the path to true inclusion is through conversations, mutual understanding, and empathy.
If you have any questions, don’t hesitate to seek out individuals in your community for guidance, both in-person and online. As designers, we need to do our best to hold each other accountable because crafting digital products can have profound implications for the people on the other end of the screen.
by Justin Reyna
Justin is a product designer at Handsome, a holistic experience design agency in Austin. He’s worked with clients like Keller Williams, TaxAct, and AMC to craft beautiful, thoughtful, and engaging digital experiences.
