 My name is Neha First of all, thank you all so much for coming. Can you hear me? Okay? Yes, okay great Thank you so much for coming even though I know that whole crew right there for the rest of you It really means a lot that you're here So currently I am I a software engineer at sidewalk labs and also the very recent founder of an Indian clothing site called Lotto But before that I was a mere Mugler Working on Google Maps never show this photo to anybody So you may recognize some of my work So it includes the mini map in the bottom left the popular times graph the send to your phone button But something that I really enjoyed doing behind the scenes was making Google Maps more accessible for keyboard users So let's start with a pretty sobering fact according to the US Census Bureau Nearly one in five Americans have a disability Furthermore of these fifty seven ish million eight point one have difficulty seeing and Nineteen point nine have difficulty with lifting or grasping. So that is twenty eight million Americans who cannot use a computer or a mouse in a traditional manner so you may be wondering well what tools can they use right now to alleviate this and There's actually quite a lot for those who are nearly or completely blind or with limited motor function There's a variety of different screen readers that are available For those with low vision there are screen magnifiers and for those with color blindness There are color filters inverters reducers a bunch of different tools So right away. I want to say this accessibility is not a niche market There is a huge huge population you serve to gain by making your product accessible So maybe some of you are now thinking okay, so what I have a hundred million two hundred million users I don't need twenty eight million, but that's not the only reason to make your product accessible So first of all accessibility is a right and when you work with government funded entities It's also quite often a requirement So if you don't make your product accessible you could face bad press and a lawsuit just like this Second of all the community talks and if your product is the first one of its kind to be accessible You will have the competitive advantage of a very active and loyal user base And lastly, it's just the right thing to do when I was working on Google Maps, I Went to an accessibility meetup and this is kind of in the middle of my work And so I was just kind of asking around you know what what online mapping services do you use today? I haven't really found any of them to be super accessible and I was really surprised. I mean essentially they said yeah We've given up like we just try to make do go to the places where we know to go But we have friends who are scared of even leaving their house because they don't want to feel lost or embarrassed And that to me was like such a motivator I I truly believe we all Deserve to be able to go outside and experience what we want to experience and the fact that this population was hurting because No one had thought to give them this like very fundamental tool made me really want to follow through so that brings me to my Second key takeaway, which is accessibility opens doors whether you're dealing with big government or end users Accessibility can easily be your differentiator So at this point, I've hopefully convinced you that accessibility and therefore listening to me talk for the next 10 minutes is Worth your time So the next question is how do you do it? Well? I think there are two main parts and the first is user testing So when I was in college, I worked on this project Involving the Braille writing tutor, which is this Arduino based device you see here And so basically this was a piece of hardware that they would hook up to a PC And they could like the teachers could help their children learn Braille through games But it was being used in rural India where power just was not reliable So they wanted to port it to an Android, which you know, they could charge and then use a little bit better But to further throw a wrench into things not only did I have to move the software over but also It was going to be used by these blind teachers who had never even held a smartphone before with their blind students so My group spent the entire first week just trying to immerse ourselves in accessibility We you know, we turned all of our screen readers on we downloaded a bunch of apps We we just tried to see kind of what was out there and we even practiced writing Braille So how many of you know anything about Braille? I Oh, well good I didn't at the time so Essentially Braille is like you have these six that like six dot cells And so the idea is that you know some are on and some are off and you know And you think about it next to like an elevator a lobby the ones that are on are raised, right? so actually when you're writing Braille on paper in Ordered to um in order to produce like there I don't know who can see this but in order to produce the raised version you actually have to flip the paper write the mirror image of every letter from right to left like puncture the hole and Then it can be readable from left to right with the finger So like you're not learning one alphabets. You're learning to alphabets. You're learning to writing directions It's it's a lot to handle mentally And so First our first iteration my team built this really simple Android app and we found someone to Run and record user research sessions with teachers in India And we sent him this you know pretty straightforward research guide 20 minutes of an introduction to Android and 20 minutes of a think-aloud like a set of think-aloud tasks Which for those of you who don't know are just essentially, you know perform this task and think aloud while you do it and When he got back to us it was so Clear that we had severely underestimated the learning curve that we were assuming would just happen The first Android introduction took two hours, and it was scheduled for 20 minutes So that leads me to my third takeaway, which is empathize with your users and their norms So don't for example make the mistake we did and assume You know they have all this hardware in their life And they have to just figure out how to orient it and that part solved like that's not what we have to think about here Because you really need to think about the holistic experience for a user and what they're used to and what they're not So the second part of the how is the actual technical implementation So when I joined Google after college there is this huge initiative to abide by the mission and actually make the core products universally accessible So you know I had I had just joined I kind of had some experience in college And I was at my first all hands and I was like all right. Why not? I got this I can do this I'm the new person which was a classic nuclear mistake But I started reading up on web accessibility Evaluating Google Maps, and I quickly realized it was a disaster Google had this internal accessibility rating, and you essentially evaluated core functionality against like a set of standards and I I ended up just faced with this giant red spreadsheet Like there is nothing accessible about the product as is and on a scale of zero to five. We were a zero So I spent the next few months digging through the entire code base And I was sort of able to boil down the technical principles into four main pieces so the first is add labels and roles to each DOM element so these essentially tell a screen reader What the element is and how it fits into the larger organization of the app? The second is handle key presses So you should make sure that a user can you know use their arrow keys to scroll between a list and also hit enter to You know activate a button for example The third is enforcing a tab order So that is the order of the elements when you hit tab and your focus is moving around the screen Because if you think about it like the app is laid out in a certain way for a reason visually You you want the user to process the the information in that order So you have to also make sure that when going with a screen reader You're giving them that same order that same context And the last is maintain focus And by focus I mean again keyboard focus So say a user focuses on a button and they hit enter and it opens a modal And then they close the modal where does their focus go? It probably should go back to the original button that opened the modal But a lot of browsers will just drop the focus entirely and that leaves the user Completely lost they reset from the beginning of the page They have to wait find all the way back to where they were So it's really important to kind of never let them get lost in the ether and always make sure these these state transitions are handled So knowing all this How would you guys make Google Maps like This map itself Comprehensible to someone without sight anybody Good. Yes. What would what would you um, what would you say about the map? There's no wrong answer Yeah, so when the screen reader is on the map, how would you verbalize the information that we're seeing visually now? Okay, so city location Yeah, right. Yeah, exactly. So, you know high-level like geographical context Yeah, yeah, compass directions All right. Well, don't worry. I followed this for all of you So I'm gonna show you a quick demo. I also have to read download Chromebox Chromebox spoken feedback is ready. Great. Okay, AMC Village 7 Oh AMC Village 7 Google Maps directions, but in region Okay, so main one two Avenue two anthology film archive Search search Google Maps a search Google Maps combo box out of completion list. So essentially When you land on Google Maps, I can refresh Google Maps says Google Maps search search Google Maps It goes immediately to the search box because that is the primary action when you're on Google Maps And so you can use tab like I was saying to kind of go through all the elements in order So I'll just search one Directions one you see it said directions which describes the element of the label and then button because that's the type of element So I know I could you know hit enter on it and so I'll try to spare you the sound but if you watch this like orange box You'll see that it does search goop zero goop show your location move around the map the same way your eye might Content it turns in the fine print exit Mac may one that will sell out to blue note three by Chloe 4d cookie dough confections five dummy and so bakery six film form Seven Houston Street nine view more an area navigation. Okay, so here is essentially what I decided on so basically Google Maps is secretly 256 tiles that are adjacent to each other And so I thought okay this tile is a really great Deterministic way of understanding the map right like it's never changing a number at any given zoom level every tile kind of has what it has So what I did was I kind of drew this box around the tile that you're specifically on and I extracted all the Point of interest from that tile and so then I give them to you in this numbered list So if there is ever more than seven eight and nine or kind of like the next page in previous page buttons So if I were to click nine it would kind of give me the next set of pois here And then furthermore You can pan and every time you pan you move exactly one tile away We move in east one two avenue to a mc village seven three after a place four liqueur street five Lafayette street six kids seven McSorley's little downhouse nine view more an area navigation Okay So so my thinking was you know like say you load Google Maps when you're home actually it or when you're anywhere It centers you on your current location So my thinking was okay. We'll start at the center and you know If you move two left two up the way to get back home is two down two right You're never going to lose like any single piece of information And second of all like you can click one of these or you can type one of these numbers to actually click on the poi so if I Want to learn more about McSorley's ale house one two avenue to a mc one two avenue to aster place three liqueur street four broadway lafayette street Five kids six McSorley's little ale house seven stop nine view more an area navigation So you can see that even though so it said showing side panel Which means you know you opened it but even though the panel opened I didn't change the focus. You're still exactly where you were. You're still on that same square I like reshifted the map to ensure that and Yeah, so that doesn't even have me. Oh wait, no questions till the end But so yeah, this is kind of just I guess like my baby project, but I'll go back to Let me turn this off So that leads me to my fourth takeaway, which is don't be afraid to get creative So it's pretty clear that you know, there's no hard and fast rule to make a map successful like you have all these frameworks guiding you but It really took kind of a lot of thinking about how to put all these pieces together to get that map to make sense to someone who couldn't actually see it And so with this takeaway, I basically mean to say like it's a growing community And it's always welcoming contributions. And so you shouldn't be afraid to kind of Go outside the box if you're adding to it So, um To end my presentation, I'd like to share just a quick little anecdote So I had just gotten google so I just gone google maps to a level four out of five I was very close. It was right before I was done with the map And I kind of had like a working demo of it, but I wasn't totally set on pursuing it because Like I said, I had to get in touch with the tile team So they would pass on those point of interest and that was like a bigger payload and there was kind of a lot of red tape in that area But so I was really interested in accessibility regardless and I wanted to go to this conference called CSUN Which is not reflected in this name. But anyways Um I don't think there's an acronym So on the schedule when I got there there was this session called google maps and I thought to myself What like I'm definitely the only person here like what could they be talking about? And so I went to the session. I found the audience and The first thing that the speaker said Was I don't know what happened to google maps, but it is so much easier to use And her entire session was the work that I had done like she was just going through all the stuff She was going through all the different things that she could hear like even the popular timescraft You can hear you can hear the the values of the bars and all this random stuff Um And so towards the end of the presentation, you know, it's q&a And someone obviously asked well, what about the map? Like what are they going to do about the map? and I finally raised my hand and You know revealed myself. I was like, it's me like Like that is what I was You know what I've been working on what I wanted to bring to you guys and what I came here to kind of like test the waters for and Kind of what happened next was very Unbelievable like everyone just like stood up formed a queue everyone was like shaking my hand giving me business cards And they're like, how do I test this? Where do I find you? Where are you? And I was like, okay Google booth all day like I'll be there um But like I mean that to me was just the Biggest affirmation of the why I was talking about earlier Like I had somehow from miles and miles away Managed to get one person so excited about google maps that she was delivering a conference session about it That she was sharing it with this larger community um And once I kind of like put myself out there. They were so excited and eager to help and like They were ready to become the most loyal google maps users, right? so um To end the evening. I just like to share a list of resources that I found really helpful when working on google maps And I really really hope that you end up using them too um and with that Thank you. I think the slides are available by the way How useful That's a good question um Yeah, actually, so I don't know if you remember this but basically the thing on the right used to open up and have like a slideshow of photos and that was kind of just the worst one because Okay, what do you get from iterating through that photos like photo one photo two photo three and I just Things that are so inherently visual I struggled with because I didn't want to restrict your access to knowing that they were there but I also like Unless the author or unless the photographer provided a caption. I just had no really good way of Doing that and so that was yeah a tough one You know to help climb people and legally care people to navigate them So it brought me to the lighthouse and I had to our interview with the technology person there, which was amazing and I highly recommend to do the same thing if we can Because it's a lot of technology out there and it's actually Either very expensive for this group of people because probably 70 percent of them are not working Also, she was talking about how they're using google maps and they okay was Finding the corner on the street, but they're not okay Was what's actually on the street because they can't see stores. They don't know what's in there Yeah, so we need more description Yeah, um does anybody remember like the pac-man april fools joke So that was like that was an idea that I had for mobile. I told the mobile team Okay, we've already built this thing where you can literally traverse the streets And so why not kind of incorporate that into wave finding like you're walking down the street your pac-man You know what's on your left and right unfortunately, I don't know like the other teams on google maps just Didn't seem as excited about this like they I think had a lot of more pressing features to keep up with the competitors in the space Whereas google maps. I think we were able to take More of a holistic approach because we felt pretty secure with our user base But yeah, I definitely agree like I think mobile wave finding has a long ways to go and I there's a lot of room for improvement Expressive Yeah Yeah, well, I think honestly like user testing can really bring a lot of that to light for example The braille writing tutor project I talked about So all they asked us to do was make you know the gameplay app But after you know listening to these teachers a big thing that we kept hearing was That the students loved hearing the teacher's voices like it brought them so much more comfort than this like talk over or voice over You know voice And so knowing that we actually made a second app where the teachers could go in and record the words and phrases And then we'd pull in those recordings into the gameplay app to kind of make it feel more You know like your teacher was actually sitting next to you playing this game with you. So like I think Yeah, just having you sit down with your users and really figuring out Where that emotional part is and then how you can address it would just go a long way Everything at once Um, so many apps tie like incorporate people maps I So I left google But at the time that I left the embed team was a different team and they were using a subset of the features Just to kind of reduce like the page load So I actually haven't checked to see whether they incorporated the accessibility features or not, but that's a great question Yeah, so I did street view too. So again, it's kind of hard because it's a little more visual but When you're like moving forward in a directional space I like indicate which direction you're on if there's any sort of caption About the landmark or the street corner like I enunciate that Um, so pretty much like when you're on street view anything you could read is something you could also hear And then just kind of the wave finding aspect was highlighted. But yeah, that's that was another pretty challenging One