Designing Visualization Tools for Learners - Catherine D'Ignazio and Rahul Bhargava

[Applause] great so so first of all the podium is really tall and I'm quite short so my best to move around a little bit and try to try to appear larger than the podium in real life so we're going to switch themes a little bit but we were kind of in a room full of experts and we want to switch teams themes to think about learning learning is critical to both of us as people that work with populations that are coming into the field of data visualization it's something that we think about really deeply so we're going to introduce some approaches to think about how to help learners enter this field as they're getting started with working with data trying to find stories to tell and actually creating visualizations to tell those stories and hopefully we'll leave you with a few things to think about both as people that use tools as reflective practitioners and people that make visualizations that are intended for novice users all right so a little bit about us my background is in art design education and software development I've always been interested in data and technology for the purposes of creative communication so visualization is like a perfect marriage of those things I've created walking data visualizations about climate change I have created large red sculptural flowers that sense water quality and sit in creeks and I've done media analysis with data visualization I'm a professor at Emerson College and I sit in a journalism department so I spend a lot of time introducing journalism and communication students to new methods for data-driven storytelling and my background is actually in robotics in education so if any of you have used the Lego Mindstorms that's the kind of stuff I used to do so I come to the world of data storytelling and visualization from sort of an educator point of view focused on how to help empower people to do what they want to do in new and exciting ways so that's led me to approach data with the idea that we can bring people into working with it with an arts invitation the arts is sort of the best tool we know of for empowerment and engagement with people so we bring people in with activities like drawing on boards we paint data murals around the world I help kids come up with abstract native and bring craft materials into conferences full of people in suits so it's a pretty fun way to get people excited about something that isn't really a spreadsheet training and most of this approach is documented on my data therapy org website and the reason this has been so appealing to the nonprofits community groups and things like that but that I've been working with for less than we're doing workshops for about ten years now is is this type of stuff this is make no mistake this is something that people are being told is really important there's a reason things like this sell out like we do any sort of workshop that has data in the name and there's a hundred person waiting list not necessarily because we're brilliant that won't be the case we have but actually I think we could probably just have like a snack table that said data on it and I was like it would have a waiting line of a hundred people so this is this is the reason it's because this is so critically important in sort of the public perception of things and that means there's a responsibility there's a responsibility to dig past the hype and I think it's a responsibility the experts are sort of the people creating things in this room actually share and that's the reason that I like to focus on this stuff how do we help newcomers tell the difference between why they should be making something and how they should be making something that's a key difference we try to pick apart in our work so through this talk we're going to try to give you some of the principles than a form that and some of the ways we think about it in in reaction to the tools that we see our users starting to use and learn with alright so wikipedia has this great policy which you can see stated here for newcomers which is please do not bite the newcomers and so I think it's worth asking for data visualization who are the newcomers and how do they get introduced to concepts of data analysis storytelling and visualization and so while there are newcomers from a ton of different fields and non-technical as well as technical fields we primarily work with newcomers from a non-technical background and they're excited about data visualization as a new way to communicate insights and tell stories for civic purposes and include the list of folks here so journalists librarians profit and advocacy organizations artists municipal government folks museums K through 12 educators and so I think worth asking is anyone who identifies with one of these domains as their kind of primary domain raise your hand if you're one of one of those groups okay great okay so I'm glad that we have some of those folks in the room so all of these folks have heard of Big Data experience interactive data visualizations and infographics journalists want to get started with data journalism nonprofits and governments feel pressure to be more data-driven with their decision making librarians see public data as a really amazing new data source for their patrons but the entry point for data analysis and literacy for many of these newcomers is experimenting with visualization tools this is the first way that they come into this is through the tools but the tools that they use don't necessarily do a good job of scaffolding the learning process so that they can take the next step with data okay and so increasingly in our work we're working with partner organizations in these different domains to develop activities toolkits MOOCs other learning experiences for these newcomers to working with data both individually and across their organization so there's a couple projects which I'm mentioning here which we have underway this year but the main reason we're here today and if you don't take anything else away from this talk just look at the slide I always try to give one slide but is like this is the the key thing is it's not really to talk about the formal learning experiences but to make the case that sense tools are the first entry point for newcomers the data visualization tools should be considered informal learning spaces so we can try to scaffold better learning experiences in the tools themselves to introduce concepts of data analysis and design so we're going to talk more about learning but first I want to talk about food we both love food and I do do a lot of cooking and I've been doing some baking recently this is not one of my cakes well this is an amazing cake that I saw online and it made me think for a second I asked you so raise your hand if you're intimidated by the idea of making this amazing three-dimensional Planet cake okay yeah that's it almost everybody raise your hand if you're excited or inspired by it okay good that's actually maybe I'd say a third of the room that's really interesting and it's interesting because visualizations like these beautiful things we've been seeing today often serves the same purpose with other populations that cake serves to us sort of non chefs the idea that these beautiful things can both intimidate and inspire is a key thing to think about and at worst these visualizations that we're making can often scare away these intimidated populations which is certainly not the intent of most people making them at best these visualizations can be a hook that inspires us like those people that raise their hand for the second thing to come into the world and want to make things like that even if we might not have the budget for it all right and so this explosion of interest in visualization has led to an explosion of tools for novices we've actually catalogued like 500 of these tools but many of these tools prioritize the creation of quick flashy graphics and they ignore what is really an opportunity to introduce concepts in terms of data exploration cleaning analysis and storytelling so the tools become black boxes and then additionally just because the tools are proliferating so quickly this leads to a lot of complexity for newcomers as well so how do you choose a tool there are guides to tools like the data visit tools which is a great site we have a guide specifically for very non-technical folks at notorious org but most of these are targeted towards users not towards learners who may not yet have the terminology to describe what they want to do and so while all tool designers talk about the users of their tools today the main case that we want to make is that designing for users is really different than designing for learners so if you design your tool with the idea that people coming into your tool are newcomers both the visualization but also to concepts of working with data just generally speaking how might that change what your tool does and what kinds of things you build into your tool so we're academics so we do things like come up with guidelines and design principles so we're going to use that as a framework for talking you through a couple of concrete examples of ways that we approach this the difference between thinking about tools for learners and settings for learners versus tools and settings for users so just briefly to summarize and then we'll dig into these these principles and they're not really sort of criteria to judge whether a tool is correct or not it's really just sort of axes to reflect on and to think about and then talk about so the idea that a tool for a learner should be focused is really the idea that it should think about focusing on one thing and doing it well helping someone do that one thing the idea that a tool should be guided introduced with activities that make sense and make things fun for the learner they should be inviting in some way that is appealing to new people coming in that might not even exactly know what it's for and they should be expandable they should open up a black box that allows people to offers pads it offers pads to deeper learning once you're past that knowledge stage so we write about this stuff in academic papers this is the latest one it's about these design principles and one of the tools suite we've created called database akio that is our playground for trying these things out with users will show some of that later these papers also share some of the inspirations and where we can't where these things came from and some of those come from people like in its acronym who works in the field of Education in child psychology others come from names like Seymour Papert who worked in construction ISM and the stuff that I studied and sometimes they come from different places including the food network so I want to go back to the food metaphor and think about goodies which is a fantastic show I mean you've seen goodies so yeah so that's about a third of the room great so one use goodies is a thing to react to and it's a TV show that's ran for about 15 years it's kind of quirky focused on not just cooking but helping people understand the why and the how and the science behind it so I want to start with a quick quote video clip from the host of that show Alton Brown and I think this embodies some of what we try to bring to our approach it's like look there's not a why it doesn't go on the show there has to be an absolute reason for everything what we make is not good food we make sense first and then two people at home make good food so that we don't give them the sense part it won't be able to make good food this is that key thing we make Seth not good food right so the idea that these tools for novices should try to leave someone with a good sense of why something is happening when it might be useful that's the key takeaway for us when we think about these informal learning spaces like Katherine was talking about so like we said our playground for trying out these principles has been this platform called database xio it's a free and open source set of four simple tools that's built explicitly for novices and for learning purposes it's used around the world now it comes in a couple different languages by journalists educators nonprofits and other folks so we're going to circle back to this in a minute when we talk about some tools to reflect on some of the design decisions that we made when we were making this as we show you more examples so let's run through these principles again we're thinking about sort of this learning experience of good eats the TV show as a sort of a model to think with so of course we can get inspired by this precisely because it is a learning experience right these TV shows are set up to help you learn about cooking and learn how to cook and be motivated to cook so that plays out really nicely in in goodies you have these each TV show each episode is based on one theme of one ingredient that they use throughout with names like state your claim space speights Capades and curious yet taste the avocado experiments so these are the kinds of things that invites you in with that steam and we're going to ignore in these examples some of the kitchen sink tools the tools to do everything because then our experience those are the ones that people don't actually enter with they enter by like finding some tool that can help them make a visualization not by opening up Excel and then trying to turn that into some company report that's the kind of population that we run into in the workshops that we're doing all the time so the first example of what we mean by focused is in one of our tools we want to talk about a tool called word counter and we want to talk about how it doesn't really present too many options that's one of the ways that we stay focused word counter is a simple tool that introduces the idea of thinking about text as quantitative data and the idea of sketching a story that you can see to then play out how you find a story so sketching is the activity that goes with this and all it does is count words diagrams and trigrams it introduces that vocabulary as well it has four types of inputs and it's just focused on that activity of sketching a story so not too many options here so when you're showing examples it's always worth showing what's you know what I think I'm showing something that's focus it's always worth knowing what is an example of something that is not focused so in this sort of categorization schema we would say that a tool like tableau which is again one of these more like kitchen-sink WYSIWYG tools for making data visualizations that's a school that's not focused it's not to say that it's bad I teach tableau in my classes but this is to say that it's not a focused tool because it doesn't actually support people getting up and running with something meaningful quickly a focus tool helps people do something meaningful quickly so it's very flexible but it's difficult for people to get started you really need to attend a training or something - or watch a lynda.com video in contrast and maybe for one of its kind of similar reason tableau released something called visible which is more of a constrained playground it's a visualization exploration tool on mobile with a kind of much more narrow set of things that one can do a really kind of lovely beautiful pleasurable interface to engage it so that's an example of something that is more focused and then another example of something that an example of what is the definition of focus is a tool that does one thing well so something like timeline j/s very simple does exactly what its name says it makes timelines with JavaScript so it's immediately clear what it does the homepage of the tool walks the first timer through a series of four steps to make an interactive timeline from a spread and well these kind of things are I mean I feel like they're really beneath the level of most of the people here I think it's worth reflecting back to the kind of value of simplicity and thinking about how we can value simplicity in a tool making something that is focused is hard as school designers ourselves we're really familiar with a desire to add features to things we hate taking out features that we've developed we hate we often postpone editorial decisions like oh we'll just let like make it an option and the user can decide you know and so you know thinking about remembering each time that you delay those editorial decisions or you forego taking something out you're upping that level of complexity so in a sense what our tool should aspire to at some levels are the kind of simplicity okay so that's three principles to think about for focus tools next we want to talk about guided tools and introduce three principles to think about tools that introduce activities to get the learner involved and engaged and I'll do that with another short video quarters and they fell apart the rest of the way into the processor one carrot just peeled and snapped into pieces and to tell you the truth if you watch the carrots you can skip the peeling part three cloves of garlic no paper please and about half of a red pepper just torn into chunks step again natural and easy in a cooking show because they're set up as these guided walkthrough of recipes quite often now as a quote here that I think that it's super important to remember it's from when I mentor Zenith Akron endures passed away recently and she said in a playful environment you feel safe enough to explore ideas that would otherwise be risky so in a playful environment you feel safe to take risks that you otherwise wouldn't take I think that's critical in these kinds of learning environments and you can see Alton Brown doing that here setting up this natural joking with the camera and talking about the shortcut around something or the easy way around it that's a key principle under this sort of guided approach that we want to talk about so what does that mean in practice you pick it apart what idea is graphs comments and they do a wonderful job of having these examples on their homepage which suggest to you the kind of power that their tool can bring and then with the main invitation to drop into things you end up with an empty canvas with an invitation to add a note and there's this gap here that we see in our users when they end up with these empty canvases they're not sure where to go next and we end up with this with this idea that you know for guided tools that are trying to help that person that doesn't know what's coming next or how they can take advantage of that power you got to fill in those blanks and so that's one of the principles that we walk away with under being a guided tool so including sample data in the tool itself is a convention that a lot of developers and designers are starting to use that makes tools more guided and which is something I think we should really congratulate folks for because what this means is that learners can quickly try out running the tool with data that works rather than you know spending a bunch of time formatting their own data only to find that it doesn't actually work in the tool so this is a tool called chart builder which was built in-house at quartz which is a journalism outlet it's sort of like halfway there to guide it so they have sample data they have a relatively simple process outlined on their home screen for how long goes about setting up a chart tweaking some options and the issue here and the reason it's only sort of guided is the topic of the sample data so if you look at what they're actually showing for sample data it's comparing juice and travel so it may be kind of funny dummy data for people who like our seasons with this stuff but it totally makes no sense right it's unclear like what what are the units how are we actually relating those things why are we comparing juice and travel whose juice consumption what who is traveling and where they going I suppose remember that when newcomers come into something the mindset is they enter intimidated and so they're unsure about their ability to work with data and so anything that they find like a little bit confusing they're going to assume that it's their fault so they're going to blame themselves for not understanding the juice Travel chart here and so another way that we can think about guided is that guided tools provide clear contextual documentation in addition maybe to some sample data to start new learners off so a really nice example of this is data wrapper this is a chart making tool that use very frequently by journalists it has its process so it also has sample data which you can see there on the drop-down menu and it has the process outlined at the top of the page that names the four steps of using this tool upload data check and describe visualize and public publish so this is simple linear outline it helps give a shape and name to a process that learners may not have gone through enough times to actually have names yet for they might not be able to kind of reflect on their own process enough yet to actually name those pages so it's actually kind of naming a process for them it communicates that the creation of the visualization is simple its finite its achievable and the language is geared towards newcomers it's saying it all starts with your data if you just want to try data wrapper here a couple sample data starts to get started with so again it's sort of geared towards that first-timer who's coming to their homepage okay so that's a little bit about what we mean by guide is let's go to the next one tools that are inviting so let me give an example video here temperature is a big factor in fermentation we don't want to let this get higher than that say 75 degrees so again Brown is narrating to the camera here he's having a conversation with the audience very natural and easy to do in a cooking show setting they're also using the compartment shop a classical way to have someone feel like they're actually in the setting that the video is being filmed in you often see it like inside of an oven in a movie or something like that it sets up a strong self of being a sense of being in the space with the person and the aesthetics really matter so this idea that they're doing this is actually a guideline that we take away but the way you introduce these tools and the visuals and in this case the angles that you're doing it with are super important and critical to have a user feel invited in to try the tool out so the first example I want to give is is I is one of the ones from these kitchen sink tools in Excel one of our favorite tools to go back to of the the pivot table of who's ever had a table who so Jim I can the problem with pivot tables is that nobody knows what the hell a pivot table is he who named it right so so when you dig into the history you find out that like it was a computer a software engineer that named this thing pivot table what the hell does that mean I go into a room and I show someone what a pivot table does and they're like holy crap oh my god you would have saved me two days last week if I had known what that button meant if nobody knows what this means these things are critical and I'm not going to get into the UI of how you invite someone in but like the terms and the words and the language that we use matter when we go into workshops and run them we're often talking about telling stories with information because if you roll into a room and talk about making data visualizations half the people walk away because they don't they say they don't have the budget and they don't have the expertise and they don't have valid enough data to do it so you haven't even you've lost your time to make an argument about this stuff so these kinds of words really matter and they matter in the tools that people are running into first of all or might be on our desks already so what is inviting mean an inviting tool might present itself with a sense of humor we might consider inviting to be visual design it might be somewhat playful so for example in our tool and data basic called wut WTF CSV we invented this to solve a real world problem but people in our face we're encountering so journalists nonprofits artists are increasingly making use of data that they're downloading from the web but that typically comes in CSV form so first of all they don't tend to know what a CSV even means and then they when they do get a CSV they're like what do I do with this like I have a spreadsheet now like what what's the next step from here and so if you're you all are probably all are people and so you know with our you can run the summary command and you kind of quickly get a sense of what is the scope of your data what are the different columns how are their variables laid out and so on but if you're a new learner WTF do you do with the spreadsheet and so the other thing here is with WTF CSC new learners often don't understand that visualization can be used to explore data so in the exploration stage not just at the end in the presentation stage of the process so WTF CSC characterizes your spreadsheet is very similar to our summary command but just in visual form it starts to show you a picture of what is going on with your CSV so it helps support the initial data exploration process but it has an irreverent name to communicate that the process of discovery can be fun it can be okay to not know what is going on with your CSV file has bright colors and then we also turning a sample data that's fun and culturally localized so in the US for folks using the English version they get a sample data from UFO sightings which is funding this and then for for example for Portuguese speakers we have sample data about Brazilian soccer results and Portuguese baby news okay and so a final way that tool can be inviting is by demonstrating their ability to be used in professional context that relate to the backgrounds and context of your newcomers so for instance Knight labs story map tool has examples link from the homepage that show their maps in actions they show published maps in action for publish for professional journalistic outlets so this helps communicate two things to the learners first it gives the tool credibility so it's robust enough to be used in the field by professionals and then secondly it shows high quality examples for what kinds of of outputs you can expect from this tool because as we're describing previously there's so much complexity in the tools base for new folks coming in a lot of times newcomers are simply trying to answer the question what is this tool good for ok we'll go through quickly to the last one if they're not on they can both get messed up the same way if the the vessel their cook dan is dirty if the the mixture itself is impure if it's agitated at the wrong time little baby crystals can be formed in the mixture and as they cook these little crystals can grow into bigger and bigger crystals eventually your nice clear glass starts looking more like a shower door and your brittle starts looking more like a praline so he's comparing to creating peanut brittle to the manufacturing process for glass this one especially at home for me because my wife does stained glass so I know a lot about about both of those processes the idea here is that Alton Brown like us and our tools doesn't shy away from the scientific technical language but doesn't start with it it's not that we can't tell and introduce a complicated topic it's that we want to do it in a way that makes sense we want to do it in a way that's helpful and we want to do it in a way that helps someone that as a novice get started in a language and they make sense to them and then holds their hand as they go into a language that is a deeper and not so need to know if they actually want to dig into something so the first example a quick one around raw what they do is they generate some of the more complex visualizations with the three that you can't do in tools like Excel without coding they have sample data it's wonderful my key thing is at the bottom there downloads the idea that you can get this out an embeddable form but also grab the SVG to then take that into to illustrator with your graphics department and actually tweak it and modify it as you need so they give you not just the quick and easy way to use it they also give you the way that lets you use it inside of your existing chain for processing images and graphics and tweak it in as you need to okay so whether you love or hate infographics they are often the first step that a non-technical newcomer takes towards making data visualization so we found that folks in nonprofit organizations libraries and education in particular loved infographics they're often using tools like piktochart info graham Venn gauge to create visual stories with icons and illustrations so the challenge with infographic tools as informal learning spaces for data is that they don't introduce any terminology or any process around working with data and they often don't help the learner then graduate to the next step to the more complex tools so if we're talking about how alert how its will can be expandable it's expandable if it can put itself in a pipeline of analysis help you understand concepts and process and then put you on a path towards being a creator of more complex and customizable outputs so related to the idea of putting yourself in a pipeline of analysis one way to do this in a tool space is to introduce vocabulary in the tool that will help learners take the next step with other more complex tools sort of like what we were just talking about here with like not hiding the technical language or using cute language to obscure them I mean I think that's the frustration I always have with user interfaces like I know the term but now they've hidden it from me and they've made up a cute new term and so explaining technical terms insist you and so we try to do this in data basic by where we put a little quotation a little question mark next to any technical term so this is our an example from connect-the-dots which introduces basic principles of network analysis so if we use terms like nodes or edges or centrality we you can hover over those and get a very short definition and non-technical language of what that means and then learners ideally once they understand those terms they have those terms sort of under their belt with this very simple tool they can then graduate some more complex network analysis tools like graph Commons or like Jeffie or like the like the tools that john was talking about and have developed some familiarity which is a base that they can take to the next level and we're weak there just to be self-critical we're weak there we're not pointing at those tools right so we're missing I don't want to hold up our example is like we've done all of this and you should just do what we did not at all just again as we talked about it that's our playground for trying the stuff out so there's lots of gaps that we're still finding in discovering that as people in ministry we're trying to fill but if you take a step back from that those four skills again the idea that you can be focused around one activity you can guide the user through you can be inviting in a way that relates to where they are and meets them way they are and you can be expandable some way that sort of a chain of working with a tool to learn something and helps them learn how to graduate from that novice use to this to the greater use so I Omega Tunis about coffee so in fact I think we argue that designing for learners is in fact more important than designing for learners so please for sorry learners designing for learners is in fact more important than designing for users so there's two reasons for this the first is a simple issue of quantities so because of exploding interest that's happening across fields and domains there are far more newcomers to doing data visualization than there are people doing visualization professionally so probably also all of us who do this work professionally consider ourselves newcomers to various spaces whether you are newcomer to d3 or you're a newcomer to map making or to using remote sensing imagery in your work so maybe keep in mind the new things that you're trying to do or the new communities that you're trying to break into that still intimidate you and then you'll understand some of this mindset that newcomers are bringing today to visualization as a second leave end well often the first question that people ask about a visualization is how did you make that designing for learners helps us all become more critically engaged with visualization and shift ourselves and our users towards the question why did you make that so this is a much more interesting question it's a better question to cultivate in newcomers when is visualization an appropriate mode of communication what can visualization help do that really can't be done by words and illustrations we think that learners like ourselves and you all who are a little bit further down the pathway have a responsibility to newcomers to help them ask better questions form better concepts and derive better insight from data and not just or maybe in addition to making beautiful wonderful pictures so I think so hopefully you can all walk away with the idea of how someone might approach the beautiful vase relations that you're making like that giant cake and we can help people walk away more inspired like we are by those innovations instead of being intimidated by Thanks [Applause] [Music]