Inclusivity is a Recipe for Good DesignNovember 20, 2018
“It doesn’t really make sense to think of disabled people as a niche group. ” Isabella Kulkarni
KHOI: Welcome to Wireframe, from Adobe. A podcast about user experience design and how we shape technology to fit into our lives.
I’m Khoi Vinh, principal designer at Adobe. Each week on our show we explore… an aspect of good design. And I’m here today with producer Isabella Kulkarni.
ISABELLA: Hi Khoi. So I wanted to play a clip for you from an old TV broadcast.
TV CLIP: “It’s asparagus from tip to butt. Today, on the French Chef!”
KHOI: That can only be Julia Child!
ISABELLA: Exactly, and just a little refresher, Julia Child was a chef famous for bringing French cuisine into American homes.
And she had this cooking show called the French Chef, produced by WGBH in Boston.
But the French Chef was special for another reason — it was the first show on TV to be broadcast with captioning.
ISABELLA: Captions are an early example of GOOD. INCLUSIVE. DESIGN. Because…. captions help a lot of people. They help deaf and hard of hearing people watch their favorite TV shows. They also get used to subtitle foreign language movies on Netflix. And they’re helpful to people who just want to read rather than listen – say, if you’ve got a sleeping baby, you don’t want to wake up.
But originally, captions were created for one group in particular: deaf and hard of hearing TV viewers … people who were regarded as “edge cases.”
KHOI: And making products accessible to people who aren’t the majority of users, that’s called EDGE. CASE. DESIGN. And CAPTIONS are considered an edge case design success story.
ISABELLA: BUT it took awhile for designers to get them right. And in recent years, designers have really changed the way they think about designing for edge case users.
They’re moving away from the idea of just making things ACCESSIBLE for some … to making things INCLUSIVE for all.
KHOI: And THAT’S — what we’re talking about on today’s episode: How captioning and the PRINCIPLE BEHIND IT, paved the way to the inclusive design we see today.
ISABELLA: So the story of captions starts in the early days of TV…. in the 50s and 60s. And at this time — deaf and hard of hearing people – about six percent of the US population weren’t able to ENJOY television programming.
Occasionally schools for deaf and hard of hearing folks, like Gallaudet [GAL-A-DETTE], would hold screenings of shows with captions. But MOSTLY, deaf people were left out of the TV experience. But there was ONE tv station intent on changing this. W – G – B- H in Boston.
It’s a public broadcasting station — so its GOAL was to increase access to television content. And in the early 70s, the station realized by adding captions, they could REALLY HELP deaf and hard of hearing viewers.
So, WGBH created the “Caption Center,” with a mission to develop accessible design for this specific group of users – deaf and hard of hearing people. In 1972, WGBH debuted captions to everyone on the French Chef. The reaction was swift — and positive.
Geoff Freed is NOW one of the directors at the national center for accessible media at WGBH But BACK THEN, he worked at the caption center. And he says at first they got a lot of fan mail, mostly from deaf and hard of hearing people, who were so excited to be able to watch TV programs AS they aired. But the letters were not all positive. Because… there was a problem. WGBH? Was using what are called open captions.
GEOFF: Open captions are part of the video. They are burned into the video. Think of them that way. And so you cannot turn them off. Everybody sees them whether or not you want to see them — they’re there.
ISABELLA: So hearing, AND hard of hearing viewers were seeing these captions. And some of the hearing viewers were…. confused.
GEOFF: Some people thought the producers had put Julia Child’s script on the screen and she was simply reading from it but most people didn’t like it because the words covered up part of the picture and so you couldn’t see her doing certain types of things.
ISABELLA: And Khoi I wanted to show you what Geoff’s describing.
KHOI: Yeah, so it’s Julia Child and she’s at the stove. But right across the middle of the screen is a bunch of bold text, and it’s covering up a big part of what she’s working on.
ISABELLA: Yeah, and here there are just pots, but imagine if she was in the middle of prepping asparagus, I mean, we wouldn’t be able to see what she’s cooking!
KHOI: Yeah the WHOLE. POINT. is to see the food!
ISABELLA: Exactly, it’s a cooking show! Meanwhile, deaf and hard of hearing viewers were having problems too. They could tell when not all the words were transcribed, or when the words and text got out of synch, which was distracting. Captions weren’t working for either group.
KHOI: So earlier we said captions are considered an edge case design success story. And what that means is that while they serve the needs of a particular group of people at the edges, they wind up helping people in the middle too!
KHOI: Imagine you’re looking at a bell curve. On each end of the graph, the bell goes flat. These are called the edges, or the extremes of the graph. And in the case of captions? The edges represent people who are hard of hearing, or deaf. In the middle… is everyone else.
ISABELLA: So with these early OPEN captions, the MIDDLE of that bell curve wasn’t benefitting! In fact many of these people were kind of annoyed. Broadcasters could see that captions have value, but they needed a better design. It took a little tinkering, and eventually, the FCC, broadcasters and TV manufacturers, together found a solution: Optional captions. Today, we call them CLOSED captions.
GEOFF: You could press a button that said basically turn on the captions and you would see them. So what that meant is that you only saw the captions if you wanted to see them which was a huge step forward in technology.
KHOI: A HUGE. STEP. that actually did wind up serving the middle of the curve really well!
ISABELLA: But the folks designing captions only figured out a solution that worked well for everyone AFTER they first tried a solution that didn’t work for everyone. Essentially, they were doing user testing in public.
KHOI: Which is NOT ideal.
ISABELLA: And since we’re talking about TV, I get to say the classic infomercial line THERE’S GOT TO BE A BETTER WAY.
KHOI: You’re right, there is!
After the break — we’re going to hear about the shift from ACCESSIBLE design to INCLUSIVE design. And we’re going to focus on… how one team made a new and improved video game controller…. by cracking open the old one.
KHOI: Welcome back to Wireframe. So before the break, we were talking about closed captioning. And how it’s an example of accessible design on screens… television screens.
ISABELLA: And it’s important to note that closed captioning didn’t happen in a vacuum.
It was part of a larger, decades-long cultural movement led by people with disabilities. They were campaigning for a more inclusive society, which led to the signing of the Americans with Disabilities Act – or the ADA – in 1990. The ADA was the first comprehensive policy to REQUIRE designers to meet accessibility standards.
KHOI: Right, the ADA forced a lot of designers to reckon with how their work affected all kinds of people. Because now? The law required it.
ISABELLA: Other changes were happening too. In 2001, the World Health Organization – or WHO, changed its definition of disability. Previously, the way many people talked about disability was really narrow.
This is Valerie Fletcher. She’s the director of the Institute for Human Centered Design in Boston.
VALERIE: The medical model was the primary model and the medical model of course started with a diagnosis. This is your condition. This is the prognosis for your condition. These are the likelihood of limitations that you will experience.
ISABELLA: In contrast, the new WHO definition of disability described “a complex phenomenon, reflecting the interaction between features of a person’s body and features of the society in which he or she lives.” And this forced designers to rethink the way they designed for disability.
In this way of thinking, disability is part of everyone’s lives at some stage and in some way. One in four Americans is disabled, according to the most recent data from the CDC. So, it doesn’t really make sense to think of disabled people as a niche group. It makes a lot more sense to design as if anyone could be disabled.
VALERIE: Because of the length of our lives and the frequency with which we survived terrible illnesses and accidents. That’s the universal in this game. Functional limitation is a universal human experience if you live long enough. So design is actually how we create the context for human life.
ISABELLA: Functional limitation is one component of a new framework for designers designing inclusively.
KHOI: Functional limitations is another way of thinking of disability – it means when a person is in a temporary situation where the environment isn’t working for them. And this new framing places disability in context. Like, when you’re sitting in your car, squinting to make out what’s in front of you, because of the glare of bright sunlight. In that moment, you’re functionally blind.
ISABELLA: So Khoi, as a User Experience designer, does that mean you literally have to go through of all those possible limitations as you design? One by one?
KHOI: Well, the bottom line of good design – and inclusive design — is you have to understand who you’re designing for. So you bring users in early and you understand their full story and how they’re going to use this product. That’s how you discover and design for those functional limitations.
So for example… say I’m gonna design a Widget that’s gonna sit on a car dashboard we were talking about. I’ll need to know: Do people use it in the morning? In the evening? Is the person alone? Or with someone else? It’s really asking who/ what/ why/ when and how this widget is going to fit into this person’s life. It’s a more intentional way of designing or planning for inclusion, rather than just stumbling across it later.
ISABELLA: This idea of planning for inclusion, is something Bryce Johnson and I talked about. He’s the lead designer of inclusive product design at Microsoft.
BRYCE: We work with people with extreme need, and then take those needs and we apply that across the needs of everyone. So this comes back to a principle that we have in our Microsoft inclusive design practice, which is: solve for one extend to many.
ISABELLA: Solve for one, extend to many. Which, doesn’t sound that different than… edge case design. Solve for hard of hearing people, lots of other people benefit from the captions too. The difference between what’s happening at Microsoft and the case with captions, is that Bryce’s team brings many different kinds of people into the design process from the get go. They aren’t just brought in to test an existing product. They’re there from the beginning.
BRYCE: We work with the communities on the things that we develop. They’re not a subject of our tests. They are our partners, they are our coworkers.
ISABELLA: A few years ago, when Bryce was working as an interaction designer on XBOX. He met a man named Sergeant Josh Price. Josh was a gamer, a veteran and …
BRYCE: He’s also a wheelchair user. He has full use of his left hand, but his amputation is basically at his elbow.
ISABELLA: Josh wanted to game. But he didn’t have a right hand, so a normal video game controller didn’t work for him.
KHOI: Yeah, if you think about a traditional game controller – they’re really built for people with two hands to hold and shoot and press. So you’ve gotta be pretty agile in both hands to use it.
ISABELLA: So Josh connected with this group Warfighter Engaged, which helps disabled gamers game. Together, they came up with a fix for his controller.
So Josh takes this customized game controller to a Hackathon hosted by Bryce’s team, at Microsoft, and showed Bryce the hack that he and this nonprofit, had come up with.
BRYCE: They would crack it open and start soldering wires to it and then they would take those wires and they would hook them up to external devices.
ISABELLA: What Josh came up with was a big button attached to a tripod and a sort of joystick he could use with his amputated arm. And this was all fastened with rubber bands, to his wheelchair. Basically, Josh turned this standard Xbox controller into a customized one, that allowed him to control his own gaming experience.
ISABELLA: For the XBox designers.. Josh’s hack was eye-opening. As they watched Josh game with his hacked controller, they realized something: Sure, Josh had limited mobility — he was missing a hand. But he still had some mobility. He had full use of his left hand. He had an entire elbow he could be using. The standard Xbox controller wasn’t taking advantage of any of this. It was all or nothing: two hands, or no gaming for you.
BRYCE: We looked at things creating things for him that were bigger that easier for him to hit, that were positionable to the places where he had movement.
ISABELLA: The result of watching people like Josh, building a relationship with them and bringing them into each stage of the design process, was… Xbox’s new Adaptive Controller.
KHOI: Yes, I’ve seen that. It looks like a tiny DJ’s turntable. It’s got a clean white surface that has two large black disks on it. And those disks are actually buttons that provide a lot of surface area for users to tap or press or slide to control the action in a game. This is really that “design for one, extend to many” idea that Bryce mentioned earlier.
ISABELLA: Yeah, Josh was one of the people that they designed for. He showed Bryce and his team a really specific set of challenges. And the result? Is a product that works for people with lots of different types of limited mobility.
Still, one customer told Bryce that even with the Adaptive Controller, his wife was still having trouble gaming because one of her arms gets tired easily. She could use both, but the repetitive motion was hard. So she was trying to figure out how to play this game “Destiny” with just one hand.
BRYCE: I said, “you know why don’t you remap those two big buttons on the device, to run forward and run backwards and you can use the one hand that you have mobility in to use the joystick to basically steer your character and aim and fire and things like that.”
KHOI: This is such a great example of how accessibility is not just hardware and it’s not just software It’s how they work together.
ISABELLA: Yeah! And here’s another example.
There’s this feature on the adaptive controller called co-pilot where two users maybe with different types of physical mobility can play together as one character. Say one person has an adaptive controller? but wants to play against their sibling, who has a standard one. They can!
By plugging in both game controllers into the adaptive controller two gamers can control a single player. The Xbox allows the user to customize their experience through the software.
KHOI: Yeah, customization and letting a user control their own experience can be a great solution. BECAUSE every user is different! and the situations they’re playing in OR their circumstances those could change too.
ISABELLA: Bryce says the flexibility makes the Adaptive Controller work for tons of different users.
BRYCE: When someone comes up to me and tells me the challenge they have in gaming, we can probably give them a solution through the XBox adaptive controller. It doesn’t take us long to figure out a way for them to play. So yes the XBox adaptive controller was designed for people initially from a place of someone who is an amputee. But as we continue to develop this device and work with more and more people we got out of people with extreme need to people with like carpal tunnel. We got out of that to people who just wanted to play a game a little bit differently.
ISABELLA: The Adaptive Controller is even housed in the Victoria and Albert museum of art and design in London – the curators called it quote “a landmark moment in video game play.”
BRYCE: Gaming it’s an important part of our culture our modern culture and so it is an extreme privilege for us here at Xbox to be able to bring gaming to more people to bring culture to more people that didn’t have access to it before.
ISABELLA: Which Khoi, is really similar to what happened with closed captioning. Suddenly, people were able to participate in mainstream culture.
KHOI: I think these two stories illustrate this contrast between thinking about ACCESSIBILITY versus thinking about INCLUSIVITY. It’s about designing something for one group versus designing something that can scale for lots of different people. It’s subtle … but the results are profoundly different.
ISABELLA: Bryce says… what this comes down to? Is empathy. And empathy begins by talking to people. LOTS of people.
BRYCE: This idea that empathy is putting yourself in someone else’s shoes is actually feels false to us because we know that we can never really be other people. So we have to go out and talk to those other people. We believe empathy is engaging with the people that we’re trying to work with.
ISABELLA: This is also an argument for having a more diverse group of DESIGNERS.
Khoi… I spoke to your friend, John Maeda. He’s the global head of computational design and inclusion at Automattic, which is known for… WordPress. He says inclusive design isn’t just about user testing on diverse groups. It’s about designers…
JOHN: Exposing themselves to people unlike themselves, they are becoming better designers because they transmit this new attitude of diversity.
ISABELLA: This dynamic played out out WordPress. A few years back, John noticed that the dashboard didn’t have much color – it was pretty monochromatic.
JOHN: The first thing you land on has a lot of blue greys and grey gradients and your first reaction is, “wow it was so blue.”
ISABELLA: John’s first impulse….. was to change it – to add more color to the dashboards. He huddled with his designer, and in the process of asking questions, realized something unexpected
JOHN: We were like wait! Ooooh! This is why the scheme is this way and what is neat is as we began to specify the new gray the designer said you have to add blue because I can’t differentiate that by the color.
ISABELLA: John’s designer was color blind and the grey gradients were deliberate. Those were the colors she could see. John’s team DID wind up redesigning the the dashboard, but… they did it in such a way that it would work for both… color-blind.. and… non-colorblind people. That back and forth?… led to a more. inclusive. design.
KHOI: That makes so much sense. If you’ve got an inclusive design team you really have a great head start. You get inclusive design goodness before you even bring in more users. There’s a real sensitivity to different needs and situations already already built right into the DNA of that team.
This is the logical extension of what inclusive design teaches us — that you shouldn’t bolt on an accessible solution afterwards. The earlier you bring people into the equation, the more integral you make them to the design process, the better your chances are of designing great products that really matter to the widest array of people.
This episode was produced by Isabella Kulkarni, Rikki Novetsky, Amy Standen, and Abbie Ruzicka.
Rachel Ward is our editor.
Catherine Anderson is our engineer. And Keegan Sanford created our show art.
Special thanks to Matt May, Andrew Kirkpatrick, Claude Stout, Jutta Treviranus, Christian Vogler….and Erin Hawley.
And hey—this is our last episode of the season. We’ll be back soon with more stories about good design, and we’d love to hear your ideas for future episodes. Tweet me @ khoi– K-H-O-I.
And find us at adobe.ly/wireframe.
I’m Khoi Vinh. Thanks for listening.