Transcript
Kelly:
I'm going to show a little bit about how a screen reader works along with some experiences I've built. I'm using VoiceOver on the iPhone right now, although many of the concepts are the same. At the core, a screen reader does a couple of things. One, it reads items as a user navigates. And 2, it gives the user more controls to move around. There's a lot more refinement beyond that, things like speed, Reading in different areas and a whole bunch of things. This is a weather app I've built. Now, the first thing we might want to do is slow the speech down.
VoiceOver:
Next day, weather fast heading. Beaver Dam, Fond du Lac, San Diego, Madison, Wisconsin, 40 degrees F. Mainly clear, 33 degrees F. Southwest, 5 miles per hour, 58 degrees F, 30 degrees F. Button.
Kelly:
Now, you heard a lot of numbers, and you might say that's kind of confusing if you can't see, because what do all those numbers mean? When I built this app, I could actually turn on so you hear the words before those numbers, like high, low, feels like. But once the order, you want to turn that kind of thing off. So I made it so I can turn this off.
VoiceOver:
That speech rate is a little bit slow, perhaps.
Kelly:
I mentioned that one of the things a screen reader does is let's a user.
VoiceOver:
Fond du Lac, Wisconsin, 40 degrees F. Clear sky, 32 degrees F. Southwest, 8 mph, 54 degrees F. 32 degrees F. Button.
Kelly:
Now my hometown is Fond du Lac, but what if I didn't know how to spell that? I've changed the voiceover, so now some commands I issue are going to read by character. And do you notice how on the uppercase letters the pitch increases a little bit? So this is a fairly straightforward weather app, but one of the reasons I build apps is to try and solve information access where it's not already available.
VoiceOver:
Tab bar. Browse. Tab.
Kelly:
One of my wishes is to be able to get a sense of radar. I haven't figured out how to do that in an accessible fashion yet, but.
VoiceOver:
Appleton, Wisconsin, 36, United States. Back button.
Kelly:
For example, in this app, I've built a feature that lets me browse all the weather for a state. Wisconsin.
VoiceOver:
Sort cities. Current sort. Name, AZ. Button.
Kelly:
And what's alphabetical?
VoiceOver:
Select name, ZA. Geographic. North to South. South to North. Button. South to North. Pleasant Prairie, Wisconsin. United States. Back button. Lake Geneva, Wisconsin. 36 degrees F. Clear sky. Button. Monroe, Wisconsin. 36 degrees F. Clear sky. Button. Actions available.
Kelly:
So not a lot of weather is happening today, interesting, but I can at least kind of go geographically around a state. or if I was in another country, international, and get a sense of that. Another interesting thing that I've done.
VoiceOver:
Tap R. Elkhorn, Wisconsin, tap R. Tap R. Tap R. Monroe, Wisconsin, tap R. My cities, tab.
Kelly:
Let's go back to Madison.
VoiceOver:
San Diego, Madison, Wisconsin, 40 degrees F. Current temperature, 40 degrees F. Condition, field like 33 degrees F.
Kelly:
I'm just using a voiceover command to move around.
VoiceOver:
Refresh weather. Dismiss context, dismiss, remove city, weather around me, button, weather around me, heading.
Kelly:
Now, this weather around me feature, I'm kind of proud of this. It's still not radar, but one of the cool weather.
VoiceOver:
Surrounding areas, weather surrounding areas. Surrounding areas, North, near Cleason, Wisconsin, Northeast, East, South, Southwest, near Mount Pleasant, Iowa, 187 miles, 49 degrees F, overcast.
Kelly:
I can either read like that and read each.
VoiceOver:
West, near Coastville, Iowa, 100, North, 64 direction. Heading North, picker item, adjustable. City explorer, the forest, Wisconsin, 12 miles, 2 miles east of center line, 40 degrees F, partly cloudy, approaching at 6 mph, 1 of 13, adjustable.
Kelly:
Or I can step through cities in a direction.
VoiceOver:
Portage, Wisconsin, 32 miles, 4 miles west of center line, 2 of 13. Montello, Wisconsin, 47 miles, on center line, 40 degrees F. Clear sky, moving parallel at 8 miles per hour, 3 of 13. Nishkoro, Wisconsin, 62 miles, on center line, 41 degrees F. Clear sky, moving parallel at 8 miles per hour, 4 of 13.
Kelly:
And this tries to give me an idea of what weather is coming up in surrounding areas. I've also built a...
VoiceOver:
AI folder. Sports scores fast. Data. Sports scores fast.
Kelly:
Sports scores again.
VoiceOver:
Athletics at Phillies, 540pm Thursday, 5/7 on MLB. TV. Button.
Kelly:
This part of the app's fairly straightforward, just a nice screen reader friendly view of sports.
VoiceOver:
Tap bar. The bench. Tap.
Kelly:
But I have something I, again, kind of think is cool.
VoiceOver:
MLB stadiums. All strike zone. Football. Heading. NFL football field. 120 yards. Dimensions. Heading. Touch the field. Button. Touch the field. Football field. Back button.
Kelly:
So now I can drag my finger around.
VoiceOver:
40, 35, 50.
Kelly:
And as I'm moving, I hear the yard lines. I'm not sure how well this will come over in the video, but I hear in my speakers right for that distance.
VoiceOver:
Near 44 yard line dot right dash mark.
Kelly:
And then when I let my hand up, I find out where I was touching.
VoiceOver:
Football field. Back button. MLB stadiums. All 30 parks. Real wall distances. Button. Select stadium. Heading. While American Family Field. Mill. Button. American Family Field. For space. For space. Pitchers mound. Home plate. Pitchers. Second base.
Kelly:
We'll go to the warning track to get some sound.
VoiceOver:
Center field, 286 feet from home.