 And what happened with these two passports was, is that better? Okay. Yo nací en Mexico y tengo los dos pasaportes. And from a very young age, I learned about this divide, which is something that's still part of my work. So Sheila mentioned this in her talk earlier about imposter syndrome, one foot in, one foot out. So with WordPress themes, you may have one foot in code, one foot in design. You may, a lot of us in this industry have introversion. So we like working at home on our computer, but we have a, in a venue like this, we're on the extroverted side of it, right? So we're sharing externally. So this, the reason that this was an awakening for me was because I realized this background, where I was the one who was the foreigner, right? A white kid in Mexico, playing soccer and trying to learn everything about that, was that I got really good at being a bridge between those two worlds. That's really what my work is today, bringing people from, that are not part of the equation into the equation. And so I wanted to talk about inclusive design in that way, because it means good design for everyone. And I've discovered that it coincides with the same principles and philosophies of WordPress. I'll talk about that a little bit today. But before we get into what inclusive design means, let's hear from some other people, some products, some real companies that you may or may not have heard of. Barclays, which is a bank in the UK, really understands this. They started doing product development, starting from one person's perspective, which was a blind user. This is Robin Maylan. And she wanted to be able to use the ATM without having to get help from someone else. So they started developing a mobile app, which had voice control. Well, what they found out was, it wasn't just a little bit of work for one person or an edge case, it was actually something that a lot of people wanted. So it turned into a commercial opportunity because that her specific solution led to a broader development for a lot of people. And if you think about mobile banking today, it's pretty standard, right? You can upload a check, you can do a lot of things that you would normally have to go in before. So Barclays figured that out by starting from someone who was typically excluded from that experience. And this is another blind person, Robin Christofferson. She talked a little bit about the same where they started from her access problem and came out with a solution that was really good for everyone. Oxo figured it out. This is one of my favorite product stories. It's not software, but it is a product that I have in my kitchen. Maybe you probably have seen it too. It's a peeler. And this story, Sam Farber, he's famous for making enamel cookware in the 60s. He was with his wife and she was trying to make an apple tart. She couldn't hold on to the metal, you know, those really sharp, small, old fashioned peeler. She just couldn't make it work. She had arthritis. So he thought, well, what if I could make something better? And it turned into what we now see, this kind of black handle. And if you get a chance, check out the video. I have a link to it in the slides. You don't have to write any of this down because all the slides have the links to all these videos. But basically, they go into a lot more of the detail. They took kind of like a rubber handle from a bicycle, you know, like a BMX bike and stuck that metal peeler into it and that kind of led them to discover this design. But it was also a commercial opportunity for them. It turned into a $60 million company in just a few years. So really going from one to many. Roku is another really great example. Who has experience with this? It's basically a TV alternative, right? So you can get rid of your cable and you can do streaming. But really what they got was simplicity. They started with the customers in mind who didn't know tech very well. So someone who didn't want to deal with like a hundred button remote. Or if you've looked at the interface, it's like really blocky and you can really only go one direction and then click. One of my favorite features is the one click Netflix button. So you just click Netflix and you're right in. But there's CEO. And by the way, I wanted to give a shout out to Leo who was not here. He injured his wrist. He was supposed to speak. He pointed me to this example last word camp Phoenix last year. They started with what customers want is easy. Again, starting with, I think they had in mind elderly folks who weren't really familiar with technology who just wanted to plug and play. And they also went to a very, very commercially successful. I think their market capitalization is like $7 billion now. This is an example from my work on WordPress.com. We scratched our own itch. We had a very popular blog that had 43 million people subscribed to it. And when I first joined, I was doing theme announcements and I would just break out in a cold sweat every time I had to post to this blog. Like what if I make a typo? The whole world sees this. So we had this little plugin that was just a JavaScript alert that said, are you sure if you click the publish button in WordPress? And it just popped up in your face and said, are you sure? If you hit cancel, it would go away. And if you hit yes, it went out. Well, we decided, why doesn't everyone else have this? Why are we just solving it just for ourselves? And so recently, just last fall, we launched this new screen which gives you one more confidence check before you go out to the world with all your content. And it also includes a visual preview, like in a tablet and a desktop and a mobile view. Basically just trying to reduce the anxiety around publishing. And we learned that we could solve that for, not just ourselves, but for everyone. So what do these product examples have in common? The first thing that comes to mind is they start with people, right? They start with a specific person. AJ in the last talk mentioned this. They were starting with someone really specific in mind. The other thing is, they point to the purpose of technology, which to me is to help people start. That's what it's for. And this coincides with WordPress. So going back to why I wanted to give this talk, this has kind of started to line up for me as I learned about inclusive design. This shares a lot of the same philosophies with WordPress. This philosophy of openness. At the same time, offering a practical way to expand your market by recognizing who's excluded and saying, I'm gonna open that up. And I'm gonna find a bigger, addressable market because of that. And WordPress has always been about websites, but it's really more than that. And this is something that's been learning for me. It's not just like technology. It's about freedom. It's about possibility. And really it's about carving out a livelihood, whether you're within that WordPress ecosystem, like a lot of us here, or if you're someone with a website, like the customers of our customers. We're trying to create a livelihood for ourselves and for them. And inclusive design really resonates with this because it talks about just like WordPress, democratizing publishing, but it can go beyond that. It can go to democratizing marketing or democratizing small business. You don't have to figure out all those same things because it's already been solved for you. I'd like to give a shout out to two strong voices in the inclusive design and general design community that have really made a big impact on me. They are Cat Homes and John Mita. Cat was formerly of Microsoft. She did a lot of work in this space. And I'm gonna mention and show a few of her slides from her research. And John works at Automatic and he's the head of design and inclusion. So it's part of his job title. And he's been a mentor to me and I really appreciate what he's taught me. One thing he does every year is he does a design and tech report which comes out with South by Southwest Festival. If you're familiar with that, it's in March every year in Austin. And part of this is like a broad overview of everything happening in technology, but from a design perspective. And one thing that captured me last year in this report was that adopting a more open approach means you have a larger market. And it finally kind of clicked for me. From Cat, I learned about turning accessibility all the way upside down. So instead of saying, that's an edge case that I have to figure out kind of at the end, you start with that. And realize that that person solving that person's problem may solve a lot of people's problem. And also really just, I'm gonna talk about this from her research too about building empathy and really getting to know what some of those problems are. So if there's one thing you take away from this talk, I want it to be this. Inclusive design is for those that wanna make great products for the greatest number of people. Instead of minimizing access and empathy and diversity into kind of a corner case, something that you maybe a stat in a chart that you might look at and say, oh, it's too small to worry about. Really keeping it central. Because you broaden your reach, you have a broader market to work with. It really is a design for everyone. And so I've been told that every presentation needs to have bullet points, so I put on some here. Just kidding. But this is what we've come to. So starting with Cat's work at Microsoft and our work in the last couple of months at Automatic, we started to come up with what we consider to be inclusive design. This is kind of a loose definition and I'll go into each of these. So recognizing exclusion, who's not part of the picture. Broadening perspectives to build empathy. Bringing diversity into teams and processes and that comes in many different forms. And then as these product stories showed us, solving for one case and then extending that to many. That's really the root of the inclusion part of it. This slide and one of the next ones is from Cat's work, Cat Homes work at Microsoft. And this was a really big turning point for me because I previously thought of accessibility as what basically was a medical condition. Like a permanent injury or someone who's deaf or blind. And in her work, she describes it as a mismatched condition. So instead of being the system that the person needs to adapt to, like a prosthetic leg or a hearing aid, the software, the product should adapt to the person. The human is at the center. So I realized that instead of thinking of them as edge cases, they should be more as mismatch between the person and the product. Here's an example. So imagine a permanent disability, someone who's like maybe an amputee, one arm. Then someone like Leah, who just got in an accident and has an injury, right? Or someone carrying a baby. They all have the same interaction with that product or software, but it's a very situational. One of them is temporary, one of them is permanent. Another one that Cat talks about is picture a video screen and with captions, right? So someone who's deaf can't hear. So they need to see the words. But pretend you're, or imagine that you are at an airport in that crowded kind of gate area and you're trying to watch the CNN news that they have, that will help you because it's so loud that you need to read it. Then imagine another situation like for example, someone learning a new language and the words are being spoken, but they don't know how to spell it. So then it's popped up on the screen as well. Those all three cases are mismatched where we need the help of the visual of the letters, but we don't necessarily have that same permanent disability, but it still applies to us. Microsoft has a fancy name for this, which is persona spectrum and there's a lot of other examples. In the slide notes, there's a PDF that Microsoft made called the Inclusive Design Toolkit and they go through quite a few of these. Building empathy is something that we're trying to do more at our company and we give each other these challenges so it may be something like go in a ride-along with a one-on-one which is like a video with a customer or use a different, if you're using iOS, switch to Android and see what it's like so you can see something different. And the reason for this is to see things from others' eyes. If you're not familiar with empathy, it's basically being able to understand the feelings of others, put yourself in their shoes. And for me it's been about, like I said earlier, not thinking of them as just stats but as real people. A lot of times it takes a real connection to do that. So last fall I did an empathy challenge where I worked from an iPad. I left my laptop at home and even at home I used it and I didn't have my big screen and everything. No mouse, which was hard. And it was difficult but it was actually very eye-opening. In fact, one way it was better was on an airplane. This was on the way home from Ireland. I got onto a Zoom call with my colleagues and I was able to do it from my plane seat which was kind of amazing because it was so small. I didn't have to bother my neighbors. But what it taught me was, now when I get back to my regular life, my computer with all my fancy stuff, I no longer think of the person who's one way we talk about this is across the digital divide meaning they do not have all the fast wifi, all the fancy computers that we do as tech workers. Someone like that, I don't think of as a stat anymore. Like, oh, I have 5% tablet users. I should maybe think of a responsive design. Now I think of it like, that's me, right? That's, I couldn't work, use the editor. I couldn't click on something, I couldn't target it. So it really puts it into human perspective. Another part of building empathy was for me was broadening, opening up the voices that I was listening to. Ted Talks are really good for this. If you're not familiar with, just go to ted.com. But this was a specific one that really hit home for me. Sheena Iyengar, she's blind. And the topic of her talk is not what I'm talking about. It's something else, very interesting about psychology of choice. But she, at the very end, she gave a snippet of her life as a blind person about picking, I think it was about picking color of nail polish or something. And the person she was talking to said, well, why would you care? There are two versions of pink or something like that. She's like, I care a lot. Just as much as you do, you know? Just because you couldn't see it doesn't mean she didn't care about it. Videos like these really helped open my eyes to how other people see the world or how they experience the world. So inclusive design, that started to realize building that empathy connected me with that other person. So we've been talking about the higher level stuff, right? How it connects to WordPress, the philosophies of openness, freedoms. What about bringing this into our work? So I do wanna spend a little bit of time on actual practical actions we can take. We've been trying to put this into practice in our work. So we have a checklist that we've started. And I brought a few of them with me today if anybody's interested afterward. But it's always available online at design.blog slash inclusive. I wanna pull out three of these and speak of them as examples. So the first one is helping your audiences inform your design, which as AJ mentioned, it's as simple as doing a survey. We're talking to people directly. Especially important if your team isn't diverse or if you're one person solo or you aren't going out of your house. We're pretty diverse at Autobanac. We speak about 79 languages, including Español. We're around the world, but we're still fairly technically and skill heavy in one direction so we can still learn and adapt more. But the thing that I've been learning is that diversity isn't just gender or race or background. It's a lot of different things, neurodiversity, right? The spectrum of autism, the spectrum of other types of mental health comes into play when you're in design products. And this came a practical example from WordPress just a couple of weeks ago, February 5th. Tammy Lister in the WordPress core project mentioned updating some of the error messages in WordPress. There was one that was said the word cheating. And someone from the community, Peter Wilson, I think he's from Australia, said, hey, it's kind of alarming. It makes me feel anxious when I see that. Like I did something wrong. And so he made a change to make it something like an error has occurred so it was less anxious. So that's an example of letting your audience inform your design. That goes along with choosing copy and imagery with care. These examples, these screenshots are from this inclusive design checklist. Yes, yes, what you're saying is it comes across as an affront, like an attack. Instead of you might want it, but not right now or not in that way. Let me make the action. Yeah, it's pushing it toward you. It's funny because I think this wasn't intended to be that originally, it was meant to be humor. But this was also when WordPress was a few people in a room that were mostly from Texas, I think. And they didn't have a necessarily inclusive view at that time, right? So it shows the history of the project as well. So one of the principles of choosing copy and imagery with care to more represent, in the case of WordPress and WordPress.com, is our customers are a diverse group. We went through a process where we hired an illustrator named Alice Lee to update the imagery. Previously, when you would go to sign up for WordPress.com and you would go through the sign up form, a lot of the people or illustrations look to kind of like me or like some of us are like young-ish, white-ish, guy-ish, with like an Apple watch and a coffee, you know? I mean, that's great because I identify with that, but a lot of people don't. And especially like I mentioned, the different types of diversity. Someone who doesn't have access to a fancy coffee shop with wifi may not wanna sign up for that service. So Alice went through this project where she updated, this is showing it in on real articles on our blog, but she updated the imagery to be more representative so that people could see themselves in the design. And this wasn't as near and dear to my heart, so designing for low bandwidth. This came up earlier in one of the talks about automated marketing, if anyone was in that one this morning, where some people were abandoning their carts because the images weren't loading on mobile. This is what this is about. So there's a trend in, as companies like Twitter, Facebook, Google go into new markets, whether they're like India, where there's less access to fast internet, they're developing these alternate products like Twitter Lite, Facebook Lite. And if you read the copy of the marketing, the value proposition, as AJ would say, it's about faster, it's about less data that's being used on your plan. Think of someone who pays by the megabyte or by the gigabyte for their phone plan. So Facebook was losing market share to WhatsApp and other apps in India because it was using up too much bandwidth. But really it's not just about the bandwidth or the data use, it's about getting people to what their goal faster, making sure it's accessible to everyone. So in our project, one of our software projects is called Calypso. It's the interface you see when you log into WordPress.com. And we have this site that's called iscalypsofastyet.com. And every single one of these pointers is when someone has changed code, pushed a change to GitHub, for example, and you can see how there's kind of a huge spike there. Well, it alerts that developer or designer to say, hey, you made a change that is gonna adversely affect how fast this loads for someone. And we take it pretty seriously. We want it to go down. It's not up and right, it's like down and right. And I also want to bring a reminder from Wapoo, mind the mobile, super important. And I would say before last year, I didn't think of this as inclusivity. I thought of it as more of a technical challenge. But there are people that are definitely gonna not come back if they don't have access to whatever message or whatever product you're selling. So those principles, like it's available online, I have a few hard copies as well. Design.blog inclusive is the URL if you wanna look into more. There are quite a few other checklist items there. So bring this back to the bigger picture, inclusive design and those mismatch conditions. I realize that you're solving for one person, but you're really finding a universal solution. And I also wanted to share, if you're interested in sort of how things can go wrong with tech, check out this book by Sarah Wachter-Betcher called Technically Wrong. She goes into more detail on some things like Snapchat, Facebook, especially things like artificial intelligence and machine learning, which are new to us. And research has shown bake in some of our biases, even though we don't think of it that way, but the people who program it have biases and they come out in the algorithms. So if you're interested in that, I don't have time to cover that, but check out her book. She talks about inclusion and design as well. And she has a book from a few years back called Design for Real Life that really motivated me to learn about this topic as well. Once I discovered Cat Home's work and with John's prompting these voices, right, standing on the shoulders of giants, I finally got it. I finally understood how my work and my thought patterns are influenced by my biases and by my background. And I also noticed that I wasn't always thinking of those who were left out. I was designing for myself. I was designing for what I already knew, like a default, right, or a normal person. And really, now I've opened up to it. I'm thinking more broadly. I'm thinking more openly. And I'm starting to see that when I don't minimize the access, which is a key part of inclusion, right, those mismatch conditions, if I don't minimize that into a corner case, I can start with that. I can start with those people. What's their story? What does success look like for them? What are they not being able to do that I'm able to do? And I've just come to realize that inclusive design is designed for everyone. People like you, people like me. Thank you very much. Do we have time for questions? And all the links, so on my website, sensible.blog, you can find all the Roku and Oxo, all those case studies. If you don't only watch that Oxo, the one about the vegetable peeler, that's a really cool story. My question is... Oh, hold it really close. My question is, how does this principle relate to the principle of progressive enhancement versus graceful degradation? Because I'm working on some sites that need to work for people who can't read at all in lots of different languages that aren't normally represented on the web, but we also want it to look nice and slick for people who spend money. Yes, that's a great question. So the question is, how does this relate to graceful degradation and progressive enhancement? That's exactly what this is. So starting with a mobile-first layout, the same idea is that make sure it works in the most simple case, right? Black text on a white background, on a say edge phone or something like that. Yep, or worse than that, right? Dial up with what would be, what would be a visually worse than that? Yes, exactly. And this is exactly what those light apps were addressing, was the, if you take everything else away, what's left? It's like the title, your avatar and your messages. And what's interesting, if you go to Twitter now, when I'm logged in, I started to see their light version pop up for me, even on my desktop, because what they realize is that everyone likes it. It's easier for, there's fewer navigation items, there's simpler labels, and it just loads faster. So that's, so the progressive enhancement in saying, what's their starting point ends up being the end product? And so, yeah, it's the same exact philosophy, actually. So it has everything to do with that, thank you. Yeah, I'd be curious to know what pain points that you guys encountered as you maybe mentally have gone this direction. Do you mean on WordPress.com specifically? Yeah, and maybe personally, like is there, there is a trade-off and so how, I think it's a better way, but what are the pain points and how you've addressed maybe that? Sure, one of the problems is finding folks to talk to to learn from. So I mentioned Cat Holmes. She worked at Microsoft and they had Xbox and they had Office Suite and they have, like all these different products. And they had people on staff who were like paraplegics. Super cool. They're the ones, so for example, she gave an example of, they're trying to make a mobile coding, so like I don't know if it was for C Sharp or something, but it was like a mobile app that you could code with. And the person who developed it was someone in a wheelchair who talks at the ceiling, right? Like who better to work on that than someone who has no keyboard? But that's been one of the challenges for us. So when we do those empathy challenges, we're limited by our local capability. So actually Cat came on as an advisor to Automatic because of that to connect us with some of those people. The other challenge has been around, it's hard work and so we have a lot of pressures from our stakeholders, which would be, so in my case, I may be the project lead and want to get it out faster. So anyway, we may be attempted to skip some steps, like test, so there's a couple of things you can do, like in Chrome there's a rate limiter and I think Xcode has one for iOS where you can make your network connection really slow on purpose. But that's annoying, so I may not do that, but that would be the way to start. And so probably one of the things is just getting into the rituals and habits of thinking of that first, thinking of that edge case, like I said, as the central thing, but it's really been an educational experience, just learning from more people. And as I mentioned, hiring and diversity onto the team, that should make a difference too because someone will say, hey, I'm from Kenya, right? And this is my life. I spoke at a work camp in Nicaragua and I couldn't even load WordPress.com on the mobile broadband, which I had T-Mobile and it was like a 2G, nothing happened, just got like text. So like when I got back home, I said, okay, I'm gonna file a bug for that because it didn't work for that entire country, you know? Kind of eye-opening. Hi, my name's Mike and I have a question. Do you have any experience working with China and some of the firewalls that they have and the ways of working around that and some of the things that you found to be successful? I do not, actually. We're, as far as I know, we're blocked in China on WordPress.com. If not that, some parts of it are blocked, so I don't have experience actually, but that's something that I would love to learn more about. Do you have experience with it? Oh, gosh, I'm just a small amount working with China. Being able to use like WhatsApp, we're able to talk 24 hours with that, but with video has been difficult. I did make contact with them and they're using office programs and they sent me some attachments, word attachments that I downloaded to my computer, but a week later we were not able to download from that same email, so it got cut off. These are just some of the things that I've experienced, thanks. Thanks for the question. First I want to say I love your talk. It's amazing. But I do want to ask for those of us who either freelance or just are in the design business and really like this stuff and have an interest, but don't know how to phrase that to someone who might be the key decision makers. So for example, like a business owner, a business leader, your boss, coworkers, or teams who may not be too convinced on this or unaware, how do you convince those people or stakeholders that inclusive design is important, profitable too, which would be one of their concerns and good and useful for all. Great question, what's your name? Robert. Thank you, Robert. That's exactly me of last year. So I was not convinced. And some of it, part of it is the commercial aspect and part of it is personal. So feeling the pain myself, right? So that's where just those empathy challenges. If it's someone who's the business owner, I would definitely recommend looking at some of these case studies. It's hard to argue with $60 million from a fish to popular, but there's other better examples. So that design and tech report would be one. So it's put out by a venture capital firm in Silicon Valley. So it's not from a known name. So from Arizona, I work from home. People may not respect what I put out to the world, but this is a very respected, I think it's called Kleiner Perkins, Coughfield and Byers, but it's KPCB. Anyway, designandtechreport.wordpress.com I think, or designandtech. I can send you the link. But the point is, show them that this has been studied across the industry, and it's a trend that we're all going in that direction. Design is becoming more human. It's becoming more human-centered. The commercial opportunity is because you're, what business people call total addressable market, like the amount of people that may be interested in your thing is now gonna be bigger because you're not excluding them because they don't have a certain ability or they don't have a certain language, right? So I would talk to both of those things. I would get them involved in the research, and then I would get them personally involved, seeing, so one example would be making them watch a video where someone's interacting with what they're working on and that has trouble with it. Okay. Does that make sense? Yeah. But yeah, that's a great question. Thank you. The resource that I've gone to is the people, the guys that make opera, the opera web browser, they're like, they're very forward-thinking. They know that the smartphones that people are buying in Asia, about half of them have less than a gig of RAM on them and they're very low resource and they have a lot of resources for developers how to design for the next million, your next million customers because there are more people in a small circle in Asia than there are in the rest of the world and they're the people you need to design your web for. Yes, and opera has that really cool feature where they cache all the content so it's already kind of locally available and it's not, you don't have to fetch it across the world. I can't remember the name of it, but for mobile. Proxy servers, thank you. So you mentioned the next one billion Facebook in their marketing for the Facebook Lite. It says this is for the next one billion people, right? Just like you mentioned, that I would say across the digital divide or don't have any kind of technology that we would call like laptops, the feature phones. What does the web look like for them? But it's also huge, speaking to Robert's point, it's a huge, how can you argue with the thing that you're making available to one billion people? Even if your product is 99 cents, that's a lot of money. So it makes business sense to make it available but it's also the right thing to do. That's one thing I didn't really mention but what an insight for me was it's not cause we're good people, but it is, right? Like we use WordPress because it's free to use but it also has the freedoms. I think Matt Mollin like says, we make software, not for free, we don't make software for free but we make it for freedom. So that's kind of keep those in mind. Like there is a commercial aspect to it, like we wanna carve out our livelihood like I mentioned but we also wanna bring more freedom to the world. So I think that's the message is that it opens everything up.