Do your form design conversations sound like this?

Content strategist: “Alright, let’s add a form when people sign up to our website.”

Designer: “Sure! I’ll tell our developer.”

Developer: “Which fields should I put?”

Designer: “I don’t know, the regular ones? Name, email?”

Marketing: “Let’s ask for gender so we can target products by gender.”

Developer: “Which options should I put for gender? Male/female?”

Designer: “Wait, we need to be more inclusive. Let me look for which options we should use.”

Working on forms and surveys can feel like reinventing the wheel. There is no common source for best practices on what to write, and once we get a set of questions and answers, we often have to explain and advocate why we ask them. Teams lose a considerate amount of time in those back and forths.

Imagine a world where we have a set of questions pre-approved that we can plug in our flows. This world exists with inclusive design systems.

The role of design systems in inclusive design

A design system includes components that we reuse throughout the whole project. Each component has documentation to explain how to use it and why it is designed this way. For example, a design system includes how forms look, from the font used to the text fields and buttons’ appearances. 

The extra step I want to offer today is the content of the forms themselves. Contact forms, sign-up forms, and surveys are used and reused a lot in projects, and they are an excellent opportunity to build them with an inclusion lens. 

Inclusion within each component   

We need to stop seeing inclusion as an extra layer we might address at the end of a project and instead treat it as an inherent element of each component. There is impactful value to get our components right before they are used all over our platforms.

When we talk about design systems, we look at which elements we will repeat and how to design them to be reused. We do this to bring consistency to a project and shared understanding within a team. While we primarily focus on visual elements of the interface, like how text fields, buttons, dropdown menus look, today, I want to address the content of forms, specifically how to design inclusive forms in a design system. 

Do you need to know that?

An important question to ask ourselves and our team is: “Why do we need to know this?”

Do we need to know the person’s gender? Maybe we do. Maybe we are just used to asking for it. There are limited reasons why you need to know someone’s gender: perhaps you need the gender assigned at birth to match the insurance data? And there are unlimited reasons why you actually don’t need to ask. 

Will these questions harm or support marginalized communities?

Before we start overwhelming our users with all the questions we can think of, the golden rule is to ask ourselves, “will this question harm or support marginalized communities?” I call this the Ethics Pause. 

Especially if our team is not diverse, we tend to oversee the consequences of our designs and codes. A simple question like “What is your sexual orientation?” or “What is your annual income?” can make the receiver feel unsupported and unsafe.

I listed some examples below that you can freely use for your inclusive design system forms. They are respectful of everyone’s identity. For example, I recommend asking if a person is part of the LGBTQIA community rather than asking about their precise sexual identity, which is more invasive.

Gender

Most of the questions I get during the inclusive products workshop I run are about forms:

• “What should I put for gender options?”
• “Which pronouns options should I put?”
• “Is it okay to ask someone’s sexuality?”

I think it is time that we create a homogeneous answer and apply best practices to gain understanding and efficiency within teams, from content strategists to designers and engineers.

Asking for users to self-identify their gender can bring uncomfortable feelings for some folks, especially if it doesn’t include enough options.

In the event that you need to ask this question, you should explain why you request this information. Here is an inclusive way to do so:

What is your gender identity? Select as many as you need.
We ask this because we are gathering data to apply for grants.

• Woman
• Man
• Non-binary
• Transgender
• Intersex
• Two-Spirit
• Gender non-conforming
• Self describe: _________________
• Prefer not to answer

What is your gender assigned at birth?
We ask this so we can match your information with your insurance company.

• Woman
• Man
• Non-binary
• Prefer not to answer

Name

For some folks like trans and gender non-conforming people, their names are not the same as those listed in their identification documents (legal name). If you need their legal name for a valid reason, like matching insurance information, you should start by asking for their name - not “preferred” name - then their legal name, if different. Also, remember to explain why you need this information.

What is your name?
The name you use.

____________________

What is your legal name?
We ask this so we can match your information with your insurance company.
____________________

Pronuns and honorific titles

The best way to interact respectfully with your customers is to know their pronouns. If you want to learn more about why pronouns matter, I invite you to read “Why I Put Pronouns on my Email Signature (and LinkedIn profile) and You Should Too”

Which pronouns do you use? Pick all that apply.
We ask this so we can address you correctly.

• She/her
• They/them
• He/him
• Self describe: ____________________
  
  

The recommendation is to drop the honorific title altogether, but there might be situations where you still need to ask for it. The best practice is to offer “Mx” (pronounced Mix), the gender-neutral honorific title. It’s used more and more, even by airlines.

Which honorific title do you use?
We ask this so we can address you correctly.

• Mr
• Mrs
• Ms
• Mx
• Self describe: ____________________
  
  

Income

You might need to know how much someone is making each year for benefits purposes, grants, or sliding scale offering. It might make someone uncomfortable to ask for exact numbers or ranges. Here it is preferable to center the question around how they currently meet their needs or not.

Another inclusive way to do so is to trust their information and not ask for proof. Underserved folks already have a lot to handle, and asking for more labor by providing documents makes the process even harder. 

How would you describe your financial situation?
We ask this because we offer sliding scale services, and we want to provide them fairly.

• I have more than enough resources
• I have sufficient resources
• I am stressing out about meeting basic needs
• I don't know / I don't manage my own money
• Other
  
  

Race and ethnicity

Here again, ask yourself why you need this information. The best way to make someone feel respected is to avoid asking them to put themself into a box of preconceived categories. 

How would you describe your ethnic or cultural background in your own words?
We ask this because we aim to serve people of color as a priority.

____________________

Sexual orientation

Unless you work in LGBTQIA+ healthcare, there is little chance that you need to be aware of someone’s sexual orientation or if they are trans. You might want to know if they are part of the LGBTQIA+ community to provide services for them. So why not ask precisely that question?  

Are you part of the LGBTQIA+ community?
We ask this because we aim to serve LGBTQIA+ folks as a priority.

• Yes
• No
• Unsure
• Prefer Not To Answer
  
  

Design systems are the foundation of inclusive design

As the central source of truth for our design and development teams, design systems play a critical role in our design culture. By prioritizing inclusive design within the design system, we send a clear message to designers at every level: that inclusive design is your company’s priority.