Diverse representations in design and awkward conversations with colleagues

A presentation at DXN - Design Exchange Nottingham in March 2020 in Nottingham, UK by Eriol Fox

Slide 1

Slide 1

Diversity in design

Content warnings: Diversity in design. Content warnings: Misgendering, Ableism, Racism, Visual representations of Transgender people, LGBTQIA+ representation, Ageism.

In this talk I will be covering: Illustration/photography UI & UX Some of these are my own experiences and some are covered in some related reading

I also talk about times when I’ve had difficult time advocating for better ethnic diversity or fighting against racial stereotypes as well as better representation of visible disabilities as well as designing accessible and inclusive technology.

This talk presents a lot of questions that there aren’t necessarily answers

Slide 2

Slide 2

Quote from Politics of Design

“Tools are never completely neutral and their settings reflect the cultural bias of the technicians that calibrate them.” Pg. 90 - Politics of Design by Ruben Pater

I focus more on the things that I have personal experience of, which is why this talk focuses on gender representation, trans inclusivity and LGBTQIA+ representation.

I also talk about times when I’ve had difficult time advocating for better ethnic diversity or fighting against racial stereotypes as well as better representation of visible disabilities as well as designing accessible and inclusive technology.

Slide 3

Slide 3

Hi, I’m Eriol. (Ehh-roll) - Intro slide

I’m a humanitarian designer or a human rights centred designer.

10+ years in digital product design & UX. 9+ years in non-profit work. They/Them pronouns. Mx (not Ms). Non-binary, Trans. White. Queer. Carer for parents/children. ‘Invisible’ disability/illness (PTSD).

Job roles that have been both specific (UI specialist) and more general.

I’m happy to be asked questions, especially If there are terms and subjects that are new to folks here. I’m happy to be approached after the talk today and digitally about the topics covered.

Slide 4

Slide 4

Brief of a family doing a conga line from a Parental tech company

Here’s an illustration I made for a family product for a blog around Christmas/holiday time. The only specific of the brief was ‘A family doing a conga line’

A chance to include diverse folk. Different skin colours, ages, bodies and visible disabilities.

Slide 5

Slide 5

Close up of the impairment devices the figures are using

Older person on the left of the screen. Hearing aid device. The person on the right, red and white striped cane, used by people who are severely sight/hearing impaired.

I made 7 illustrations for this blog, this conga line was the most diverse.

It didn’t get used.

Slide 6

Slide 6

These images did get used

These ones did. Unearthing unconscious personal, or business based bias is scary.

Conversations are scary.

Some are easier to have than others, include more people of colour, single parent families ‘same-sex’ couple family ‘but including that kind of family won’t appeal to our target families’

On to photography

Slide 7

Slide 7

DREAMS poster project - illustrations and photos from funders

I worked on a HIV/AIDS prevention project where I worked with the brand to create posters for clinics. I had personal critiques of the very ‘feminine’ brand but also had reservations about the photography used by the funders. The photos show typical ‘poverty images’ of young black girls in torn/dusty clothes, crammed school rooms and holding buckets/bowls.

Slide 8

Slide 8

DREAMS poster project - photo treatments

I wanted to explore whether this was an accurate representation of who we wanted to speak to with these posters so I did some image searching using google images search and Instagram for tags like ‘Nairobi nightlife’ and ‘Kampala casual’.

I also asked my workmate from kenya her thoughts and even though it was a scary prospect, to talk about the way that people are depicted in African countries it offered me th insight in using more accurate images. (not the girls with buckets!)

Slide 9

Slide 9

Stock photos

I did a similar thing with my community - trans folks Some good representations!

Slide 10

Slide 10

Problematic and confusing results

How ‘trans’ has to be something that has these obvious visual binary gender markers (bras, makeup etc.)

How do we understand and challenge the cultural whispers that say ‘A trans-woman must have these characteristics’ or ‘A lesbian must have these characteristics?’ and so on a so forth.

Slide 11

Slide 11

My LGBTQIA+ heroes

Because people from the LGBTQIA+ community look just like regular folks!

How do we reconcile the need for representation in visual media, without relying on stereotypes to communicate that message?

How do we move away from the kind of ‘default’ thinking that says, straight, white, male, woman, thin, able-bodied and so on. Especially when trans folk, GQ and non-binary folk are as diverse as anyone else

Slide 12

Slide 12

Stock resources

www.africanstockphoto.com www.photoability.net www.wocintechchat.com/blog/wocintechphotos https://techspark.co/shift-stock-gallery-2/ blog.mapbox.com/queer-in-tech-free-stock-photos-from-mapbox-87aba2e7c7da

Slide 13

Slide 13

Meetup photos

It’s real, authentic, there are many people here that express themselves in their own ways.

draw on the power of your product’s community and say you’re looking for diverse representation that is accurate to your customer base. If your customer base is not diverse already, understand there is some effort needed to fix or build that.

stock images = survey your customers or the public, use whatever platform you can and put some photos out there and ask ‘Does this image represent a diverse set of people as well as promoting our product well?’

Slide 14

Slide 14

'Feminising' the experience

user experiences =product successful. At it’s root, it’s about making something usable, relevant and simple for anyone to use. UX + marketed.

‘feminise’ The worry was that ‘women’ would not buy the product because it looked ‘too techy’

The conversation danced around ‘not making it all pink’ and finally landed on the statement “Just making it more female friendly” to which I replied with “Why not just friendly without the female part?”

user interface or something you do ‘work’ on like a word processor etc. Because regardless of self-identified gender of users, the feedback was synonymous the core feature flows quicker and a straight-forward set of screens/buttons.

Slide 15

Slide 15

Products and who are they for?

Where you have everyday items, implying that certain folk shouldn’t purchase it. It can be amusing but it can also be a fraught decision for some and for what benefit? If your a person who’s gender assigned at birth matches that your gender expression (the way you present to the world) this works for you. If not, say you’re in a gender transition then these kind of products/experiences can be isolating and distressing.

I particularly find tissues interesting. Some mansize tissues with ‘strength’ and some other tissues* where there is a ‘ultra soft’ label.

I honestly struggle to think of any person when faced with a sore nose wouldn’t want extra softness.

Does this further isolate people’s choices and mark certain products for specific people? And why?

So i’d just like to re-iterate the make something usable, relevant and simple for anyone to use.

Slide 16

Slide 16

Fitness apps

Talk about body shapes sizes and how to think differently about these.

Also mention period tracker apps that focus on fertility and use feminine gendered language or have visual that is coded feminine.

Slide 17

Slide 17

UI examples

This example comes from a UK based student accommodation website.

It shows one section of the process to buy a room in a student flat.

There are obviously still a few problems here:

1 - What if you want to not specify, but do want to share your gender with flatmates? 2 - What is this information actually used for? 3 - Why is it mandatory (indicated by the star)

I suggested: free text field so people can write what they want to?

Placed in flats with the maximum amount of your own gender. So if you’re applying for a 6 person flat and you select ‘male’ you’ll be placed in a flat with 5 other males.

Why do you think everyone wants to live with the same gender?

Company: We think there will be less distractions for students

Me: Won’t this happen with same sex flats too?

Behind the scenes they are separating you from a choice of actually who you want to live with, which is much more important question for a user here.

Evidence, surveys our young people are more and more identifying outside of the gender binary and have fluid sexuality yet we’re not recognising them.

Slide 18

Slide 18

'Real name'

Here’s something that a lot of non-binary and trans folk dread ‘The identifying yourself alongside ID’

If your ID name doesn’t match your preferred name then theres a whole extra process you have to self-initiate to make sure you’re following the rules of a product or service.

This is most definitely harder early on in transitions and when your defining your gender identity.

You can see here I’ve not just filled in my ‘legal name’ I’ve done a pretty long sentence that details my preferred name and then the fact that won’t yet match some forms of ID I have.

Slide 19

Slide 19

Mr, Mrs, Ms, Dr and Mx

Here’s another experience.

Why does Dr. have both a male and female option?!

Non-binary folk sometimes use other titles like: Zir, Xe, Fey,

Slide 20

Slide 20

Native Language Is Gendered

What Happens If You’re Genderqueer — But Your Native Language Is Gendered? Erin Crouch https://medium.com/the-establishment/whathappens-if-youre-genderqueer-but-your-nativelanguage-is-gendered-d1c009dc5fcb

Slide 21

Slide 21

Prefer not to say and I prefer to say!

‘Respectful Collection of Demographic Data’ https://medium.com/@anna.sarai.rosenberg

Allow me to tell you my indentity

Slide 22

Slide 22

Some good stuff

Slide 23

Slide 23

Edge Cases

Also known as: “We can’t please everybody”

It’s an industry term to describe a scenario which is unlikely to happen or a type of user that is in a low percentage of overall users.

What it’s slowly becoming as well is a word to discourage designers and developers during the early stages of a project to spending time, effort and money catering to individuals of a minority which often are marginalised groups.

Slide 24

Slide 24

Stress cases

Also known as: “The people that need our empathy and attention the most”

When we know, as people that exists within minorities and marginalised groups that we need to be included. What it means for progress and acceptance to be surfaced and recognised alongside the same kinds of people we’ve seen frequently in our products and media.

Slide 25

Slide 25

The struggles from the LGBT community

Survey by the National Centre for Transgender Equality: Out of almost 28,000 respondents, more than a third chose “non-binary/genderqueer”

Two in five LGBT people (39 per cent) who identify as non-binary have experienced a hate crime

If you need more encouragement to start including different kinds of folk, including gender identities then here are some harrowing quotes from Stonewall, The USA’s national centre for Transgender Equality and a personal account from a young a-gender person.

Slide 26

Slide 26

Design and inclusion statement

As designers, we are at the forefront of how products and services serve users, but also how the digital and physical world represents and reflects back at users…

…we have a responsibility to be inclusive, sensitive and understanding with what we design, and endeavour to help non-marginalised folk foster their acceptance and expose them to systems that include, rather than exclude.

Slide 27

Slide 27

I’d give myself a C+ for inclusion. Maybe a B if I’m feeling nice….

We don’t always get it right. Even when you’re part of a marginalised group there are parts of a diverse experience that we’ve not had the chance to talk about, experience or even realised before.

One thing I decided was important when I began feeling more excluded from conversations was go out of my way to attend events, meet-ups and groups outside of my experience. I learn something new every time.

Slide 28

Slide 28

Tips!

Read widely from marginalised people. Make mistakes and ask for clarification. Be prepared to apologise but understand and respect boundaries. Seek out events, meet ups and places where you can learn. Ask for permission and state your reasons. Don’t just turn up unless it’s stated that’s ok.

Seek alternatives and ask for clarification: “That website is disorganised and messy” “That’s not a good solution for this case” “Hey team/folks/friends, how is everyone?” “There they are/There is Eriol”

Ableist and gendered language is the hardest to work on: “That website is crazy” “That’s stupid/dumb” “Hey guys, how is everyone?” “There she is”

Slide 29

Slide 29

Tips! with more

For those that can go a little further… Volunteer for or sponsor these: A local Pride or LGBTQIA+ event or organisation A group that supports people with disabilities/impairments Groups and organisations that promote people of colour in technology

Slide 30

Slide 30

Books and links

https://www.ellpha.com/ - Gender Balance through AI https://www.ons.gov.uk/census/censustransformationprogramme/consultations/ the2021censusinitialviewoncontentforenglandandwales - Gender Identity from UK Census http://cassolotl.tumblr.com/post/168336693365 - Pronoun tips for Binary Men and Women https://itunes.apple.com/us/podcast/less-than-or-equal/id890268267 - Less than or Equal a podcast geeks facing inequality in their industries

Slide 31

Slide 31

Eriol does other talks

About humanitarian and human rights-centred design, open source design and crisis response, design field research in developing countries etc…

Annotated slide decks: https://noti.st/eriolfox

Youtube playlist: http://bit.ly/Erioldoesspeaking