Data Visualization: Tips for Making Complex Graphical Content Accessible to All | Accessibility NYC Meetup Recap

Okay. Hello, everyone. Welcome to Accessibility New York City. My name is Stacy Smith, and I would like to welcome you all here.

Thanks for your patience, while we got set up this evening. I would like to welcome you all, and also welcome Doug Schepers, all the way from the great state of North Carolina, as our presenter tonight. We're really excited for his presentation on data visualization. Before we get started, just a couple of things.

First, I'd like to thank our sponsors, Thoughtbot, Equal Entry, Adobe, and Level Access. Thank you so much. Without them, we wouldn't be able to put on this monthly meetup. So thanks to all of them.

Also I would like to thank Joly MacFie from the Internet Society, who will be making all the production magic happening this evening, and also Mirabai Knight from White Coat Captioning, providing our live captions right now. So without further ado, I would like to bring Doug on for his presentation. Doug?

DOUG: Hey, folks. Thanks for coming out. So my name is Doug Schepers, I have a company called Fizz Studio, we make accessible visualizations. We're just in alpha phase, we have a couple customers, but I also work for the University of North Carolina, Chapel Hill, as an accessibility consultant, as of a week and a half ago.

So that's a new thing for me. And let's just get started. So... Boop boop boop boop...

There. So let's actually just jump into what is an accessible data visualization. Might need to adjust the sound. Do I have sound here?

Let's move. I will skip to the next slide. While we're getting sound set up. So what is data visualization?

It's a fancy word for charts and graphs and diagrams and maps. It's also often abbreviated as data viz. Who here has heard the expression: Data visualizations are a story about data? A couple of people.

Three people? Okay. Data scientists. Thank you.

That's a common thing for data scientists to say. And this goes over here. But I like to think about data visualization as a more functional metaphor. That is to say, data visualization are a user interface to data.

And let's explore what that means. My goal tonight is to get you to rethink what a data visualization even is. Here... I'm gonna do this.

So here is a little toy screen reader that I made, called Fizz Reader.

Data point 151. Press one for details. Press two for comparison to a specific data point.

DOUG: I'll slow it down just a little bit.

Alaska. 27.9. Data point 151, options, Alabama... Press one for details.

Press two for comparison to a specific data point. Press four for data point statistics.

DOUG: So I can step through any of those data points. And I'm having a little bit of trouble here. I can step through any one of those data points, and get the data from it, like a table. Right?

But it's a little more in-depth than a table. And I'll explain what's really going on with data visualization in general. So you may have heard that data visualizations can't be made accessible. Who here has been in an audit -- who here has heard somebody say that you can't make data visualizations accessible?

Right? Maybe you've seen in an audit that... Oh, provide a table, or provide the raw data, because you can't make -- this medium can't be made accessible? I think there's a fundamental misunderstanding of what a data visualization actually is.

So data visualization is actually accessibility technology. I am putting up a spreadsheet here. Let me zoom in a little bit. There's a little spreadsheet for you.

And who can tell me -- so there's a spreadsheet with a bunch of population numbers, from 2000 to 2016. For Brazil, China, India, and the United States. Who can tell me which of these countries has the highest rate of growth? Not the highest population, but the highest rate of growth?

Okay. I'll give you one, two, three, four, five seconds. Nobody is volunteering? Okay.

Now, who can tell me which one has the highest rate of growth? I just threw a line chart up on the screen. Highest rate of growth? China has the highest population, but if you look at the angle of the line, for India, it's a sharper angle than China.

So India has the highest rate of growth. And it was much easier to tell with the data visualization than it was with a stack of numbers. That should be our level here. We should understand that data visualizations are actually -- it's much easier to notice and think about patterns.

They're kind of a cognitive accessibility tool. They're a cognitive accessibility tool, because our brains cannot understand just stack after stack of numbers. But they can understand images. Really well.

They can do really amazing things with images. And so we're using our visual system to compensate for the lack of memory, the lack of computing power, we have in our brain. Cognitive power, rather. In fact, I showed this slide to a friend of mine who has low vision.

And he has... He doesn't have retinal vision. And he was able to tell me immediately. He couldn't read the spreadsheet at all.

But he could tell me immediately which one of those lines -- he couldn't read the text, but he said: It's the green line. The green line has the highest rate of growth. Because, one, he's a mathematician, and two, he could see the lines in a way he couldn't see the text. Data visualizations are a way we reduce effort, and we catch attention in this data-flooded world, and it creates a functional model of the data in the minds of the audience.

And there's nothing inherently visual about that. So this is Ben Schneiderman. He's a pioneer in -- if you've heard of HCI, which is sort of the precursor of UX, he pretty much created HCI. And he said the purpose of visualization is insight, not pictures.

So this is really gonna throw me off, having this black bar on the screen. So his opinion was that the data visualization is not about the pictures. It's about what you create in the mind of the user, once you've made that picture. With that picture.

So in that case, why is it visual at all? The reason it's visual is because the visual channel is about 10 million bits per second. It's enormously wide. 30% to 60% of the brain, depending on which function you're talking about, is dedicated to visual processing.

And we have a fast visual response. Fight or flight response. Seeing dinner or being dinner is the expression. By comparison, touch has about 8% of the brain dedicated to it.

Hearing is somewhat less. And you think about a saccade -- you think you're seeing all these things at once. You're not. Your brain is constructing a scene, and you see something about your thumbnail at about your arm's width, and your eye is constantly moving around, updating the scene.

So everything that you see right now, except for one tiny little portion of your visual field, is imaginary. It's in your head. You can not see what's going on. If you've ever seen the famous gorilla experiment.

Does anyone here know the gorilla experiment? Google the gorilla experiment, and just watch it on YouTube. So we think that we're seeing all these things, but in fact, the saccade is moving our eyes around really, really rapidly, and we're doing this parallel processing, and it allows us to detect and match patterns. So there's something called the pictorial superiority effect.

And again, the brain has a disproportionate amount of processing that goes on, that's visual. So we have here a pie chart, in the shape of a brain, and about 75% of it is taken up with visual, and then the rest is separated with touch, hearing, taste, and smell. It also has a really huge effect -- the visual stuff has a really huge effect on memory retention. So if I gave you this presentation and I didn't use images, I just used a wall of text, for any given slide, you would remember the data that I give you, after about three days, without images, you would remember about 10%.

But with images that reinforce the ideas, it goes up to about 65%. That's an enormous difference, right? We're really getting at something neurological here. This effect, by the way, increases with age.

The older you get -- you think that little kids like pictures and adults like text. The older you get, the more dependent you get on images, in fact. So if you want to read more about that, there's a good book called Brain Rules, by John Medina. So there's another aspect of neurology with regards to learning, and that is learning modes.

If you can engage multiple different learning modes at the same time, like sight, hearing, tactile, reading and writing are separate from sight and tactile. It's a different learning mode. If you can combine more than one of these, your brain starts forming multiple neural paths to reinforce what you're learning. And if you can tie that into emotion, including the emotion of aesthetics, aesthetic appeal, you actually greatly multiply somebody's ability to retain information, to apprehend information and to retain information.

There's something called cognitive load. Who here has had an overload of cognitive load? Probably all of you. Except the gentleman in the front.

Cognitive load is... It's basically how hard it is for you to understand some concept. There's something called intrinsic cognitive load. Intrinsic cognitive load is the base level of concentration, memory, mental processing that you need to understand an idea.

And then surrounding that intrinsic cognitive load is all this extraneous cognitive load. This is all the stuff that is not exactly the thing that you're trying to learn. It's all the other information around you, in the environment, et cetera. And of that, the combination of intrinsic and some subset of that extraneous cognitive load is what's called germane cognitive load.

And the rest is clutter. Germane cognitive load is the brain looking for patterns within the clutter, so it can give context and help you understand something. And serial tasks, that is to say, tasks where you go one by one by one, listen to the first bar, listen to the second bar, listen to the third bar, listen to the fourth bar, as opposed to getting it all at once, a whole bar chart at once, those cause more cognitive load than parallel tasks.

I know I was going to talk to you about data visualization. This talk is more about neurology. It's why data visualizations work at all. There are these things called preattentive attributes.

These are visual features that are automatically processed without any cognitive load at all. Your brain is a series of filters, not Instagram filters, but literally layers of neurons, and as a visual image goes by, one of those filters says: My job is to look for straight lines. Vertical lines. I recognize a vertical line.

Another one says: My job is to recognize horizontal lines, or lines at a certain angle or parallel lines, et cetera. We have all these filters, and that's how -- it seems incredible to me, but as we're seeing things, our brain is instantly breaking them down into their component parts. And these are all hard wired into the brain. And these are what's called preattentive attributes.

They do not require you to think. Your brain does them automatically. So these are broken down roughly into color, form, position, and movement. And I'm just gonna scoot through these pretty quickly, because we got started late, but color -- you can detect the hue, you can detect saturation, lightness, and texture.

And on the screen, I have little examples of -- just little blocks of basically mostly a 3x3 grid of blocks that demonstrate each of these characteristics. Form -- you have orientation, one of the blocks is rotated, alignment, one of them is outside the grid, collinearity, it's a set of lines, and one is at an angle. Length. It's got four lines, and one of them is longer than the other.

Shape. In the midst of a bunch of squares, we have a circle. Size. One of the squares is smaller.

Curvature. A little bit -- it's a set of curves, and one of the curves is more acute. Width. I have four parallel lines, and one of those lines is a little wider than the others.

Added marks. I have a little X over one of the squares. Intersection. Again, that's one of those little things -- the brain says -- oh, I saw something that intersected!

It's just a bunch of lines that are intersecting with one another. Corners, essentially. Spatial grouping. There's a bunch of little dots, some of which seem to be clustered together, and others are in a random pattern.

And numerosity, the ability of us to recognize small sets of numbers. In this case, there are four groups of three. I don't have to think about there being four groups of three. Immediately, boom, I got that there were three dots together.

Under position, we have 2D position. So we have four dots in a line. One dot is a little bit lower than the others. Stereoscopic depth.

I have three -- like 3D cubes, and one is a little bit further away, it seems, than the others. Concavity or convexity. Yeah, you can see it pretty well on the screen. Basically whether something looks like it's popped up or popped out.

And then we have movement. There's size change, we have three bars and one is growing and shrinking. Direction and velocity, we have three squares and one is moving back and forth. At different rates.

And rotation, of course. We have one of the little squares is rotating. And finally we have flickering, which is really -- catches our eye. Flickering.

They do this all the time in ads. It's there to catch your attention. I'm gonna do a favor to you and I'm gonna take all of those movement things off the screen, because those really catch your attention. So three of these, three of these preattentive attributes are really great for showing numbers, as opposed to categories.

Can anybody guess? Knowing what you know about charts, which three are the best? And I already gave you a hint about which one -- one of them might be. Which three of these might be best for representing a chart?

Can you think of any of these as being a particular kind of chart? Anybody? Yeah. Obviously length.

That looks like a bar chart. Anybody else? Nope. 2D position.

Yeah. 2D position. It's like a scatterplot. And there's one more.

Not to... And size. Yeah. Those three really represent -- I can't tell you why.

But those three seem to represent -- in testing, they seem to represent numbers really well, as opposed to these others. Some of which are categorical or attention grabbing or other things. Like you can imagine colors being used to categorize things very easily. Okay.

So now going past the preattentive attributes, there's something called gestalt principles. Anybody heard of these? Yeah. So these are higher level pattern recognition that organizes those discrete elements that we see into a unified whole.

That's the layer past the set of filters where we're saying... I recognize a parallel line, an intersection, whatever, I recognize a color. These are things that are more collective, with a set of different features. So these broke down to proximity, so things that are close to one another.

And here I have some examples of proximity, where it looks like -- you associate -- so I have three -- I have a little 9-square. So it's 3x3. And then I have two columns of 3, and then I have a random collection that doesn't look like it has any pattern. So you think that those three on the top are related to one another.

You think that the three -- that the two columns, each of those two columns is related to its other members. But really, they're just positions on the screen. It's arbitrary. They're really just up there on the screen, and you are bringing to that -- that these things are clustered.

Enclosure. I have two examples of enclosure. Basically an outline or a background that seems to tie three things together. Those things are not related.

Your brain tells you those things are related, because I have enclosed them for you. Connection. Lines between things. There's nine dots.

Four of them are connected. You think that they're somehow connected. They're not connected. Those are just lines on a screen.

But your brain tells you they're connected. Try to shake the idea that they're connected and you're not gonna be able to do it. Similarity. Some of the dots are red, some of the dots are blue, and you think that they're together.

Closure. You think this is a rectangle. It is actually a set of three lines in a vaguely rectangular shape. You've completed that rectangle.

Your brain has done this without your permission. And without you asking it to. It's just done. Continuity.

I have two bars on the screen. A light blue bar and a dark blue bar. The dark blue bar is behind the light blue bar. Or maybe it's just three bars.

A light blue bar and two dark blue bars. But your brain told you: That thing's connected! Your brain told you that when you see the shape of a predator in the trees that the head and the tail and the claws are all connected, even though you're seeing different patches of them. Common fate.

When things move together, there's a few elements that are animated, and one is just standing still. You think those three are somehow connected. I'm gonna take that off, because it distracts me. So these are processed after sense memory.

But they're still preconscious, and they're processed in parallel with one another. We don't have to do anything. Like preattentive attributes, there's little to no increase in cognitive load. What are we trying to do for our users?

We're trying to decrease their cognitive load. We're trying to go from getting information to taking action. And sometimes without them wanting us to. What we're trying to do is we're trying to decrease the amount of effort -- who said "Don't make me think?"

I can't remember, but you know the expression. Don't make me think. Don't make me figure out how this weird light switch works. Just put it into my brain.

And that's what data visualizations do, in an alarming way. People misuse data visualizations all the time. But they fool us. Even people who are trained.

There have been studies. People who are trained in data visualization, understand it very well, are consistently fooled by misleading data visualizations. It's automatic. So there's a phenomenon I call: Hey, look over here!

Basically, WCAG talks about color and the use of color. But color is just one of a class of attention-grabbing things. Right? They're attributes that -- we use them for -- basically my point here is: If you're gonna use color to draw somebody's visual -- animation as well -- if you're gonna use a color or animation to draw somebody's attention, make sure you add a semantic focus there as well.

Don't just make it a visual thing. Somehow indicate to the user through ARIA or what have you that... Okay. Something here has changed, and I'm giving you an update about that.

Okay. So everyone here knows what ARIA is, right? Does anyone not know what ARIA is? Okay.

We'll get into ARIA. ARIA is a markup language that tells things what they are. It tells an item what its role is, so it can talk to a screen reader. We'll talk a little bit about that.

Basically we want to reduce the clutter. We want to boil things down to their most minimal, most meaningful functions. And that's what we're doing with the data visualization. We want them to perceive the data, think about the data, and then reason with the data.

Make decisions with that data. And we have problems there, because now we're going from something where somebody has a wide visual range to something a little narrower. So what do we do? Before we get into that, there's something called the fast and the slow mind.

Who knows fast and slow mind? Okay. So the fast mind -- these are two different systems you have in your brain when you're making decisions. The fast one -- boom.

Things just happen immediately. Very low effort. That's where racism comes from. That's where insight and intuition comes from.

That's where your brain is just... Boom! It's just linking you up to your first impulses. Preattentive attributes and gestalt principles feed into that.

It goes deeper than that as well. These are usually emotional. They're automatic. And they're frequent.

We have them all the time. And then there's the slow mind. That's the mind where someone says... Oh, maybe I shouldn't have said that.

Maybe I shouldn't have done that. It's logical. It's calculating. It's conscious.

Or maybe I can try to do this new thing that I hadn't thought of. Oh, now that I understand this data, I get what the data was telling me. But now how can I apply this to my life? What can I...

What can I glean from that? How can this change my life? How can I make a decision using this data? Data visualization uses those systems to convey data -- uses the fast system to convey the data, and then you can use the slow system to actually process that and make that meaningful.

Make that part of your life. But that slow system is cognitively expensive and it's slow. And I don't know what this slide says. Oh.

So we need to reduce the speed and effort in accomplishing tasks in a non-visual way. As I just said. Okay. You're gonna kill me.

There's a little more neurology. And then we'll get into something a little more deep. Okay. So we have a lot of kinds of memories.

You think of memory -- okay. How many kinds of memories do we have? Somebody name the kinds of memories we have.

Proprioceptive.

DOUG: Oh! You shut up. I don't want to hear from you for the rest of the lecture. You've heard of short-term memory and long-term memory?

Yeah, that's not real. It is, but it's much more complicated than that. There's something called iconic memory. This is your visual memory.

It has 100 milliseconds duration. Talking about this very clinically, this is what's going on. You ever see a sparkler move around and you see the image? You see a movie where there are a bunch of still images that they show to you, at 60 still images per second, and you think that the thing on the screen is moving?

That's your sense memory telling you: Oh, this is moving. I see it moving. No, it's -- hummingbirds actually see the individual frames. This is one of several types of sensory memory that we have, this iconic memory.

Then there's echoic memory. This is your audio memory. It lasts a little bit longer. If you repeat something to yourself, to remember it, you repeat it, repeat it, repeat it, that's part of your echoic memory.

It's really high density. And there's haptic memory. It's really short. They don't know that much about haptic memory yet.

But it's probably used a lot in Braille, for example. Then you have your short-term memory. You see how there are a bunch of different blocks? I have a picture of a brain here.

And an eyeball. And the brain is looking at a bar chart with four bars on it. And then each of these blocks of sensory memory has several different little registers, I'm gonna call them. Places -- slots, places you can store information.

Once you have this sensory memory, it tries to get into the short term memory, but the short term memory is temporary. And it's very low capacity. It does not have the capacity to process everything we're seeing and hearing. We have to filter out just the most salient bits of that.

And then that takes that short-term memory -- it's a filter that once we've sort of tried to decide what we're gonna pay attention to, it gets shoved into the working memory. The working memory is more capacious, and the working memory is where we start encoding it. That's where we start making connections between what we just saw and past memories and past experiences that we've had. Past ideas.

Models of things that we have in our head. And then there's long-term memory. As far as we know, it's unlimited capacity, indefinite duration. We have no idea really how this works.

That's where your semantic content is. All the stuff that you've processed -- that's where it goes. I point it as one big block, but in fact, it's a bunch of different interconnected blocks. So what is going on with the data visualization?

Why am I talking about memory? I can't recall at the moment. But... Oh, there it is!

So visualization effectively is taking... Because our visual processing is so fast, we can take something from the brain, sort of -- something that is stored in our short-term memory, and we're outsourcing the task of our short-term memory to something visual on the page. Our brain is working back and forth, really rapidly, with that data visualization. We're able to actually extend our brain using this data visualization, because we're just...

Even though we don't have the capacity in our brain to store all this information at once, we're actually using the brain, or using the external media, to supplement our brain's capacity. That's wild. So what -- all of these things are affordances, right? If I'm using color to give you an idea, what am I doing?

I'm providing you an affordance about that thing. If I'm using the length of a bar to tell you this thing has more value than this other one, it's an affordance. Right? It's all a set of affordances.

Who here is a UX designer? A few of you. Do you know what affordances are? Does anybody not know what an affordance is?

Okay, great. An affordance is when you walk into a doorway, you open the door, you reach to your right, your hand grabs a light switch. You flip the light switch on. You have to push it up, because the little...

It was angled down, so the affordance was -- first off, its position, right at a set height, about shoulder height, or a little lower, inside -- on the inside wall. It's not behind the door. It's on the other side of the door. There's a little switch that tells you...

Oh, I can only move it this far. I can only move it this direction. You push that -- oh, got it. All of those are affordances, right?

If a door is locked, you can't turn the knob. Okay. That's an affordance. It tells me this thing is not able to be used.

An affordance is the means by which you advertise a service to be discovered, and at the same time, you provide the means by which a person can use that service. Right? So again, opening a doorknob -- oh, the doorknob doesn't move. That means it's locked.

It does move. I can turn it. Okay, great. The door will open.

So for each of these affordances that we are providing, with bar charts and line charts and pie charts, we have to provide an equivalent experience for somebody, for example, low vision, blind, cognitive disabilities, where they can't visually process things very well. So affordance and equivalence is not just the long lost Jane Austen novel. Oh, come on! I have a picture here of a Jane Austen novel called Affordance and Equivalence.

That novel doesn't exist. I think that was Pride and Prejudice. But each feature of the chart includes an affordance and a set of tasks that it is geared towards. Finding out the duration of something.

All sorts of different affordances. And for each of these different tasks, we have to isolate the channel and the mechanism and find an accessible equivalent. So we reduce the cognitive load as much as possible and anticipate the user's needs. If we don't have sight, for example, how can we provide the same information?

So we have to use the other senses to provide these equivalent affordances. So... One example: Here is an audible tactile map. I saw this in, I think, 2003.

I was blown away by it. It's a map of Vancouver, and it is printed on contoured paper. And you take that embossed paper, and you put it onto a touch screen. And the person can move their hand around, and this embossed paper lets them interact with the touch screen, so they can understand it tactilely.

And of course, you can print using a Braille font on that. And then there's something called sonification. Anybody know sonification? Yeah.

So here is a sonification. I'm actually gonna... Let me turn this down a little bit. I'm gonna ask y'all to bear with me, because it can be actually quite shrill.

I made this a long time ago. I need to update it. So we have a bar chart here. I'm sorry.

A line chart. And as I run my mouse over the line chart... (electronic blooping rising and falling in pitch with the line) Let's move off of that, because of that sound. But basically, as the bar chart, stock market chart, rose higher, the tone went higher.

As it dropped, the tone went down. And that's good for giving somebody a gist, right? They can come to that thing, but they can't really get the numbers. They can identify trends, they can identify outliers, but it's not good for precision.

It's like color. We have a limited amount of gradation that we can understand with these things. Excuse me. So we need text for precision.

And that means voice or Braille. So voice interfaces, conversational interfaces, that let you ask questions and get answers. I think the next slide... Oh, I was wrong!

I'm gonna show you a demo of that. But first we have something called data viz as document. So we have a data visualization in a document on the screen. The title of both is the same.

They both have a title. Right? And you have the provenance, who wrote it, or your sources for the data. Your intro.

And in the case of an article, it might be your first paragraph. Your introduction. In the case of a data visualization, it's your axes. What's the context?

What are the dependent and independent variables, if you know those terms? And then you have the body. The body is the 3 paragraphs, in the essay, or it's the actual data itself, the data bars, for example, themselves. And then you have the conclusion.

In a document, the conclusion is basically the last paragraph. But in the data visualization, the conclusion is the insight that the user has gained that lets them make decisions, that lets them take actions. Establishing context. So before...

I'm gonna show you a demo, again, and before, I just walked through a few bars. This thing is not cooperating. I just walked through a few bars. And you heard values.

But you didn't actually know what the values were about.

Percentage of college graduates by state, 2010.

DOUG: Percentage of college graduates by state, 2010.

Ranging from Alaska to Wyoming.

First X axis. States. We know what we're talking about here. So the first thing that a blind user, a screen reader user, should hear is: Okay, what are we talking about?

Y axis. Percentage of college graduates. 12 items.

DOUG: Okay. Y axis, the percentage of college graduates. Now we know that what we're looking at is the states and we're looking at the percentage of college graduates in each state.

Alaska, 27... Alabama... 21. Arkansas, 19.5.

DOUG: And then once you've got that, once you understand that information, then those numbers are meaningful. If I just showed you Arizona, 25.9... 25.9 what? What's the context?

So we really need to establish context before we just throw a bunch of things at them. Tables... You could put a table in there, but there are things I don't like about tables. All this -- by the way, the techniques I'm talking about here, I call this deep graphics.

These are images that have extra information behind them. Alt text is a kind of deep graphic, but it's just the beginning. You can embed data in data visualizations. You can add text or link sources, lots of possibilities.

Accessibility is only the first one of these. So here's the anatomy of a chart, for example. First you expose each individual landmark. So we have the title, then the X axis, then the Y axis.

And then you would let them walk through each data point and get each data point. But then if you add... So I use SVG for this. You could use other things.

But I add roles to each of the individual parts. I say: This is the X axis. This is the Y axis. This is a data point.

This is the title. And that way, the screen reader can actually start making sense of those things. It can actually treat them like what they are. Then I embed the data into the chart directly.

And then once we have that data, we can derive values. I can find the high, I can find the low, I can find the range, I can find the total. I can find the mean. I can find the trend.

With sonification. Once the data is in the chart, the data travels along with the chart. You don't have to ask Dave in HR to give you the Excel file. No.

When Dave sent you that chart, you had the data. You could extract it. You can reuse it. So it makes it more accessible.

Doing this technique makes it more accessible. It makes it more searchable for SEO. Makes it more reusable. It makes it more portable.

You can use this with smart devices, with smart speakers, any eyes-free environment. You're running to a meeting and trying to find some information on your phone and don't want to look at your phone. And the data provenance -- basically this is more for scientists. We want to link back to our data.

We want to have that data be credible. I'm gonna try to draw towards a close here. But in the past, I've seen a lot of people give a free pass to data visualization. Say...

Just put a table in there. Write alt text or a long description or create a hidden data table. I don't think that's gonna be good enough. I think we actually need to let them do things like find the trend, find relationships between individual data items.

A table is not equivalent access. It's an increased burden on the user. Blind people are constantly bumping into tables on the web that stop them from really getting at the information. Here we have a periodic table of the elements coffee table.

If a table were as accessible as a data visualization, we wouldn't use the data visualization. I would just be throwing spreadsheets up on the web, right? I wouldn't be putting line charts and pie charts and bar charts. If those were equivalent experiences, we wouldn't be using them for sighted people.

This compliance landscape is changing. There's more and more accessible data visualizations out there. So if you're an organization, and you are using data, and your data visualizations are not accessible, you might want to revisit that decision. So there's lots of ways you can do that.

You can find -- if you have a scientist in your organization, find your early adopters. Scientists like ethics. They like credibility. Get the data scientists on your side.

Accessible data visualizations don't cost any more than inaccessible data visualizations. You can make a data visualization accessible. You're not drawing these things by hand, people. If you are, you're a rare bird.

You're using software to generate your data visualizations. That software can make accessible data visualizations, and you should expect and demand that. So I'm gonna skip over this. No, I'm not.

I want to say something about one size does not fit all. Everyone knows that you need to have a high contrast ratio with your colors. Right? Everybody does that here in this room.

Did you know that that hurts dyslexics' ability to read?

JOLY: The last presenter we had talked about this.

DOUG: There you go. You can't expect one design to meet everybody's needs. You can try to move towards designs that meet a multiplicity of needs. And let them adapt to the thing that they're using.

To how they want to use it. Data visualizations were great for low vision people, because they can see the patterns and they can zoom in to get the text, for example. Consider your target audience. Create a data visualization with them in mind.

So again, data visualizations are a functional metaphor. My functional metaphor for them is that data visualizations are a user interface for data. Do people understand what that means better by that at the end of this than at the beginning? There are two people nodding, so I think I succeeded.

Different kinds of data visualizations are optimized for performing different tasks, like comparison to the whole, comparison to other data points, trends over time, breakdown into categories, filtering and sorting, connection between items, navigation and focus. My company is trying to make implicit actions into explicit actions and give the power to question and answer to everybody. So there's different levels of data visualization. The first level of data visualization is saying that this is a bar chart or this is a pie chart.

Don't do that. That's like telling a joke and not telling them the punchline. Actually, there's another level, where you just don't have any alt text at all. The benefit of that is that it can be automated, as a process.

The con is that it's useless and insulting. You can provide detailed summaries in alt text. Like: Line chart showing market trends with a downward trend over the last year. That's useful.

It can be automated. But it doesn't allow the user to find their own trends in the data. Find their own -- what they're interested in, about the data. You could provide hidden content in a table with the same information.

Everybody knows this gets out of sync with the actual data visualization. It's not great. Also, it's serial access only. You could provide a table alternative in the data visualization.

I've showed you some of that. But you could also provide the ability for people to explore things like tell me trends, tell me comparisons between bars, et cetera. And that's what my software, for example, does. I think that's gonna be an emerging trend.

If you want to see a demo -- I don't want this to be about my software, but if you want to see a demo of mine, I'll give you some contact information later. There's a bunch of libraries that can be made accessible. Or that produce accessible stuff. When I say accessible stuff, I don't mean that you can change the colors to a colorblind-friendly palette.

That's not accessible. That's a very narrow definition of accessible. So High Charts has some good accessibility, and they just added sonification. SAS has good sonification.

It's a little expensive and complicated, but they have a free authoring tool for students. Who here has seen Semiotic, an up and coming data visualization library. Some volunteers have put some accessibility in there. There's Progressive Access.

If anybody knows R, you can use their R Braille package. And Fizz Charts, my product, we're actually in alpha phase now, and I think it's the most accessible of all of these, because I've really thought about: Okay. What is the data visualization? What is it doing, and what can we actually do with the data visualization?

If you're interested in that, you can write [email protected], and it will get to me. But alpha helps me say... Okay. These people want to see the alpha.

And we're gonna be doing a webinar in the coming months, if you're interested in that. And my name is Doug Schepers. My email is [email protected]. At Twitter, I'm @shepazu.

I really appreciate your attention. And if you enjoyed this presentation, I want to give a plug to my friend Mara. The reason we're here in New York City at all is because she wrote her second play, and it is being performed here tonight, and this weekend, and then next weekend. Year of the Monkey.

At the Tank, New York City. And that is my presentation. Thank you. (applause) Sorry about the plug.

We appreciate a plug here at Accessibility New York City. Right now we have some time for Q and A. And afterwards, we'll have some time for some networking and mingling too, so stick around. If you have any questions, just raise your hand and I'll come with you.

It's important to speak into the microphone, so that we can hear you for the stream, and also for folks that are watching right now online. If you have questions that you would like to put forward to Doug, please type them into the chat, and we'll make sure it gets asked. So just wave your hand if you have a question. Anybody?

Any questions online?

Wait. We have one.

So... If you're dealing with a bunch of existing data visualizations, and you don't have a ton of capacity to remediate accessibility issues, what's the first step that you would take?

DOUG: First step would be: Look at how they were generated in the first place. See if that can be made accessible. Has that software -- does it have an equivalent accessibility thing? If you're looking at past stuff...

The problem is data visualizations... Making a data visualization, a PNG or a raster out of a data visualization is a lossy process. Once you've gone there, there are emerging pieces of software that can look at a chart and try to gauge what the numbers are. This is why I really like the idea of deep graphics.

Embed the data in the chart, in the metadata, whether it's an SVG file, or you can put it into a JPG or PNG, using metadata. Put the data in there, so that if somebody needs to use it for something other than that chart, needs to update it, you can extract it. That's a terrible answer. My real answer is...

If you had the data, you could just publish a chart. Right? You could... I mean, that's what people have been doing.

It is an acceptable first step. Right? Make a table of the data. And hide it behind the bar chart or whatever.

That's what I would do if I couldn't get new software to do the thing.

Would it be acceptable to also provide some contextualization, like a narrative?

DOUG: Yeah, absolutely. Absolutely. I should have said that in the beginning. Alt text, long descriptions, all of those things are great if you can do it.

Those are really -- actually, in fact, I would say that for things where you're trying to show trends, like a line chart, those are typically superior to a table. Right? Because you're actually providing... What you tried to tell the user with a line chart is that: Look at this trend over time.

Right? And you don't really get that with a bar chart. Right? You have to follow the thread and you have to...

Oh! So if you just tell somebody... Product A had a decreasing user base and product B had an increasing user base, and they started at this point and they ended up at this point, right, and they crossed at... In 2009, whatever.

Right? Giving that kind of summary is probably the most useful thing you can do. And then I would also ask that you put the data -- give them access to the data. Because you don't know what they actually want to do with the data.

Thank you.

DOUG: Yeah, thank you.

A lot of the charts you were showing us were line charts and bar charts and such. Do you think your recommendations for making charts accessible would also work for things like pie charts and histograms and the other kinds of charts?

DOUG: Pie charts, histograms, absolutely. I didn't show you the full capabilities of my library, but yeah, I do pie charts, I do histograms. Histograms are really just a special case of bar chart. In terms of the affordances that they provide.

Now, where you're getting into interesting things are stacked charts. And stacked bar charts, or scatterplots. Ooh, scatter plots, mathematical plots, I've got some interesting things going on about scatterplots, but nothing I want to talk about at the moment. It's complicated.

With things like pie charts and scatterplots, there would be a lot of information that a bar chart -- where a bar chart or a line chart would only have two or three elements, and those would have a lot more elements to handle.

DOUG: Actually, that's a great segue into a point I've made before, which is: When you're making a data visualization, think about writing a poem, not a novel. Right? You only have so much attention that anybody is gonna be paying to your data visualization. Unless it's an exploratory data visualization, where somebody is trying to discover emergent patterns, if you're making an explanatory data visualization, keep it as simple as possible.

And then simplify it a little bit more. So with bar charts and line charts, you can actually have quite a few data points. With a pie chart, five slices, maximum. Don't go any more than that.

Because otherwise, if you need to make an "other" pie, that's fine. But don't go more than five. Maybe six pie slices. And in that case, actually, it's very easy to understand what's going on in a pie chart.

Yes?

To that question around... And your answer around giving a description of, say, a line chart, where you can say that... It's increasing at a greater rate...

DOUG: Greater rate, faster rate, et cetera.

Et cetera. Isn't that much more useful than the sort of... Taking in and being able to use a cursor across a thing, and saying it's going up? Where you're actually interacting with it?

Is it worth trying to make it interactive at all? Or is it just really worth giving that sort of description that gives you the 30-second... This is what it's looking like?

DOUG: I think that is... I think that you are correct, when you know exactly... When you're telling a story about the data, again, data visualization being a story about data... When you only want to tell one story, great.

When you are letting the user discover their own story about the data, that's where you want to give them the ability to drill in. And I agree that a quick summary is actually... You should not only give them the ability to drill in. You should give them the quick summary to let them know whether or not they want to drill in.

But you should also give them the context of saying: Okay, let's say I had 50 bars on a bar chart, right? And I had New York and California highlighted. Right? And I said: California is X times more than New York with regards to this metric.

That's great. But if you also tell them... And there are 50 other bars... Then they can decide whether...

For example, I grew up in Missouri, and I live in North Carolina. I don't care about New York or California. I want to compare those two on that particular metric. Right?

Or maybe I'm thinking about going to school in Michigan and I want to compare that. When you know what story you're telling them, and you only want to tell them that story, okay. But you should give them the option, you should tell them: Oh, and there's all this other information that you could get at, if you want to get at that information. Because you don't know how that information is gonna be used in the future.

But yes, you should provide a quick summary, because time and attention -- right? A screen reader user doesn't want to go through every bar just to understand the trend, right? They want you to tell them the trend. And that actually can be automated as well.

Right? As part of our software, for example, we provide an overview, a summary, of trends and blah-blah-blah. The highs and lows, et cetera. And that sort of thing can be automated, when you're starting from scratch.

And actually, with some of the new AI that's coming out, some of the machine learning stuff, people are trying to do that with some of the machine learning stuff.

What are your thoughts on incorporating the third dimension for data visualization and the difficulties which incorporate this approach?

DOUG: I avoid it like the plague. It's not just a stylistic thing. It is a stylistic thing. People are notoriously bad at using stereoscopic images and actually gauging what that means.

3D bar charts are okay. But when you actually start adding... When it's just decorative. But when you actually start adding multiple bars behind that, unless they're able to, like, go in and really manipulate it...

It just overwhelms people, to be honest. And stylistically... Yep, thank you. Stylistically, it is...

Flat is more in now. But even just in general, have you heard of Tufte? Tufte says reduce the amount of ink that you're using. And I'm gonna amend that and say: It's not about the ink.

It's about the number of things the person has to look at. It's the number of preattentive attributes that person has to use, in order to get at the intrinsic cognitive load of a piece of information. So there are cases where 3D can be useful. But unless it's absolutely necessary, I personally would avoid it.

So you were talking about this in the context of using, like, bar charts or charts on the basis for 3D visualization, but what about rethinking visualization of this information? Like, especially with virtual reality? The capability of built environments, where we can play with data in a completely different way.

DOUG: Yeah, yeah.

In a more explanatory, playful, haptic way, even. With spatial sound, we can maybe place accessible information for blind people in a virtual space for exploratory purposes as well?

DOUG: Yeah. I mean, I think any of those experiments are great. I encourage people to experiment. I think that I would like to see hard data.

Right? Without data, you're another person with an opinion. Right? Me, you, anybody.

I personally don't know if using 3D in these virtual environments is gonna be more useful to people in a certain way. It could be that my thinking about this is limited. And I encourage people to experiment and think outside of what I've said or what anybody else has said. And try and see if that works.

But I would say with your experiments bring it back down to brass tacks. Try to see... Okay. You're a very fancy 3D visualization of something...

That lets somebody walk around the bar chart or the map or whatever it was, and used sonification, 3D spatial sound... How quickly were they able to get that information, as opposed to how quickly they were able to get it with a 2D map, right? How much longer did they retain it? Versus how long they retained it...

Break it down to metrics. And maybe that experience of walking around it will actually add an additional set of neurons that lets them retain that longer. I don't know. But it should be done...

You should look at it in terms of metrics. How much are you asking them to perform, versus how much information are you giving them, and how much value are you giving them? How many tasks are you allowing them to perform? Does that make sense?

So I encourage the experiments, but I say take the experiments and actually measure them. By the way, that was a very good data scientist answer I gave right there. Use data! I'm not a data scientist!

Okay. Our first question is from some guy named Thomas Logan, writing from Japan. (laughter) He asks: Any recommendations for reading on preattentive attributes and how they affect ADHD?

DOUG: Oh! Hm. Well, I did a lot of reading on preattentive attributes, and I have ADHD, so I think I must be an expert in this. Honestly, I read a bunch of different sources on preattentive attributes.

My own personal experience of them was that when I had those moving things on the screen, I couldn't concentrate on anything else, and I couldn't give my presentation properly. So I figured probably nobody else wanted to see those moving things either. So I only have anecdotal experience with regards to the preattentive attributes, and ADHD. ADHD is not about attention deficit.

It's about impulse control. And anything that distracts you... Oh, squirrel! Anything that distracts you and pulls you away from your task is gonna be harmful.

And that includes preattentive attributes, if used for evil. Right? I haven't read about preattentive attributes and ADHD, but if you find anything out, Mr. Logan, I encourage you to let me know.

Great. And the next question: What are the next trends you see in data visualization and accessibility?

DOUG: Line charts. That's... Because line charts show trends. No, wait.

That was a... What trends do I see? Okay. The trends I would like to -- thank you.

Thank you! I appreciate that. You're an easy audience. I appreciate that.

I don't know. I'm not a futurist. Right? I don't know what's going to happen.

What I want to try -- the change I want to see in the world, the change I'm trying to make in the world, is to get people to embed their data in their data visualizations, so that as it travels around, through space and time, through different hands, that data can be reused by lots of people for lots of purposes. I get super frustrated when I see a... I'm trying to make a visualization of something.

I do a lot of political nonsense. So I want to find... Okay. Here's a map of who voted for whom, and then here's college education levels.

And those are both charts, and how do I get the data from them? So that I can make a third chart or a third thing or make a new point about that? How do I do that? And it's very difficult now.

And I encourage people to embed data, and because I see companies, other companies, doing accessible data visualizations, embedding the data in the structured way in which I say it -- I think that is an emerging trend, that data is going to be moved -- and also scientific publications are encouraging their scientists to include the data in their scientific publications. For credibility's sake. And so I think that having more data at your hands, not just the product of data, not just an image of data, but the actual data itself, is a trend.

And I think I'm gonna stop there. I think there's a lot of interesting things that people are doing with data visualizations and accessibility. But... Talk to me about it next year.

Cool.

Thank you so much!

DOUG: Thank you all. (applause)

DOUG: Not thank you all. Thank y'all!

Thank you guys for coming out. I really appreciate it. We've had two meetups this month, so we will not have a meetup in July. We'll be back in August.

But we will be joining our friends at DiverseAbility for Disability Pride on July 14th. If you're not a member of our meetup online, please consider joining, and then you can get all of our news about all of our upcoming events, including information about that event, if you'd like to come out with us. So I hope you'll stick around and get to know each other, and if you have any questions for Doug, you want to have one on one offline, he'll be available afterwards as well.

And have a great night. Thanks! (applause)

DOUG: And I have non-embossed business cards, if anyone wants a physical artifact of meeting me. And go to see Mara's play, Year of the Monkey.