You can’t just draw purple people and call it diversity

Meg Robichaud
Shopify UX
Published in
11 min readJan 26, 2018

--

Okay, so. Here’s the thing. Understanding your own bias is hard. All we know for sure is that, whatever it is, we probably don’t know what it is. Some kind of you can’t see it ’til you see it — it being your blindspot, standing cold and naked, exactly where everyone else can see itsits comfortably on your shoulder as you move from design decision to design decision. So you try like hell to be thoughtful—or at least, obnoxiously thorough—and prepare yourself for an awakening all the same.

It makes being in the position of choosing how we represent people kinda intimidating.

Like, real talk, so intimidating that our first illustration style did not include people at all. Telling a story through objects sitting right there, being all Haaay. what if you just.. didn’t? and we were like oh yes. It’s just safer. And easier. There’s no lizard brain telling you that something is off about the elbow that is making it just kind of making it creepy. And no one notices if you re-used the same flower pot in every illustration (and, like, if you did: that’s on you for being weirdly observant, not on me for being efficient AF). There is no emotion linked to my drawing of a mailbox. There is no implied preference because I drew more dogs than cats. Safe. Straight forward. Matter-of-fact communication.

The flip side, of course, is that when you add a person to that mailbox, the story is so much richer. Who doesn’t love getting mail ‽ (Not email, real mail. Duh). I can tell endless stories that people universally connect with if you give me a person and a mailbox. I can tell a memorable story, that you relate to, that says there are real, empathetic humans on the other side of this product, with a person and a mailbox. The problem is that I can kinda accidentally tell a terrible story with a person and a mailbox, too. Like, check: you relate to it; check: it’s memorable; super-did-not-mean-it check: it actually feels like the personification of the stomach knot that anxiety built when you see a full mailbox because that’s where taxes, bills, and collections notices come from. You were never going to do that with just a straight up mailbox. It’s just a freakin’ mailbox (and the award for most times using the word mailbox in opening paragraph goes to..). With a richer story, comes a greater risk of alienating or frustrating your users. With a richer story comes more responsibility to be empathetic and thoughtful, and a greater responsibility as a representative of the brand. Where previously each individual illustration stood alone, as a part of the UI, they are now connected through memorable characters. First it was a person at a mailbox; now they’re at their desk; now they’re buying ice cream—now you’ve got a narrative. People notice people. They notice what you decide to include, and what you don’t. However you decide to illustrate people, they quickly become both a representative of your organization, and a reflection of how your organization sees you.

So we tread lightly. We try to set ourselves up to be inclusive as hell, and assume our crappy bias and stupid habits are going to creep in anyway. Kind of like my new years resolution. Like, yes, I can be trusted to pick out lunch that, in theory, will make my heart not explode, most of the time. But if you really want to stop eating blocks of cheese for dinner, it really helps if you sent yourself through the produce aisle ahead of time. Pick out the right ingredients while you’ve got time to be thoughtful, and there’s only so much damage you can do at 2 am with some kale and a box of clementines. Your unconscious is still going to find a way to hit every Fresh Slice on the way home from time to time, and oh boy we’ll look back and see some things we would have done differently. But we knew it was coming. Some lessons were learned. Adjust the shopping list and move forward. The first thing we took off the shelf on the Shopify illustration was unrealistic skin tones. Although we tested a whole range of different skin tones, including realistic ones, the unrealistic skin tones consistently stood out as something we wanted to work with. They were unique, they were memorable, and they were inclusive. Or, at least, they were never specifically, exclusive, I think. One less thing to think about. We can’t exclude anyone if we’ve kinda included no one, right?

And, ya know, redesigns are bananas, and time is a limited resource. All things considered, I think we did a decent job trying to make our illustrations as diverse as possible. We made them different shapes and sizes; men, women and as much LBGQT as we could imply with, you know, a blob and no face. Some were disabled, some from different cultures, old, young, and all the in between ages too, I suppose. If nothing else, it was conscious effort to make sure that everyone was represented, and I think that much is reflected in the work.

But as we continue to evolve, and iterate on our principles and approaches to the Shopify illustration style: I’d like to do better. I’m certain this isn’t all the ways we could do better, and I hope it’s not all the ways we will do better, but for now, here’s a how we’re approaching diversity as we move forward at Shopify.

You can’t just draw their skin purple and call it diversity

So, like, actually. We kept drawing people with dark skin and they just looked like white people with purple skin. I don’t know what that says about us— hopefully just that drawing is hard; maybe something about the demographics of Canada; definitely something about the demographics of our team.

We quickly learned: if you want to be inclusive, you need to illustrate different people, not different attributes. Instead of trying to imagine the average person, and then plug in the various attributes—which, uh, inevitably somehow start to look like us—we set out to illustrate every person. Or, rather, any person, so long as they were specific and complete. Instead of a page of average + different size; average + different skin tone; average + different age…you get the idea—our illustrations finally felt like just a page full of people. Ultimately, hopefully, a better reflection what it means to be a Shopify user: someone who doesn’t necessary relate to the average, but rather a someone who feels unique, connected to a diverse community of unique people.

When you look for an entire person to base your illustration on, the details work together to create someone we know and recognize. If we’re talking product design, we call that a win because faster recognition, in any capacity, lightens the cognitive load and helps you get your job done faster. If we’re talking user experience, we call it a win because it’s easier to talk to people if they see themselves reflected back in the product. If we’re talking inclusion, we just call it a straight up win. We updated our illustration style to feel more grounded in realism, and increased the level of detail to accommodate this shift in approach. Where each illustration previously could be an under-represented group, now they are.

Diversity doesn’t stop at how you draw people

You know what just always goes over unreasonably well? Eames chairs. And pour over coffee. And really big desks with nothing on them. Which is cool, because who doesn’t want immediate and unwavering praise and approval. Bonus: you get to draw all your favourite things again.

Which, makes sense, because it’s designers making things for designers. And literally no one else.

Like, oh yeah? You just started a business and you thought a few 4000$ chairs were a good investment. Sure. Your desk is probably spotless too? Yeah, I hear that’s what entrepreneurship looks like: really tidy organized people with really clean desks and no stacks of paper or old coffee cups anywhere ever.

Nah I mean as much as I want to draw another room of reclaimed wood and subway tiles, it’s not a thoughtful reflection of what our merchants day-to-day lives look like. By extension, it’s not an inclusive reflection of anyone, really. Our merchants aren’t running their business from the front room of a brightly lit coffee shop. They’re in the back room, with outgoing orders in one corner, a temporary day care in the other and if you’re lucky, just enough counter space to squeeze on a laptop.

We came at it from a sincere desire to articulate our understanding and empathy to the challenges of modern entrepreneurship, and emerged with a an improved approach to inclusion. That thing where everyone has the same phone and the same laptop is.. not really a thing. I mean, yes, from where I’m sitting it feels that way. But from where I’m sitting everyone has the same haircut, outfit, and drink order too. Oh sorry is my bubble showing again? Not everyone has an iPhone. Acer is still a thing. Your daily latte is bougie as hell (okok my daily latte). Beginning each project by thinking about what obstacles someone might be facing, what resources they might not have access to, and how that might manifest in the physical world—objects; environment; uh, single concise word for, like, not everyone can just take a cab if they’re late, for example—is the difference between “our product is made for us”, and “our product is made for everyone”.

If it’s a traditionally male/female: just don’t

It’s easy to draw the developer as a woman and pat yourself on the back see what we did there? women can computer too, you know. And, like, okay, so it’s the first thing we did too. We traded out every carpenter for a carpenteur and called it finished. And, actually, we’ll probably keep doing it too, so maybe I should just get off my high horse. But, it’s just that it’s a good place to start, not a good place to stop. You can’t just Freaky Friday your way to equal representation. To actively set denying antiquated gender roles as something that’s important to Shopify, and systematically remove them from our illustrations, we need to look deeper than job titles.

Body language is a fundamental tool we use in our illustration style. We rely on it regularly to set the tone, join in celebration or direct your attention. It was quickly identified it as somewhere we could be cognizant of how we can deny traditional roles in favour of something more future facing and inclusive. When we’re illustrating something we often use a person to act as the verb in the illustration. If we need to communicate an action that has/is/will/needs to take place, we’ll use a single character in or directing motion; or two character interacting, to communicate the thing that needs to be done. Unchecked, this can become problematic, as gender bias begins to creep in. Cool you have equal representation in your illustrations, but who is always pointing to the white board?

We by no means solved this, but for now, we started to identify some common places it is easy to fall into traditional gender roles.

+ One character explaining something to another
+ One character giving an object to another
+ One character leading other characters
+ Conversation between characters (who is leaning in?)
+ Single character interacting with the viewer
demanding (looking at the viewer) vs. offering (looking away from the viewer)

Change your default

It’s kind of weird to think about what the default is when we’re making illustrations. Like, duh, it’s a human doing the illustration, we don’t need to program their default settings, we can just talk to them, can’t we? But, like, it’s actually kind of wild the amount of work we put out the door. A lot of it is thoughtful and considered: the model citizen of any illustration project. And a lot of it: is just not. Just need something quick. This is launching basically yesterday. Can you just switch out this part? No I don’t have any more information for you. Realistically, we’re not as considered and thoughtful as we want to be on Every. Single. Project. Twenty quick wins later and omg did I just draw my friends again? As a content creator, if we internally shift our default approach to someone more under-represented, it’s one less calculation when everything is on fire, since you’ll probably be skipping that step anyway.

Aim to overcorrect

I was surprised by how relieved I was to hear the simple advice “You too, white people. Don’t be afraid to mix it up and use images depicting non-white people.” Like, yes OBVIOUSLY I KNOW, but also ..thank you? Yes. Thank you for saying so, I think I needed to hear it. We illustrators are a timid creature, we really don’t like to offend. It’s easy to work yourself up; wonder if your attempt at inclusion feels forced or pander-y and fall back to whatever norms will go unnoticed. Drawing the culture you know always feels like the safer option on any single given project, often to the detriment of the overall body of work.

Taking words like Mira’s We are DYING to see ourselves anywhere to heart, relieves some of that pressure to go unnoticed. It gives our illustrators permission to choose a dark hand or wheel chair for no other reason than they wanted to. Moving forward, we’re actively deciding over compensate and illustrate a higher ratio of under represented people. We’re aiming to be noticed. Because as much as Mira is dying to see herself, we’re dying to put her there.

Diversity in tech is not going to be solved in an empty state. It’s still a relatively unchartered territory, where good intentions go kind-of-okay, and no intentions go catastrophically wrong. I don’t pretend to believe that if I just draw enough female CTO’s, the world will follow suit. And, honestly, it’s easy to look at the problems in tech that have roots so deep anyone would reasonably call them unsurmountable — and feel like our efforts as an illustration team are insignificant. Yeah I mean I can draw you whoever you want, but, like, your form only has two gender options.

But illustration is where I built my house, and if nothing else, I’m gonna run my house like I’d run the world: made for everybody, and also probably a disproportionate number of tacos and dogs. Our approach to inclusion is something that I’d call perpetually incomplete, but hopefully trending in the right direction. We march gently forward—occasionally taking comfort in our insignificance; occasionally overwhelmed by it—as the purpose of our efforts becomes clear.

Rather than feel the pressure to create change directly through each illustration, we aim to be an aspirational reflection of who we want to be. We use illustration to reflect the values we ultimately hold, even if we’re still waiting for the technology to catch up. It tells our users (and the world) that inclusion matters to us, and we are making a deliberate effort to normalize diverse representation in every day products. We use illustration to deliver the same message back to our own designers and engineers, reminding them that inclusion matters to Shopify, and they should take the same care in their own decisions. We don’t hold ourselves accountable to today, we’re aiming for tomorrows. We keep pace with Shopify, but constantly stay two steps ahead: as an evolving portrayal of what we believe in, and what we should collectively be aiming for.

--

--