Keith Instone: Thanks for having me here to talk about visual literacy. I'm still a computer science guy. I'm going to be talking about art. I'm not really an expert in any of this but I'm happy to share what I'm learning along the way. Why is visual literacy? Why do we care about it? Some things are obvious. We're designing very visual interfaces nowadays. We're inventing new visual languages, as the technology changes. Adding gestures and all these other things that our poor users have to understand. In the future, things are probably going to get even more visual and more complicated. We're going to be just constantly invented new languages to communicate through our technology. I think we also do a lot of communication within our design process. Doing sketch boarding or wire framing. Everybody here should be good at that already. I think that we could probably do better. For me, things like the wire framing. It's an interesting deliverable that we do, because it has to convey what the end users see, but it also has to convey all the discussions we're having with stakeholders. I think that there's a way that we can improve our work products that we do along the way. We're also doing a lot of visualization to communicate with stakeholders. Customer journeys are all their age nowadays. I've got a client paying me to do one right now. This is a form of visual communication. If we want to be effective communicators, then our audience has certain levels of visual literacy. Some customer journey maps may not be appropriate for certain audiences. Maybe that one at the top is way too complicated for an exec, but the one at bottom done by LEGO is so simple that even our execs can understand it. I think that there's lots of room for it. Part of my journey when I started figuring out what new thing to explore, I started talking to people at the Toledo Museum of Art actually because of a videogame exhibit that I'll invite you to later on. I figured out that they were into this thing called visual literacy, which I'd heard of but wasn't quite sure what it was, and so, I was like, "OK, let's go learn some more about video literacy." Some things that they talked about...think about it from an art perspective, right? You're an art exhibitor. You're taking these French impressionists, then you're arranging them in a certain way, and you're designing an experience around it. I started looking at some of their principles like, "Hey, I need to worry about emphasis and balance and proportion, too. I might be designing a website. You're designing an art exhibit. We should be talking to each other, because we probably have some things that we want to share." I made a little bit of a plan being a little anal retentive, some things that I wanted to do to learn about visual literacy. I actually joined the International Visual Literacy Association, I'm one of them now. I joined their club. I started reading their journals, this one journal, bought a whole bunch of used books. I bought a dozen books a buck that costs $200 in shipping, because, again, these are all ripped up, used books. They're good enough. Things from the '70s that were written as textbooks. I bought a bunch of books. Again, this is just the beginning of my journey. I'm hoping that you guys can give me some feedback on it as we go along and maybe some of you want to join on this journey with me. The official definition of visual literacy. Let's see if you guys can get this right. How smart you are? Understanding how people perceive objects, interpret what they see, and what they learn from them. Ability to construct meaning from visual images. Recognizing and understanding ideas conveyed through actions or images conveyed through pictures. Ability to communicate through doodling, drawing, and sketching. An umbrella field filled with components of visual perception, language, learning, thinking, and communication. Who thinks A, how people perceive objects is a good definition or is the official definition? No? B, constructing meaningful visual images. Does that sound good? That's a good sign, Anthony here says, "Yes," and he has an art degree. [laughter] Keith: That might be a good sign that B is it. C, recognizing or understanding ideas conveyed through visual images. OK, some of that. D, ability to communicate through doodling, drawing, and sketching. No, OK. Of course, you guys didn't bother voting, because you understood that this was a trick question. They all suck, yet, they're all correct because there's no one single definition. There's even an article about why there is no one single definition because there's all this multidisciplinary activity going on. Everybody's inventing a new definition and all this other stuff. One reaction could have been to run and hide. These people don't have their act together. For me, it is the opposite. I'm home. This is just like the IA world who's been trying to define the damned thing for 15 years. They've been doing it since 1969. There you go, just another dizzy multidisciplinary world I'm entering in. Here are some of the different fields of study that have gone into this thing called, "visual literacy." Computer science background for me. Art history, I never even went close to that part of campus when I was in school. I did learn some psychology along the way, so that's good to know. There's a little bit of psychology overlap. Anybody have backgrounds, I know Anthony has an art background. Anybody else have backgrounds. There should be people in this group that came to UX, what's your background? Audience Member: Graphic design. Keith: Good, yes, you already know more than I do. You're very fluent in this and I'm just trying to become literate. Any instructional designers or media studies people? Yes? Jody: Instructional design. Keith: Jody, that was your background, and then, you found your way into UX eventually, because you needed a job. Right? [laughs] [laughter] Keith: These are some of the disciplines that have merged together around, or at least collaborated, writing papers and other people's journals and studying together around all that. This will be an interesting mix. My average user experience conference has a few people like you guys that are here, but not enough. We can invite some more of these folks to our UX events and learn some more from them. Three things, this UX and this visual literacy thing, we've got some things in common, for better or for worse. Definitely this multidisciplinary thing. That's what keeps me excited about user experience. It's a lot about communication design. If you just boil it down, it's just about communication design, whether it's the written word or whether it's in the form of a user interface. Digital acceleration has changed things. Visual literacy was important, but now, there's 1,000 pictures added to Pinterest every single second. We've got a whole bunch of people that are...we're doing a lot more visual creation and overall the technology. I see this accelerating even more as the technology changes. For my personal exploration, I started with this thing called visual literacy, started reading a lot, started wandering around. I noticed that it was fuzzy. What is visual literacy? What is visual design? What is visual thinking? I spent a lot of time in this visual blah blah blah space. Thinking and visual design. It's, "OK, that's good. I know a little bit about visual design just because I've worked with visual designers over the years." Then I tied it into, "Oh, OK. Visual design. I know UX design. I know UX thinking. Let's compare." Visual thinking has this little focus. UX thinking is a little bit different, and tying it into design and systems thinking. "OK, I can dig up all these old systems references." As I was reading some of the papers about visual thinking, they were referencing books I'd read 10 years ago. I also went down the literacy path. "What's this literacy-type thing"? I bumped into things like info design and information architecture. It was actually cool. When I read my first paper that referenced Morville and Rosenfeld, the IA of the World wide web book, it was, "Cool." We've got some things in common. We're reading some of the same books. One key aspect of visual literacy is the educational side. There are actually higher education standards that have been written. If you want to be visually literate in college, these are basically guidelines to help teachers teach people to be visually literate, if you want to get a four-year degree and have that included as part of your skill set. It should be pretty straightforward. Things that I think we already do. Knowing how to use visuals, how to organize visuals, how to interpret visuals, how to evaluate them, using them for multiple purposes, not just for something very specific. Of course, being able to design and create, and also thinking of the economic and legal issues of not stealing people's work. Stuff like that. That's another way to look at visual literacy. The main focus of the stuff that I've found is around basically how to teach the teachers. Teach the teachers to do this so that they're teaching visual literacy in their courses. This happens to be for higher education. There's also things in elementary school...unfortunately, today, there's not state guidelines that say you can't graduate fifth grade. If you can't read words, you can't graduate. But there isn't anything that says you can't move onto sixth grade unless you can tackle some of these visual literacy skills. That's what some folks are working towards. Here's a diagram that you'll find from the visual literacy folks. It's using stairway, it's using this metaphor as the steps that you go up through nirvana, which, in this case, is with an Oscar's trophy or something, which represents the ultimate in visual representation. It shows different steps of choosing an image, choosing the shape and color, worrying about consistency and contrast. It's really teaching the concepts of how to create good images. If we made a version around creating good user interfaces, we would include things like consistency and repetition and color and texture, there's overlap here. It's also an example of what's common in this field. This is an instrument to help somebody teach somebody how to be visually literate. In this case, they're trying to use a metaphor to teach that. Another thing to stress...I'm just learning how to be literate in this. There are other folks here that are fluent. From a user experience team perspective, it's this t-shaped thing. It's important. Some people need to be literate in a broad set of skills and other people need to be deep in certain things. It may be useful for some folks that are like me, the don't really have a visual design background. This could help them become somewhat literate to communicate with the folks that are more fluent, just like we would need to be literate in technology, business and a lot of other stuff. It's really just getting at the basics of what we can communicate. One thing that I found really useful was this white paper from Adobe back from 2003, 2004, I forget. That explained things more in digital terms, so this was better for me to understand things. We mentioned things around, I was thinking in terms of static images, this was mentioning movies. It's not just designing static images, but it's getting into motion a lot of things that identify what's really useful for the experience design. What else did they mention? I couldn't do a job like this without a Wordle, I took the abstracts and titles from two years from a journal, just to see what the academics were writing about. What were they writing about? And pumped this into Wordle, and so, what's clear is visual. Visual is mentioned all the time, which makes sense, but it also makes sense to literacy was not mentioned as much. Again, they're doing a broad range of visual topics, all underneath this umbrella term approach of literacy. There's a lot of mentions of students and courses and teaching, because there's a lot of educators teaching educators. Digital is in there, pretty small. I don't see the word experience here, or interaction. Those are things that could be missing from the discussions that they're having, that perhaps we could add to it. Get them talking about how interaction is a player in visual literacy, it's more of the interaction literacy. And then, cartoons jumps out. Cool, out of all the articles for those two years, I would probably only read one. I'll read the one about cartoons. If I want to hear about cartoons, that is what I could probably handle. How many folks have seen this? Does this look familiar to folks? One, two. OK, periodic table of visualization methods. This is one, as I was going along I was like "Oh, I've seen this before." About once a year I check this out and I study some different things, or I see a tweet where somebody has referenced this. Oh yeah, I've seen that. I just didn't realize that this was part of the visual literacy literature. It was just a cool little thing. If you're not familiar with it, they've used the chemistry periodic table as a metaphor, and they grouped things into it. This looks like basic data visualization, information visualization, concept metaphor and compound stuff. Again, a way to present things. If you mouse over things, you see things like here's a Venn diagram, just like my shirt, as an example. You can browse through and find lots of different visualization methods, right? This is definitely something I had already been using. I just didn't know it was visual literacy stuff, that was handy. If you haven't been there before, I definitely recommend you check it out. And some things where it might be useful, there's a lot of different information visualization methods, right? If you're building a dashboard about something, there's lots of things that have been developed to help you visualize that information. Some simple scatter plots and complicated tree maps. There's lots of examples of different deliverables we can use to communicate with our stakeholders. Cartoons, concentric circles, and so on, it might be just some ideas to generate. Like "Ah, this thing that I'm trying to convince the client about these concentric circles" is a good one. Other ones we would be very familiar to do, because we've co-opted the examples. There's this layer diagram, and I don't know how many UX icebergs I've seen in my life. But that's represented they are. There's an iceberg and it's a common metaphor that you use to convey certain kinds of information. That would be a useful thing. OK, the other thing I did is I started looking at some of the specific people. Who, in the visual literacy world did they really like? Who are they a fan of that I'm also already a fan of? Here's one. Who knows who this is? Yes? Audience Member: Dave Gray. Keith: Dave Gray. What is he well known for? Gamestorming is a book that he wrote around how to be created by having games, and part of playing games is drawing pictures, and so on. And so, he also does a lot of presentations and things around what he calls visual thinking. It's just using visual techniques in order to help you think, right? Instead of making a list of just words, if you're trying to solve a complicated problem, start drawing pictures. And so, he gives really good presentations, because he actually draws his presentation on a tablet. I'm way too chicken for that, I just hit the next button. How about this one? Pardon? No. That's a good one though, the napkin drawing. Who is this guy? Somebody. OK, Edward Tufte. OK, you guys might have to do a little bit more loading up. I thought everybody knows who this guy is. Maybe you know him from these books, envisioning information or visual explorations. It should be required reading for all of you folks. He's another common hero, so cool, I don't have to read that whole chunk of the stuff. I've already read that one. And this guy. Pardon? Ben Shneiderman, thank you very much. And he's known for doing tree map. Lots of things in the HTI world, he's one of the big three that we mentioned up there, sometimes, even more important than Jared. [laughs] In the user experience rolled, right? Sometimes, not always. It depends on who you're talking to. He's done lots of great things over the years. Part of his research is focused on information visualization, and that community loves them so much for his birthday, they took all of these visualization images and made this collage of his face. I can't imagine any greater honor than that. If somebody makes my face, I'll kill him. Some other folks have already done this mapping that I found out later on. There you have it. There's Richard Saul Wurman, he's in this knowledge visualization perception level there. There's Schneiderman again and Tufty, and there's some more names. I know a lot of these folks, this is this HCI corner over here. Again, I started finding more and more folks that we had in common. Oh, this is visual literacy, this is the art stuff, I don't know anything about it. I'm starting to uncover that maybe I'm not as dumb as I thought. I could still be. I actually went back to some of the things, laying on the floor of my office was a copy of Interactions Magazine. And I browsed through it, and I found this thing by Eli Blevis, which was really about visual literacy from an HCI perspective. There were things laying on my floor that were about visual literacy, and I just didn't know about it. Some examples from it, using pictures like this. This is a phone booth that uses this old rotary dial. As I indicate, it's a phone booth. What is that? Rotary dial telephones are two generations ago of phones, but it still somewhat useful as an icon for the technology. Really, using the images to start a discussion around it. So, that's already happening in the HCI world. Doodlers Unite is a TED Talk by Sunni Brown that everybody should watch, if you haven't already. It's really around how in a business context, doodling is frowned upon. You're not supposed to doodle, it's a sign of being distracted, but there's some good insights in there. If you don't believe me, Jared four years ago said "Why we sketch." And talking to a lot of designers, all of the good designers already do sketching. The article maps out the different uses of sketching. It's more than just to generate ideas, there's lots of different things. You can go ahead and read that article about sketching, too. If you really want to learn some more, I browsed through all you can learn the day before my account expired. And so, here's some different categories. There is already things that we have in our user experience repertoire about this, right? Especially, visual design, gamestorming, communication design. You can go in there, and there's Kevin Chang talking about how to use comics in order to communicate more effectively. That stuff's already in there, if you just want to go poke around a bit. I'm actually going to go hang out with these folks at a conference in Toledo. You're welcome to join me in November. I've got a session there where I'm going to be talking about user experience. We're going to talk about the business aspect. I talked to some of the visual literacy folks that are like, "We're OK in the education market. We're trying to get the CEOs of companies to understand that all their employees need to have some level of visual literacy in order to be effective employees. We're going to talk about, maybe there's some business opportunities there. Maybe we could help them. Maybe they could help us. Maybe if we went it together, go to the CEOs and say, "You need visual literacy and user experience." Pay for them as a package or something, I don't know. Wrapping up, just for this initial foray, what might this mean for the user experience community? What should we do to get a little bit better? What could we learn from the visual literacy folks? One is, I think we can embed some visual literacy scaffolding in our user interfaces. We're going to be building really complicated dice boards and other things. It'd be great if our users were always at a college level of visual literacy, but if they're not going to be, we've got to figure out how to simplify things but also raise up their level of visual literacy to come to us, because I don't think the education system is going to be cranking all out these folks that really are highly visually literate. I think we can use some of the concepts in here to help us build better tools -- wire framing is here to say, but what are some better ways, instead of just building a prototype, to embed some of those decisions we have to make? All the things that Dan talked about, as those interesting discussions happened. Could we embed those into the tools so that they're not lost, so that the text is appearing here, the visuals are over here. I think there's still a lot of work to be done to change the organizations that we work for and that we work with. Again, if we can communicate visually a little bit better, creating better customer journeys, lots of tools like that, then we can help move these organizations and help them succeed. That's all I've got for now. Let's do some questions. Is that good? [applause] Audience Member: What questions do we have for Keith here? Audience Member: Have you encountered or seen any good references for dealing with cultural differences in information literacy? Keith: Cultural differences. No, I haven't seen any yet, but that's on my list to find out. I think there was one paper that talked about it. But that's a good topic, because we can definitely apply from that. From one of my clients, I heard a story where he said -- and I can track down the research -- that at one point somebody did research where they showed a piece of art to Korean fighter pilots and American fighter pilots. The American fighter pilots said, "It's a picture of a tiger standing by a lake or something." Then, the Korean fighter pilots said, "This is a beautiful landscape." They described the bigger picture, and they said, "Oh, by the way, it has a tiger in it." That's the closest I've gotten to understanding some cultural differences between how two different cultures receive the same visual image and how they would interpret it. Audience Member: A lot of things struck me as interesting about what you're saying. There are people who, if they want to learn something new, they might go turn on a History Channel documentary, or maybe they'll pick up a book and read it, but you've taken this real immersive approach to this. Was this a conscious way to really immerse yourself, or is this just habit for you? Keith: Yeah. There's a whole another talk where I'm a habitual discipline crusher, or something. I did this before 10 years ago. I did this with the organizational change community -- that was over in the business world. I did it, actually, with the library sciences back when it was called IA, and I didn't realize it. But it was the same thing. I think we as a group should figure out how to keep interacting with these other disciplines, sharing what we know with them, learning what we have with them, and merge and morph, because that's what the world is going to need. We'll get deep, deep specialists in lots of things by nature, but it's broadening and sharing this hard work, so we've got to go out of our way to do it. Every year I pick a different professional association. This year I picked IBLA to join. In the past it was AIGA. But every year, I pick a different professional organization, and I join it for a year, and I see what I learn. Audience Member: Have you found anything that obstructs UX from visual literacy or the other around, where the ideas clash? Keith: Clash, right, where the visual literacy folks will say one thing, and we would say, "No, that's the opposite"? I haven't found that yet. I'm expecting something when we get the business world and education world together. That might be a conflict, right? Because we might say, we've got the CEO, he's hired us to train our employees to be visually literate, right? And then, we have the academics saying I have the academic educational standard. I'm expecting maybe some conflict there -- in the business world, this is how we train people, but in the educational world this is how we educate people. But I don't know. I haven't come across anything yet. Audience Member: I think one big place we clash already is internally: icons versus words. We have that debate over and over and over again. In higher education -- higher education in general is facing a bubble, but art and design education specifically. The mentality is, I want to send my kid off to college to get a job. But the purpose of college is to get an education, not a job. [laughter] There's a huge disconnect. UX has a really great angle through visual literacy towards bringing artists to our profession, rather than through data information or science information. I was wondering, in what ways are you thinking about taking this towards higher education? Keith: I don't know. I'm just getting started. I'm here for, "Hey! Who's got some good ideas for how we can take this to higher education?" Anthony has one, because he's been in that one. I did a talk, unrelated to this, at AIGA, which is the graphic designers. It was their educators' conference. I was talking, again, about, "Here's this UX practitioner world," and learning about how their design educator world is getting thrown into chaos. I'm starting to learn a little bit more about that, coming back to some of my academic roots. I think that would be another challenge as well. The alternative is that you just start up your own trade school and say everybody should go to the Unicorn Institute and screw higher ed. [laughter] That's another approach, right? Give up the ship, higher ed! Just let it crash and burn. I'm not prepared to do that, but yes. Audience Member: I have a background in education, and one of the things I remember learning in education school was that some people learn differently, differentiated learning and all of that. Thinking about visual learners as a skill that you either have or you don't. It seems like it was never something that we were taught to be responsible for teaching them. I think that might impact how art and design become back-burnered in the education system, thinking that's not a skill that they can then take with them. It's not something that they can learn and get better at. Keith: My wife teaches sixth grade. She teaches reading and language. In the world they live in, if the state of Ohio requires them to be tested in it, then that gets a lot more importance than other things. And the state of Ohio doesn't require you to be visually literate, right? It's not very practical. Some of it goes into, what do we want to do in kindergarten? You should probably be teaching visual literacy-type things, get them going in kindergarten. If we don't teach it to them, though, they're going to figure it out on their own from their friends, using Instagram. That will be OK, but it probably won't be as good as if we had a professional doing it and focused on it. Audience Member: This isn't really a question, more a comment. Keith: Excellent. Audience Member: There were some visualizations in there, I think, that a user experience person might look at and go, "Whoa, we really need to simplify that." Maybe around that. Keith: Yes. I wasn't making critique. I was just finding samples from the visual literacy world. Some of them were like, yeah, that's good. I think there's some opportunities for us to create some better visualizations, add a customer journey-type thing to their periodic table. If we mine some of our own visuals that we made up on our own, because we weren't aware of it, that might be new and different and they would love to have it added to it. Or, we just find, oh, we found a slightly better way to do that stakeholder map. They got a really crappy stakeholder map, and we'll say, "We can come up with something much better than that." And then, when other people find it, then they learn from our examples of a stakeholder map. Audience Member: The data visualizations and the tree maps. Keith: Right. And the tree maps and so on and so forth. Yeah. If there's folks that are interested, we're coming up with really cool new kinds of tree maps. Let's feed it into their system. They've already got the catalog of stuff. Let's add to their catalog and not create our own. That would be a great possible next step for us to do. Audience Member: I did notice that none of the definitions of visual literacy were visually literate. [laughter] Keith: Right? Audience Member: Keith, thank you very much. Keith: Thank you. [applause]