Recently, Michael and Aaron were invited to speak to students taking part in the UX@UW user experience hackathon. The presentation, on how usability and accessibility create the foundation for inclusive design, was recorded and is presented here for the benefit of all our listeners. We hope you enjoy the talk, and if you’re interested in booking The Drunken UX Podcast to speak at your event, please drop by our contact page.

Followup Resources

Transcript

The following is a machine-generated transcript of this episode. It will contain errors until it has been reviewed and edited, and we apologize for the difficulty that may cause for screen readers. Do you want to help us speed up our transcribing process? Consider sponsoring an episode.

Hello everybody. Thanks for joining us on episode number 90 of The Drunken UX Podcast. I am your host, Michael Fienen. This week’s episode is something a little special for you. You see recently, Aaron and I were invited to come speak to the UX at Uw Hackathon at the University of Washington. We were super excited to get the opportunity to come talk to these students and explain what usability means and how it applies to the world around them, especially as it involves accessibility and inclusive design.

So this episode that follows is actually the audio recorded from that talk so that you all can hear it as well. And if you would like to follow along with the slides, we will have this also uploaded to Youtube where the slides will be synchronized, but for now kick back, enjoy the episode and we hope you learned something about accessibility and inclusive design.

Hello everybody. And thank you for inviting us to come on and talk to all the students here at the University of Washington. We’re really excited to be able and share a little bit about what we know about all of this kind of stuff. I am your co presenter, Michael Fienen,

and I’m your other other presenter, Aaron Hill.

How you doing, Michael? I’m doing all right. I’m doing a little bit okay here. We’re gonna be talking about the art of accessibility, the art of usability, and how these things sort of collide into this concept we think of as inclusive design and why this matters to to all these uh, nice kind folks behind the monitor. Uh, everybody welcome to the drunken UX presentation. I am Michael, I’m a senior front end developer over at a company called Aquent.

Um, I was formerly the CTO at the interactive map platform company, New Cloud and also is director of web marketing for Pittsburg State University, here in the wild state of Kansas. Um, I’m terrible at building slide decks and so I apologize in advance for sort of the juvenile second rate design that is going to proceed uh, in these slides, if you want to find me at any point, just look at my last name. I’m fine and I’m pretty much that everywhere except instagram or I’m in finding

what’s with the instagram changing where people’s names, right? The slope is where name is different. My name is Aaron. I live in upstate new york. I am a senior back end of in ruby on rails. I work at radius networks, which is A. D. C. Company. Uh I’ve also worked at U. S. C. I. S. Bold penguin in Ohio briefly worked at home chef and I’ve worked at Cornell University as well. That’s Michael and I met at through higher ed. I’m awesome at slide shows and you can find me by the name Armadillo pretty much everywhere.

Um, get harbors road like you to see me. But you can also go to see me on twitter if you want to see shit posting, sorry, crap posting.

Mm

What are you drinking Michael?

Uh, this evening I am drinking from the valleys of my local neighborhood grocery store. Uh allure al oh it’s an aloe vera mangosteen and mango juice cocktail with absolutely no alcohol in it.

Up. This evening. I’ve got from the glorious people at snap step that play that novel raspberry tea. Just getting it Snapple raspberry. It’s delicious. Um Such a drink, babies by the picture at Applebee’s many, many years ago when I was 20 or something.

So we were going to talk about these ideas of a usability and accessibility, you’ll hear these words thrown around a lot, hopefully you’ve heard them in some of your classes and and learnings over the past few years. This these ideas tend to follow each other in a very close lockstep. Um and so we want to help you understand kind of how these things interplay and why they matter. Um and and how we think of them sort of in the professional industry when we’re building things and and what happens there.

So this is kind of an idea. I was trying to visualize like how do usability and accessibility relate to design in general? And I was visualizing it as this idea of kind of preparing to go on like a hike that might involve camping or you know, sketchy terrain, that kind of thing. And accessibility is like preparing the things that you need to like your backpack, your shoes, your canteen, These things that you need in order to be able to do the hike at all. Accessibility is, and a technical perspective, like can you see and read the website, can you see what’s on the screen?

Can interact with it? Like anyone can we need to like equalized to that, everyone needs to have water for the hike, everyone needs to have foot covering, it’s appropriate for them, need to have something to put your stuff in and you carry your tent and all that. And then usability is more like making the experience of the hike as like reducing the friction as much as possible, which can be things like signposts and pathways and if appropriate stairways here in ethical we have lots of beautiful hiking trails but they’re also very steep.

So there are lots of stairs on all of them. And then once you’ve solved or addressed both of those issues, then you can get to the actual experience itself and really focus on the design and just the everything else really. But you have to satisfy accessibility, have to get your gear first and then you concern yourself with making sure that you can reduce the friction as much as possible and then everything else comes into play.

Yeah. So what we’re getting to is this idea of accessibility being kind of foundational to everything that you do and design. Accessibility comes first should that’s the key word there. You’ll hear a lot of times about people working on accessibility after after the factor doing remediation. Um if you pay attention to the field at all, you know, there are a lot of lawsuits that are happening over the last three years. The rate has roughly tripled give or take. Uh and the prison these problems exist is because we don’t treat it as foundational frequently enough.

Why does any of this matter? Number one is real simple. In this country, we have 328 million people. 51 million of them have some amount of disability that affects their ability to use a website. It’s roughly 1/6 of our population. And there’s another interesting fact about this. Keep this number kind of in your head though, for the moment, 60% of people who use screen readers feel that content accessibility has gotten worse over the recent years. Could you

clarify for the audience what a screen reader is?

Um I don’t worry, I will tell you what it is, I know this is for you more than them. Um So a screen reader is a way that somebody who has a visual impairment, they can’t see the screen well, or at all, they will use a screen reader literally to read the screen to them, It tells them what they are seeing. These can be built into browsers, they can be part of the operating system. Um phone usage of screen readers has increased by like 70% over the last five years.

So this is a way of somebody who can’t see content learning what’s on their page, which is very important to their ability to complete tasks uh Of users who have some sort of disability that affects them with the Web, of them will leave a website that’s not accessible. This is a baseline usability staff that’s telling you like for these people that 51 million number, 71% of those people will leave a website if they can’t use it because of their disability if they aren’t being served. It’s it’s a really 35 million I think.

Yeah. Yeah, huge number in that case. Now In the in this study from Crown Peak they did a scan of the Fortune 100 companies. These are the biggest corporations in the United States. They found among those sites 815,600 week high compliance issues at those companies.

Okay, so I’m asking for a friend what’s weak ag

gag web content accessibility guidelines. So these are the things that tell us how to make something accessible.

That’s that’s the ones that are put out by the W three. Right.

Right. Yes. Three Consortium W three years behind html. Everything. Yeah, they’re the guys and gals that are behind that. Um, so these issues, this number is small. I want to be clear because The thing is those scans can only automate so many detections. A lot of week had compliance is done through manual tests. So this 815,000 number is actually much higher when you factor in the number of things that would have to be remediated through manual testing. Here’s the stat though, that I love of that number. 815,086% of them violated. We cag level A

Is the Good one. Right? That’s operating

uh, A is a rating. Yes. It is the lowest level, lowest bar to get over. Basically. It’s the minimum standard. There’s a there’s double and then there’s triple a uh, like Bond rating. So we’re talking about only 14% were among the medium and high level compliance standards, 86% of them were missing. Things like putting all text on images, making sure you’re compliant or your contrast compliance was correct. These things are easy to do if you know a little bit about those standards and start studying how to bake them into your design process from the start.

But here’s the thing, right? 51 million people in this country with disabilities. You’re going to be one of them. Think about the fact that, yeah, some of you folks who are watching and listening to this right now, you are not, not disabled. Another way that we think about this is your temporarily abled. You’re young probably you’re, I’m sure have keen eyesight. You’re not an old man like me yet. My, my wrist was hurting me the other day. I had to wear a brace on it for a while and impeded my ability to use the mouse. Like everybody can always become disabled at any point.

Maybe not permanently, but you’re always throughout life going to interact with things in different ways based on what abilities you have. It’s a lot of ways this can factor in. So maybe that’s fine. Motor controls. Maybe that’s an issue with Dyslexia. Dyslexia affects between five and 17% of the entire United States population. You may have issues with colour contrast or picking out colors, like having colorblindness, one in 10 men is color blind to some degree. You can also have issues neurological issues like sensitivity to flashing.

If you see a lot of motion on screen, it can make you dizzy or give you headaches and you may have other reading comprehension problems. These are all things that can come and go with some people. Um, and this doesn’t get into things like, hey, I broke my wrist, you know, let’s say, or maybe I got an ear infection and I can’t hear right now. There’s a lot of things, these, what we call temporal problems. They’re only there for a limited amount of time, but they can affect the way that you interact with the things around you. Let’s take one of these. I find,

I, I find that um, auditory processing is difficult for me sometimes. And so when I’m watching a video, whether it’s a movie on my television or like a video on Youtube or something, when I can have close captioning enabled, it makes it so much easier for you to be able to take content in because then I don’t have to spend the extra effort to decode the audio in my brain.

Yeah. Some people simply process information in different ways better. So if we take the high number I said between five and 15% or five and 17% of americans have dyslexia, dyslexia in the United States. That can be upwards of 55 million people think about how this would impact them. For instance, everybody’s had to use a capture at some point. Or maybe you use something that has two factor authentication. Imagine for a moment that you have a you have problems reading letters and numbers in the order that they appear in.

Or maybe you have problems discerning anything that’s got funny shapes associated with it. Right? Imagine how that first capture could be problematic in trying to figure out what it says.

All right. Look, I swear I see a V at the beginning. I think it’s just a scribble.

Yeah, I would totally

be there is it? If

you don’t have dyslexia. But that’s the problem. And when we think about this captures in particular pose really significant accessibility challenges. If we get into something like the little puzzle piece ones. Cloudflare used to using, I don’t know if they still do. Um but you have to drag the puzzle piece to where it goes and then slide the little activator bar underneath it, both using fine motor control. So if you don’t have good control of your mouse, this can pose a significant barrier to entry for somebody with the technology that they’re using.

So so about what we can do about the accessibility side of things. Because here’s the thing we cag the web content accessibility guidelines provide checkpoints. It’s basically a list of things to do That’s very, I would say very easy. Um It’s a long list, trust me, but it’s a very clear list. It’s like you do these things, you meet the legal requirements. I hate that because you shouldn’t do things under threat of legal consequences. And throughout the rest of this talk we’re going to kind of explain why there are more reasons to get into this stuff besides just the legal aspect.

But for the week at checkpoints in particular, think about things like how they provide guidance for the markup that you may be riding, are engaged with or dealing with content creation or design elements. So some examples of this that are very simple things that you can go check on a website right now. Make sure if you’re including an image that is in any way informational related to the page provide alternative text for it. Very straightforward. Make sure if you have something clickable That it’s not an icon that 16 pixels by 16 pixels minimum.

Hit box sizes should be 44 pixels according to Wiki level double A. And then another common one is color contrast. We love putting like you know whites and grays together sometimes or whites and blues together. But minimum contrast for accessibility is 4.5 to 1. And there are 1000 tools that can help you deal with that and measure those numbers. You don’t have to know them off the top of your head. But those are things that are very simple remediation efforts that start to hit some of these things to help out folks who are using your site.

They’re actually a number of browser plug ins that can also help with this. Go check out wave or check out acts. Um Those are two very good ones Andy from the Social Security Administration. Um They provide a tool as well and I have one that I really like, which is the front end CSS letter accessibility dot CSS And you can just google that and find it on gIT hub. They have a version, you can drop into your site development so it will just show up on your site or they have a browser plug in to let you use it anywhere that you want to use it just by clicking the button.

But it will highlight common markup problems that can make a page hard for somebody to read or understand. Very very simple but very quick. Um Another thing you can do is make sure you test your work with assistive technologies and what do I mean by that? I’m thinking for instance those screen readers we talked about you can go download jaws or in V. A. Those things are free I think jesus free. I have to double check that. I know NVIDIA is

um that’s one built into

chrome, has one and most operating systems have one baked in as well. Um you just have to go through your accessibility settings to turn it on, but spend some time once in a while and turn one on and listen whatever your building is. It? A website is a web application, a mobile application, turn it on and listen to the way it reads your site and see if it makes sense

if you at U. W. I’m assuming you, you might have some kind of like assistive technologies person or hopefully department um if you have someone there that actually uses jaws or a screen reader or something and you can get an appointment with them to actually see them use it, it is mind blowing and life changing and I had the joy of getting to do this really in my career. And it has stuck with me ever since. I’ve not forgotten it. And this was over Over 10 years ago, maybe 15 years ago.

It, believe me using it yourself is only the tip of the iceberg because yeah, it’s that the speed with which people consume information that way, who have been doing it for decades. Well yeah, it’s it’s absolutely mind blowing the difference but it also emphasizes why you need to talk to those people when you’re building stuff for them. Uh Some other things you can do, make sure you throw away your mouse once in a while. I try to use whatever it is you’re making with the keyboard and make sure it’s keyboard navigable.

Uh put your browser in high contrast mode, see what it does to your CSS and your design. Um and make sure you use browser zoom, See what happens to that page. If somebody blows it up to. I think the weekend standard is um, it has to maintain flow up to 400% is the number you the last thing user test. So for instance, those screen reader, users get them in a room at some point have one try something that you’re building and see if they can do what it is you want them to do.

All of this is for not if you don’t spend time talking to actual human beings and not proxy in your own experiences through what you build or what you design, that will get you so much farther down that road to understanding the different ways that people consume information. And it’s going to lead into what we’re talking about when it comes to inclusive design.

So I’m going to talk a little bit about usability. Did that work?

It worked, but it went the wrong direction. Yes, there we go. Okay, cool.

All right. So um, this is a quote from the Nielsen norman group, You’re all smart people, you can read that yourself, but I’d like to talk to you a little bit about who the Nielsen norman group is because uh, it’s Jacob Nielson and Donald norman. And if you’ve been in the usability game at all for a while, those names should be instantly recognizable. Jacob Nielson has been doing usability studies and user testing for Man since the 90s. I think definitely since the very early two thousand’s a very long time.

Um, he’s written books, he has had multiple websites. He was, I think a consultant for Sun for a while. Um Donald norman wrote the design of everyday things and

many, many other books.

Yeah, I have a couple of them. Design of everyday things is a little academic and or read and it’s a little dense but it’s it’s very engaging and it’s fascinating and I highly recommend reading it if you get a chance to. Um but this like usability is um something that you have to factor in not at the end as an afterthought but as a way or as an approach of how you’re designing your product, whatever your product is.

One of the concepts that Donald norman talks about in his book and actually other usability people talk about it frequently to is afford ince’s which are things like uh we compare this like if you go to a website for the first time or if you pick up a product from your local appliance store or something and you’re interacting with it, you’re going to look at it and you’re gonna say like um okay well can I tap this? Can I click on it? How do you interact with it? You have to learn how to engage with the product?

Whatever the product is afford Ince’s mean that you are adding things to the product that are familiar to the user to reduce the friction of having to learn how to interact with it. So we know what light switches look like. They’re pretty standard. We know what light bulbs look like. They’re pretty standard shape. I think there’s actually an I. S. O. Specification for the diameter of the screws on the light bulbs.

Um These are things that like the fact that they are standard means that you can go to any house and you can probably figure out how to turn the lights on and off in most houses. And that’s that’s really important because if you don’t know how to do that, if you have to relearn every time you go to someone’s house, it’s gonna be very frustrating. It’s gonna be a poor user experience. So in a good example is these are called norman doors. Um, so the one on the left is a comic from Gary Larson the far side and it’s, you know, a little bit of irony there.

Um, but the one on the right is a real world example and you can see both the doors look identical, but they had to add instructions to the doors so that people know how to interact with them. That’s a design failure. You shouldn’t have to add that. The the if you’re designing interface correctly, it should be easy to use correctly and hard to use incorrect. So a better example would be this one which is the link is in the bottom there for the source. Um, this is great. The push one has a flat panel, you can’t pull it, you can’t use it incorrectly.

And technically the one on the right side, you could push it. I mean you can push any kind of door, the vertical surface, but it has a handle, their, which suggests you can pull it so it makes it easy to pull, which suggests that you should pull. That’s a good design. It’s easy to use, easy to learn how to interface with it. And that’s just the door if you have a website or any kind of application or something technical and you put a save icon, Michael and I are old enough that we remember 3.5 inch floppies.

Maybe some of you have seen them before, but um, younger people don’t, and they’re, you know, maybe they’ve used cd Rom’s but you don’t usually save to a cd, probably everyone’s used USB sticks, but those don’t really have like a consistent design, so it’s hard to use that as an icon. Um so instead of using an icon like that, then there may not be kind of antagonistic I guess.

Um just use a beveled button like this and use the word safe, make the intent very clear the fact that it’s a bevel is providing an afford INSP that suggest it can be pressed or it can be pushed, so that means that it’s clickable and that is an easier kind of thing to interface with than maybe something that’s unclear about its intent. Um so if you’ve ever heard of the phrase mess around and find out, um so in in the book designing everyday things norman talks about these two concepts that I think are really cool and a great in when you’re approaching how you want to interact with or how you want to view accessibility in your product.

The gulf of execution is refers to the period of time from when you first, you know, lift the cloth off the product and you’re looking at it and you’re trying to figure out how do we interact with it? And this is where afford it has become really important because the afford ince’s help you quickly learn what kinds of things you can do with. If it’s a button, you can push it. If it’s a switch, you can flip it if it has a spout on it, something probably comes out. Um and the gulf of execution are is you’re asking questions like what can I do?

Um what can I how can I learn more about this? Um what kind of experiments you can do while you’re playing with it and unlabeled buttons or as a steve Krug calls them mystery meat navigation. Generally unhelpful. Um it’s better to have a button that has labels on it and where the the task that can be accomplished by interacting with it is we’re the user and then find out is the gulf evaluation that’s after you’ve interacted after you’ve had done something with. The thing, is it clearer that your your task is complete? Click the save button, how do I know if it’s saved?

You know it, does it show something on the screen that says success. Does it just silently sit there and you just assume that it or hope that it did. Um you have to open up your like traffic analysis and look and see if the request like bounced back or anything. Um It’s important to provide a user the assurance that their task is done and that they have successfully completed it because if you don’t then they’re going to be wondering. They are the task that they’re coming in with that they want to complete.

They can’t close that tab out in their brain as long as they don’t know that the task has been completed. So the gulf evaluation gives them feedback to say you are good to close that tab in your brain go for it. Um And so yes this is from um M um so in this case fan house has a cool hat on his head which means that he is successfully like everyone he loves has died. If you’ve seen the Avengers movie you’ll get the joke. Um Yeah but it’s important to have some kind of feedback to the user that their task successfully completed.

Um The last thing I wanna talk about for usability is cognitive load and this is kind of this is like the browser tab that is talking about in your brain. It’s the more things you have going on at once, the more tabs you have open your brain that you have to keep track of and keep running. This is like kind of using your working memory to keep all of these active and going. I call it like juggling but with your mind um like you’ve got a guy here and this this person is metaphorically interacting with like a website and he’s trying to find a job on a website.

And so each of these balls represents a different like browser tabs got open in his head and I’d like to point out that like one of these things is the one that says I mean that’s here. Um the one that says the site called jobs careers. That’s something that they’ve had to learn about your site. And so this is that one is an opportunity to create an afford. It’s um steve Krug in the book. Don’t make me think. He talks a lot about, don’t use cute words for things. Use the words that are familiar to people. Most people are using other sites on the internet.

And so you want to like use the knowledge that Dave gain on those other sites as much as possible because it will make the experience easier. The actual task this user once is where can they find salary ranges?

And so they had to learn that the job the site called jobs careers, but also this person has to remember because there are human other stuff in their life, so they have to pick up some groceries on the way home, um they have a parking meter, there’s 45 minutes left, they have to get to And then there’s just some random ticking noise in the background and maybe it’s one of the 72 browser tabs they have opened. So all these things are part of their own human experience that are completely separate from the interface that they’re dealing with.

And um I’ve got an example, personal one that I want to bring up later because it will fit better with something Michael’s gonna talk about. But the point here though is that your users are humans and whatever pristine vacuum you’re designing your interface in, it is going to have to collide with a complicated human being at some point. And that complicated human being is going to bring all this chaos that they have in their own experience and run that into your interface.

A human who may be in crisis too. Because keep in mind if you’re, if you’re talking about, especially the subject of telehealth or anything in the healthcare industry, people seek out that care most frequently when they are in trouble and so they have that added burden associated with them. We we are terribly, you know, not preemptive in medical care too frequently. So if I am already in crisis for something that’s one more ball, in many cases, maybe maybe medicine ball to depend another metaphor.

Uh, I just, but just to reiterate like these balls that are in the air, this person struggling, I arbitrarily picked. The number is probably actually much bigger. And the what you want to do when you’re designing your interface is to minimize the number of balls, browser tabs, whatever you want to metaphor you in two years, minimize the number that they have to take on to get the thing they need to do done. Um, The book don’t make me think about steve Krug. It’s a very easy read. It’s not, I think it’s maybe 100 pages, lots of pictures and graphics and things. It’s excellent. I love it.

And his whole thing is about reducing cognitive load as much as possible. And the phrase don’t make me think is referring to don’t make me think about what I need to do to interact with your site. Don’t. Um, what he’s saying is reduce the costs, reduce the gulf of execution as much as possible. Make it really clear what I can do and how to do it and then don’t make me think about the things that I have in process that I don’t know if they’re done or not reduce the gulf of evaluation as well.

Um because the user experience isn’t how many clicks it takes to get from the homepage to the salary ranges. These are experiences. How much do I have to think about how to get from there to there or and the telehealth example? How do I get the care that I need as quickly as possible? Um even though I’m like bleeding or whatever, whatever the situation may be. Um

so when we talk about these these concepts, right. Accessibility is a checklist basically there there there is a finite number of things you can do to make a website accessible and if you do those things, you probably have succeeded. Usability is an outcome. It’s a it’s a product, it’s a byproduct of good processes, good techniques and and good execution. So what we want to do now is talk about inclusive design because what what inclusive design does is it takes these kind of ideas, smashes them together and anchors them for you in a repeatable process, that you can then apply to the way you work.

So if you go over to the inclusive design toolkit, they’ve got this, they say that that inclusive design is the design of mainstream products and or services that are accessible to and usable by as many people as reasonably possible without the need for special adaptation or specialized design. What does that mean? That’s this idea that I had mentioned earlier, for instance, like accessibility deals with things like if the user is blind, then this should be the thing you do. But it doesn’t care as much about if the user is blind for the moment, but maybe won’t be later.

Or if the user is outside in the sun and there’s glare on their screen and they can’t see it very well. There’s a lot of use cases that start to fall in. And what we learn with inclusive design is that a lot of these actions you take from the purposes of accessibility, actually have much larger broad spectrum benefits. So the way I say this is inclusive design is designed to keep you honest to yourself and to your process. So you’re going to hear a lot of words thrown around. Sometimes in conjunction with this, you’ll hear inclusive design.

You’ll also hear things like accessible design or universal design and ethical design if you want to go that direction. And you may ask, well, what’s the difference between all of these and there are subtle differences between them, but there’s a huge amount of overlap. I was going through the wrong side, so I wasn’t I? Yeah, I

was gonna say I thought maybe on my screen,

that was me by my apologies. Got notes on one side and slide deck on the other. Uh, so this idea they overlap. They have a lot in common, but they are suddenly different. But it’s okay to kind of use them a little bit interchangeably. That I think maybe one of the best ways to kind of phrase this is an idea of thinking about something called kind design. I like, I like kind of design, right? Because you’re trying to make something good for the user that they can, you know, complete their task with whatever that may be.

Because here’s the thing, if you think about accessibility and usability in a vacuum, what you get is sort of this austere kind of antiseptic build because you can build something that is technically usable and is technically accessible. That is still bad. We actually

good kindness means kindness means factoring in that humans are using your product and that the audience of the kinds of humans that are using your product um might have additional complexities when they collide with your user interface. So

what happens when you don’t do kind design? We have a name for it. It’s like, yeah, like the opposite, Like literally the opposite of being kind. It’s hostile design. You may also hear this called dark patterns depending on where you’re eating. But hostile design is incompatible with inclusive design. They are diametrically opposed and they cannot be done together because hostile design is all about. When you learn about user experience and user research and user testing, you learn very powerful techniques to figure out what users want and how users work.

Now you have a choice to make, what are you gonna do with that information? What you gonna do with that power Because you can use that power for good or you can use that power for evil and hospital design is where that comes in to working for evil. All of us have probably dealt with this over the last couple months. We all filed our taxes probably or have in the past, hopefully uh universally most people have complaints about the software. They used to do that.

If you did it with software, they’re constantly trying to Upsell you, they’re constantly trying to get you to use something that you don’t need or don’t want. This is a screenshot from TurboTax and there’s a little link that is highlighted in the lower left. I have a service code. What does that mean? That means your employer at some companies, they will pay for you to use TurboTax, just kinda like insurance and other things. Your company went to TurboTax and said, we’ve got 1000 employees, we want them to use your software, cut us a deal and we’ll let them use it.

And so they may Come out and say, you know what I find it’s $75 a user. But If they can get you to pay $129.98, well that’s not their fault. You didn’t click the link in my mind using a service code, you’ll see there’s a button here that says view payment options. Well, I have a service code. My service code is my payment option. That’s the way I’m going to pay for this, the way my employer told me. And instead they de emphasized that link and intentionally try to misdirect you to do the wrong thing and double dip.

Now your employer has paid for your code, but you’ve also paid to use the service even more. These are hostile design patterns.

TurboTax is actually really, really bad at this about this and they have like resisted legislation that would improve it.

So there are a lot of hostile design patterns and this list is not all inclusive. And we will come up with new categories as technology changes as websites change. But things like trick questions, roach, motel, hidden costs, confirm shaming. These are just a few of that model that

I don’t think I’ve ever seen privacy suckering before, that

there’s a link in the lower right corner. You can go read all about it. But these techniques are designed to take what we know about user experience and use them against users to get them to do things that they don’t want to do and we can’t operate that way. That’s not how we should be building websites. So let’s put this into practice a little bit inclusive design. I said takes accessibility, takes usability and bridges these things that puts them together to make something greater than the sum of their parts.

So imagine you’ve got a video, the video has closed captions and immediately you think, great, I solved my accessibility problem. Somebody who’s deaf can now get the content of that video and my work is done. But inclusive design says, yeah, but how does that actually help us in a much broader context in conversation. So here’s your pop quiz, complete with answers. Why include subtitles with video content? Well, obviously, we have taken care of the accessibility problem.

We’ve made strict accessibility compliance Number one is taken care of but we’ve also taken care of our temporary disabilities, that person with the ear infection who can’t hear right now. Well, they can now take care of that, but you’ve also accommodated people with a temporal inconvenience, for instance, they’re traveling on the subway right now and they don’t want to turn their speaker ups with everybody around them. Here’s what they’re listening to or what about folks were in a different location.

If I work in an office every day and it’s an open concept office, then I may not have the luxury of turning speakers on in that situation or have headphones. So you have made that content inherently accessible to a much broader group of people outside of just those simple checkpoints. I’ll put this into another sort of context. Let’s move this Meatspace. What you have is this problem with elevators.

If you build a building and realize Five years later that you built a 10 story building with no elevator in it, it’s gonna be really hard to go back and add that elevator in and it’s gonna be really expensive When we approach is we’re really good about this in the construction space to write, we have entire code standards that tell us how to make a structure 88 accessible. And from the start when we design those buildings and make those plans, we factor in ramps, we factor in automatic doors, we factor in elevators, we take care of all of these things, the elevator goes in.

Yes, we’ve checked the box. Somebody with a wheelchair can now get to the fourth floor but I tore my A. C. L. A few years back. What about me? I’m on crutches, I benefit from the elevator or maybe I just got back from the gym and I’m just looking at that staircase and I’m saying no man, I’m not doing those stairs right now, it was leg day. Uh I worry baby. Just I’m just lazy.

Uh That elevator literally benefits everyone even though if people were allowed they would cut that from their list. They would say that’s a four story building. It’s not a big deal. I can walk up those steps, I substitute my experience for everybody else and I want to save that money but we don’t

do anything with with wheelchair access ramps around. Everyone can walk

up, everyone can walk up a rap. So this is what happens when inclusive design starts to think about your spatial relations. One more good example thinking about parking spaces. So when we talk about accessible design there is an 80 a standard that tells you if you have 25 parking spaces you need one of them to be 88 accessible. If we look on the right we see five Handicap parking spaces that means they have up to 150 parking spaces. And according to the A. D. A. one of those spaces has to be van accessible.

But somebody looked at this and said why don’t we make all of them being accessible? We can do that. We can take these spaces that are good for everybody who needs access to the walkway there and to get where they’re going and we can make this design better. And instead of meeting the minimum letter of the law we can design this space inclusively to accommodate anybody who wants to park there. So let’s just make all of them being accessible. That person was very small. But

the the experience that I mentioned earlier that is relevant here is um I was looking for a um A psychiatrist to that I could prescribe me 80 HD medication because I’m neurodivergent and executive dysfunction can make it very hard to do things. What I got was this literally I think it was six pages long intake form. It was it was on the web, but it was like six or more pages of all the stuff that I did fill out and creating things that I had to write.

It literally took me two weeks to fill that out for exactly the reason that I was trying to see this person. So this person was knows the difficulty I’m having and the reason why I’m coming to them in the first place and still made me do this thing. It’s like like oh well we are having trouble breathing, so climb all those stairs up here and then tell us

so I’m going to end on a quote here. This comes from an article over at top tall. They say these barriers when they say these barriers, they mean like the things that prevent folks from doing something that six page form. These are often created inadvertently during the design process when designers great products for people like themselves. What that means is we’re not mean spirited, we’re not out to make bad things.

It’s just that we don’t realize sometimes the things we’re doing if we aren’t constantly testing, they go on to say by employing inclusive design methodology and empathizing with diverse groups of people, designers can create products that are accessible to all. So when you get into this space, understand the web changes, technology changes. People change the goal you should have is getting up every day and thinking about making something you are proud of.

Making something that moves people in the right direction and make sure that you test those assumptions and fix things as they change because they will always change and that is not a failure. It’s not something broken, it’s just that people adapt, Technology changes. We, we will have tools next year that we don’t have now. We will have ways of using websites that 10 years from now that we don’t have now and that will impact the way we design and build websites. And so I think

to go to expand on that a little bit with the point from earlier. Um, being kind means remembering that humans are using your product and especially like in the health field like what kinds of challenges and difficulties will these humans specifically be facing and will that factor in their ability to interact with the product we’re making?

It’s at the end of the day, I was a communications major in college and there’s a lot of different methodologies of communication and one of them that I’ve always spoken to and I really love emphasizing is this idea that at the end of the day, everything that we do on the internet boils down to one human being, trying to interact with another human being and everything else is in the way. And so our job as designers, as developers is to minimize all that noise that is in between those two people.

So that’s your job and that’s what I’m setting you off to go do with what we’ve been talking about here and I hope that this has helped you and turned you on to some new stuff and gives you something to go look at and research and and just think about

Michael that entire time I kept waiting for you to say keep your person is close to the closer

that happens at the end, which means if folks want to find out more about us. We are the drunken ux podcast. If you go to drunken ux dot com slash ux at U W. That will get you a list of links for everything we have, from subscribing to the show to uh, following us on the social media’s. Uh, otherwise, I mean you can do with all of this what you will. Um, I also emphasize it has nothing to do with the talk but do less better. Don’t do everything badly.

Do less better because when you would you do that and you focus on that, you realize that you just have to keep your persona is close and your users closer. Thanks for having us. And I’m happy to answer any questions.

Yeah, I’m also happy to answer questions. Thank you guys so much. I

was very insightful, appreciate all of that. But um, right off the bat I did have a couple of thoughts to that I wanted to share with you guys because yeah, I definitely took away a lot. I actually am also a communication major as well. My experience in UX is fairly limited actually, but our president of our club actually very nicely, uh, invited me to be the marketing director and throughout this whole process of three quarters,

I, I’ve learned so much about design and integration of user experience and user interface and how it’s just constantly surrounding us. Um, and I’m absolutely in love with it now. So, um, yeah, that’s really cool. You guys touched on some of,

Uh, interesting. I love to tell folks, yes, I was a communications major, but I was more than that because I was, I actually was a theater major of all things in college and I have been building why I started building websites in the 1990s and I’ve been doing it professionally for the last 15 years. Um, it anybody can get into this space and I encourage them and I love communication majors because of that exact thing. I talked about everything we do is about helping people interact with each other, even though you may think, well I’m just using that computer, whatever.

Well, yeah, but somebody has to fulfill that order or you’re trying to get information on, you know, if you’ve ever like done research on any kind of medical situation, you know that there’s a ton of just terrible websites out there with information on all these diseases or conditions that are really there to sell you something or get in the way. And it’s really speaks volumes to how far we have to go to really distill our processes down to something more pure I think, and it’s gonna be a long road, but the com majors of the world are there to change it.

So I have faith in you that that helps me, that makes me feel a little bit better.

So uh

and we actually have a question in the chat regarding communication major as well, um Dayton as being a comm major, do you find yourself having skill sets or knowledge, is that other designers don’t usually have?

Um what I’ll say is I can always teach people to code. Code is relatively simple. when you really boil it down, the thing that calm people are always consistently good at is that the human side of our work um when you, especially if you work at a large company where you may have a development team, you may have a marketing team, you may have a content team, you have a deVOPS team, you’ve got all of these disparate people all coming together to make a website run and the people who understand how to talk to all of those people and interact with them on their level are the ones that sort of make the wheel turn.

You know, they operate as that hub because it’s very easy for and this is not a knock on computer science or anything. But there there are types of developers who are just really good at development but they aren’t necessarily good at explaining those concepts to a marketer for instance and that’s okay. That’s that’s just something not everybody is good at but the the people who can emphasize crossing those borders will find themselves I think in in very good spaces two coordinate and facilitate.

I wasn’t a compass major, I was a chemistry major. But um I I did work with the communications department for about four years and I can confirm that like the audience centred focus of working with communications is a really really great segue into user centered design and and just kind of um focusing on the human portion of the finger developing and not just on

a human centered design is also another one of those phrases that you’ll hear kind of used in tandem with inclusive design very much I still like kind of like I know

we just started talking about that earlier today but I really like that wording.

Yeah, kind of bridging the gap between the company and the product and the people that are going to use it for the intricate scene between anybody do. Usability has a responsibility in my eyes to advocate for those users, the folks behind on the other side of the monitor that you never see because business will always try to steamroll the fastest solution. The cheapest solution and frequently what suffers is testing and research.

Mm Yeah,

that’s awesome. Anybody in the zoom have anything to add. Yeah. Michael Barron. Uh, I’d be really curious to hear your thoughts maybe on my accessibility when it comes to newer technologies like VUIS, things like that. Um, if there’s like, you know, appropriate times that you say would be best in terms of accessibility and once that maybe avoid

these types of things, I will answer very directly on that as far as like the UI goes, which is a voice user interface for anybody who’s unfamiliar voice in particular. Um, has one incredibly unique and hard to overcome accessibility challenge and I genuinely don’t know what the solution is at this point, but um, one of the key qualities of usability is learn ability or sometimes we use the word discovery, ability and view is inherently hide their entire interface. You are forced to guess what you can ask it.

And anybody who has a google assistant or an Alexa has sat around once or twice asking it the dumbest questions just to see what it will respond with. Because confirmed there’s no other way to know everything it can do as a result. Um they have to be paired with um they have to be paired with some kind of tangible U. I. One of the best examples I know of is Domino’s Pizza who has a voice ordering system that dovetails directly with their normal mobile app.

And so you can actually go in with their voice ordering and say I want a medium two topping pizza, gluten free crust with mushrooms and chicken. And it has the natural language processing there to break that down and understand what you’re asking for it. But NLP is still very limited, it is very garbage in garbage out um and it can only do as much as we tell it chatbots if anybody wants a really, really fun episode to go listen to go to the web, the drunken UX website and search for my rant on chatbots.

I was alone for an hour erin was out traveling that week and so I did a solo episode where for an hour, I explained why chatbots are terrible for you. X

It’s pretty great. I

did have a thought about that though, about like the innovation of us, you kind of touched on it a little bit but um when you were talking about afford Ince’s and integrating concepts that people are familiar with. Where is that kind of line drawn between keeping it familiar but as well as maybe introducing new concepts and designs that might cater to more people.

So do you remember um I don’t know if you look at the history of the iphone, but when the first iphone came out the Apple was really, really huge on

um I forget the name of dwarfism. Heard, I’m thank you. I know exactly where you’re gonna make that.

Yeah, it’s making the buttons on the screen look like actual buttons that you can literally press. Like give them three D. Treatment knobs

look like radio knobs. Yes,

so they did that at first because this was a like a touch screen technology was something you only saw in movies at the time. And so the idea that you might have a device in your hand that you can interface with by touching like a screen um was so wild that what they realized was we need to make this as obvious as possible. And so those are the afford ince’s on that side.

Go, go look up if anybody wants to Google that it’s skewing Dwarfism is the name of it. Um 2007 was when the iPhone launched and that was like, that was the big conversation was transposing Uh physical reality to a digital interface for the sake of familiarity. And we did that that that impacted design for 10 years after that.

And it And if you look at the design about, I think it was roughly 10 years after that or at least several Apple switched doing flat design. So they went away from the skin dwarfism and they went towards um something that was maybe more of an aesthetic choice because they knew that we have all kind of collectively learned. You can tap things on a screen.

That’s where there towards the end of the talk when I was talking about how usability changes, your users change their experiences change, they understand interfaces, anybody who has a young brother or sister now or a niece or a nephew who’s 3, 4 years old, watch a music tablet and the amount of understanding they have of those interfaces at a very, very young age and consider how that is going to impact, how they use touch interfaces when they’re 18, 19, 20 years old or 50, 60 years old because this is all very…

I I love the age I am because I literally when I went to school there was not a computer in a classroom to now, I’m on the bleeding edge of building websites for you know, a huge company and and I’m in on all of this fundamental technology that I got to own at every generation where it came up with us. So all of our experiences are going to be very, very different. So we just have to always be listening. We have to always be talking to those folks.

I want to briefly go back to Dayton’s question about the voice interfaces. Um, I one thing that I think that we can do with those is um, showing, if possible, showing the text of what the computer heard you say on the screen or some kind of feedback like that. Um, sometimes on the phone, if you’re doing a view i with like a the where the computers ask you questions and you’re interfacing it that way. Sometimes the computer will say back to you, I think you’re asking for this, is that correct?

That’s also useful if the if that’s the mentality you’re doing if it doesn’t have a visual component. Um But showing the feedback of what the computer is thinking you’re asking or thinking you’re working with is really really helpful for you knowing that you’re being heard correctly. Just like we were talking with a human being for them to say back to you. I think you’re saying this to me, is that right? Like that’s a really effective communication technique when talking with people.

But we need it need it even more so with computers, especially if you’re dealing with complicated interactions like the dominoes example, I would expect if I was a user that when I’m saying these words to the thing I’m expecting to see feedback on the screen, that’s showing me the things that I’m saying and like building it out on the screen somehow. Um So that I know that I’m being Hurt.

I think you wanted to murder all jetties. Shall I execute order 66?

I think that’s that’s sort of the human component though, right? Like remembering that ultimately the devices interacting with a human and you’re a human creating the device. So how can you be kind to that future human to interact with the device? Like what can you factor in?

Awesome, awesome guys. Um thank you once again uh for your time and Shane dropping all of these knowledge bombs on us about U. X. And all the wonderful. Always happy to answer questions too. If anybody ever wants to hunt us down on discord or twitter we will always look at something or answer a question. Happy to help out anybody. Yeah let them uh tell everybody that came in a little bit late here where they can find you um what you have going on um different platforms when you guys do a podcast trucks. We are at drunken ux dot com.

If you hit drunken ux dot com slash ux at U. W. You will get a list of everywhere that we are from social media to subscriptions and everything in between. Um New episodes drop every monday. Uh Some upcoming topics. We have, our latest episode was on UX Research and the importance of UX Research. Um Next week we will be dropping an episode on static site generators um using Eleventy, we’ve also got some CSS animation stuff coming up, some website, testing, um testing automation work coming up so plenty in the pipeline every other monday.

Uh And otherwise I say if I won’t ramble off all our social media or nothing, you can find it on the website so easy, easy to track down.

Perfect. Uh if we can get some applause, appreciation, love and the chat for mike and Aaron given their time. Um, and yeah, thank you guys so much.

Thank you very much for having us.

Leave a Reply

Your email address will not be published. Required fields are marked *