Designing With Data
Upcoming SlideShare
Loading in...5

Designing With Data



This is a lecture I gave to undergraduates and Masters students at the Communication Design School at Texas State University. Thank you to Jill Fantauzza for the invitation!

This is a lecture I gave to undergraduates and Masters students at the Communication Design School at Texas State University. Thank you to Jill Fantauzza for the invitation!



Total Views
Views on SlideShare
Embed Views



23 Embeds 6,611 6254 184 43 24 20 15 13 12 11 10 5 4 3 3 2 1 1 1 1 1 1 1 1



Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

Designing With Data Designing With Data Document Transcript

  • Hi. Friday, October 11, 13 Students file in to the room....
  • Designing With Data George Oates, Art Director, Stamen Design Texas State University School of Art and Design, October 8, 2013 Friday, October 11, 13 Hi. Welcome. Thanks for coming to hear me talk this evening, and thanks very much to Jill Fantauzza for inviting me. I’m coming to you from San Francisco, and a small design company called Stamen. Jill’s asked me to talk to you tonight about Designing with Data, so here goes.
  • Who’s George? Stamen Design With Great Power... This evening... Friday, October 11, 13 I’m going to break the talk up into 3 main chunks. Tell you a bit about my career trajectory so far, introduce you to Stamen and how we approach data-driven design, then finish with some thoughts and examples of how designers can exert editorial control, and what that means these days when people can also access source data.
  • Who’s George? Stamen Design With Great Power... Friday, October 11, 13 So... George...
  • Friday, October 11, 13 1996 self-taught 2 companies turned 30 left Australia
  • Friday, October 11, 13 interned at ludicorp -> designer of flickr moved to sf
  • Friday, October 11, 13 Keep copies, archive everything. I’m SUPER BUMMED that I didn’t do that properly with Flickr. This is the homepage 2 months after launch.
  • Friday, October 11, 13 worked at yahoo got fired director, open library @ internet archive now, art director at stamen design
  • Friday, October 11, 13 May 2005. I liked finding quotes that had good photo words in them.
  • Friday, October 11, 13 2006
  • Friday, October 11, 13 2007
  • Flickr Commons Friday, October 11, 13 In mid-2007, an email from the Library of Congress trickled into my inbox. They were looking for a “web 2.0” partner, and had decided on Flickr for photography. But, they couldn’t use any of our licensing options (all rights reserved + CC). I worked with Yahoo! legal to introduce a new way of sharing on Flickr, called “no known restrictions”. Suspecting that other institutions around the world might be able to use that too, I created The Commons on Flickr. Now there are millions of photos, and almost 100 institutions participating! Oh, then I got fired.
  • Friday, October 11, 13 Picked up by the Internet Archive, and Brewster Kahle. He gave me the Open Library project and let me run with it.
  • Friday, October 11, 13 Here’s the redesign I did in about 9 months.
  • Friday, October 11, 13 Here’s the open source Book Reader I redesigned, in collaboration with Michael Ang.
  • Friday, October 11, 13 In the bowels of the Smithsonian Libraries, after I was awarded a Research Associate position. I LOVE the bowels of the Smithsonian, and wish I could teleport there any time I wanted to.
  • Friday, October 11, 13 “Magpies are jacks of all trades: scavengers, predators and cheeky thieves.” Michael Bierut, partner at Pentagram 79 Short Essays on Design - The Design Observer blog Designers Secret - we get to work in all sorts of places, all sorts of industries, with all sorts of people, all sorts of problems ANOTHER SLIDE, MORE TO SAY.
  • Friday, October 11, 13 One of my favourite parts of any work I do is understanding the problem. I don’t think of myself as a particularly creative person, you know, like the kind of person who just makes art all the time because they’re compelled to. But, give me a problem, and I can solve that all day. Stamen is contacted by all shapes and all sizes, from the artist who wants to use one of our maps in his work, to the giant telco who wants us to explore a gigantic dataset and make something cool. Photo by Dave Harp
  • StamenFriday, October 11, 13 Created in 2001 by Eric Rodenbeck. Design & Technology studio. Here’s a quick tour of a few projects, much more to read on
  • Friday, October 11, 13 Crime Maps - one of the first of its kind. Data borrowed surreptitiously from the Oakland Police Department, and placed into a user interface. Now the police are publishing their data openly.
  • Friday, October 11, 13 Building Maps; map=yes. This is all the buildings in London. Online cartographic exploration... the beginning of Stamen’s journey into maps that aren’t just for driving directions.
  • Friday, October 11, 13 Time Maps;
  • Friday, October 11, 13 Space Maps - that’s a WebGL 3D map of the surface of Mars.
  • Friday, October 11, 13 Watercolor maps - But, this presentation isn’t really about finished, polished work. It’s going to take a look at some of the techniques we use to *start* working with data. You can see a bunch of finished work, and much more info on our website,
  • Friday, October 11, 13 This is 10/12ths of us.
  • Engineer Engineer Design AdminAdmin Admin CEO 6 5 Director DirectorDirector Director 3 5 12 EngineerEngineer DesignDesign Friday, October 11, 13 The numbers don’t quite add up here - some people aren’t in the photo. Small group, many hats, generalists, specialists, etc.
  • Client Work Research / Development Art Friday, October 11, 13 We do client work so we can have time to do R&D and experiment. The perfect client is one who wants us to do all three.
  • Independent Company Small Recombinant Teams Ambitious, Pay-it-forward Friday, October 11, 13 Being independent means we can work on what we want; what interests us. It’s important to us to contribute to the various communities we belong to as well, by creating and sharing tools to benefits others. When we share tools, we can all move forward a little more together, advancing the field.
  • Friday, October 11, 13 We were thrilled to see a watercolor billboard go up in our neighborhood, and then be graffitied within a couple of days.
  • Designing With Data Friday, October 11, 13 OK. Now I’d like to take you through a few projects I’ve been a part of, looking through the lens of designing with data.
  • Everyone’s in the data business. And there’s no such thing as clean data. Friday, October 11, 13 Anyone who has a presence online of any scale is in the data business. Anyone who has logins, or transactions, or inventory, or measures attention, or collects content... all of them.
  • Everyone’s in the data business. And datasets are always a bit messy. Friday, October 11, 13 Anyone who tells you their data is pristine is a liar!
  • “Our Process” Friday, October 11, 13 Why N Sync? Because it’s a slide about recent history. Before the turn of the 21st century, most of the web shops around the world were thinking long and hard about communicating their process, and making it one of their products. Many flow charts were drawn, many thesauruses consulted, many variants of the same basic thing created.
  • Friday, October 11, 13 We keep track of ourselves, and visualize our project history. These are “maps” of our project work. It’s difficult to find patterns in our own work, in our own process. Each color represents a Stamen person, so you can get a feel for how we’re all involved...
  • I’m dark purple. Friday, October 11, 13 This is me. Pretty irregular timing.
  • Friday, October 11, 13 Most of the processes people talked about in the late 90s were straightforward... sometimes people call this “waterfall”.
  • Friday, October 11, 13 Sometimes it feels like our exploration is more like this... moving forward, but not sure where we’ll end up. It would be nice if clients paid us to do this. But, turns out that’s hard to charge for.
  • Friday, October 11, 13 Our goal is a blend of those... something exploratory and expressive, which turns into production at a good point.
  • Discovery Expression Design Production Friday, October 11, 13 Basically, discovery, expression (probably most important), design and production.
  • So. How do we start? Friday, October 11, 13 So... how do we start?
  • Work out what you’re dealing with. Draw everything. How does it change over time? Is place important? Make it move. Friday, October 11, 13 Our basic exploration practice.
  • Work out what you’re dealing with. Friday, October 11, 13 People create data in all kinds of ways, and describe in even more. Talk to the people who created the data you’re going to be working with. Ask them how they made it, and what they want to do with it. Schemas, dictionaries, any kind of representations they have - all of this is good stuff to get your hands on. Look for things you know how to handle.
  • We call this spelunking. CC-BY by highlander411 Friday, October 11, 13 And actually, spelunking is a useful analogy, I think. It’s cold, wet and dark in some datasets... without lighting and guidance, you can get LOST AND DIE. Lighting and guidance can take the form of conversation and schemas, dictionaries, common frameworks, “universal” things like date/time or latitude and longitude...
  • Draw everything. Friday, October 11, 13 As soon as you can, start making images. A friend, Tom Armitage, just gave a great talk about “software as material” in Norway. He had a lovely phrase I liked, “a graph a day,” which he used to encourage software people to make images of what they’re working with, so other people can start to understand and interpret the work. This is central to our work at Stamen.
  • Friday, October 11, 13 This is us plotting every column in a dataset against every other column to look for gaps, blobs, clusters or any other highlights.
  • Friday, October 11, 13 Another technique is to use color in a table to indicate volume. A very quick way to glance at frequency or activity. Who says which day of the week on what day of the week? Lots of people think about Fridays. Lots of people talk about the weekend.
  • How does time help you? What does place tell you? Friday, October 11, 13 Start with 2 simple questions.
  • Friday, October 11, 13 Start rough. Cobbled together CSV + D3. Get interactive as soon as you can. This quick sketch shows how associations change over time. This is 2012...
  • Friday, October 11, 13 To 2006.
  • Friday, October 11, 13 Another project for Facebook... looking at who’s talking about what around the world... again, just drawing everything here, normalized against time of day, so we can see it all at once.
  • Friday, October 11, 13
  • Friday, October 11, 13 At first we wondered if odd spikes in odd places might be data center locations... Anyone know where that is?
  • Lagos Friday, October 11, 13 Lagos is the second fastest growing city in Africa and the seventh fastest growing city in the world. I did not know that before working on this project.
  • Friday, October 11, 13 Facebook music project. 90 days worth of listening data via various music services like spotify.
  • Thrift Shop Friday, October 11, 13 Yes, that the massive Thrift Shop. Far and away above any other track. Sometimes it helps to see detail if you snip off the top outliers, or focus your gaze a little lower than the top.
  • Umm... Friday, October 11, 13 Interesting how these sorts of expressions often reveal gaps or oddities to the clients themselves too.
  • Bit of art direction Friday, October 11, 13
  • Same data, different expression Friday, October 11, 13
  • Same data, different expression Friday, October 11, 13
  • Same data, different expression Friday, October 11, 13
  • Same data, different expression3D + Color work Friday, October 11, 13
  • Final piece Friday, October 11, 13
  • Make it move. Friday, October 11, 13 This slide plays a video which you can also watch here:
  • Too much data? Friday, October 11, 13 I didn’t make this background, by the way. It’s the top image search result for “data” :)
  • Friday, October 11, 13 This is work hot off the press, literally put out this morning. Alan McConchie is Stamen’s resident cartographer, and also happens to be doing his PhD on the community of editors on OpenStreetMap. For any of you who don’t know, OSM is like Wikipedia because anyone can edit it, but it’s a map of the world.
  • “Show us what we’ve got” Friday, October 11, 13 It used to be that people didn’t really know what was hidden away in their dusty datasets, and they’d come to Stamen to find out. Our work would reveal new connections or anomalies that had never been seen before. Those days are slowly passing now... clients are much more sophisticated now, and often have data scientists or analysts on staff. We try to find those people and collaborate directly.
  • Tell Stamen what you’ve got. Friday, October 11, 13 It’s invaluable to work with experts, in any type of design. This is Dr. Robert Orth, who proved crucial in our Chesapeake Bay project. His 40 years of study of the bay was central to the design we created to help explain his study. Our approach used to be make a UI to let people see everything, to explore everything themselves, without guidance particularly. But, now we’re in the time of data abundance, and glut. There’s a definite trend towards “guided tours” of big data, or curated, narrated events.
  • Friday, October 11, 13 This is one of my favourites, Snow Fall, which began its life as a traditional long form article written by John Branch. There was an avalanche in the Cascades in Washington, and 16 skiers were trapped in February 2012. The team at the Times grabbed it and turned it into something stunning... bringing in multimedia when it was timely (literally as the viewer got to acertain point in the story, a video would play, or a map would animate.) Truly best of breed work.
  • Friday, October 11, 13 There’s a great interview with the team who created the piece here - worth looking up for some interesting behind-the-scenes insights.
  • Who’s George? Stamen Design With Great Power... Friday, October 11, 13 The final section of this lecture is about the increasing need for Interpretation, Subjectivity and Narrative on big datasets. While it’s certainly still useful and often interesting to splay the whole thing out -- and actually that’s often a great way to see things and gain insight -- “design is art with consequences” - I’m attributing that to Peter Girardi, but am not certain that’s right. (Damn internet.)
  • Friday, October 11, 13 New movie coming out about René Saavedra, an ad man in Chile who worked on voting NO to Pinochet getting in for another 8 years. Positive editorial power.
  • Friday, October 11, 13 Last year, Stamen was commissioned to make a piece for the Zero1 Biennial in San Jose.
  • Friday, October 11, 13 We decided to create a project in response to the highly visible, remarkably private SF to silicon valley bus services. Mike, Eric and I sat on the corner of 18th and Dolores one morning to observe the passing shuttles.
  • Friday, October 11, 13 We used the commission fee to pay bike couriers and “freelance” Stamen relatives to observe these corporate buses at scale... and eventually, we were able to map out all the stops, and the schedule for 6 Silicon Valley companies.
  • Friday, October 11, 13 This is Zach and Shawn working on how to represent everything... now that we had the data, how could we draw it?
  • Friday, October 11, 13 These are the sketches that ended up becoming the final piece, give or take. You can see on the right there that we wanted to incorporate shuttle volumes into our map.
  • Friday, October 11, 13 In the finished piece, you can see that Google sends far and away more workers from the city to the valley. (Incidentally, that ended up being the name for our piece.)
  • Friday, October 11, 13 This generated a lot of press... and it wasn’t like the piece itself had a particular point of view, but made something previously invisible visible. Everyone had noticed those hulking private buses on the small neighborhood streets... this diagram became a device which helped conversation and criticism. The work resulted in a single image, a representation of our understanding of the private transport network. It was interesting to be in the position of data creator, data aggregator. The tricky part was, some of the data we used was “privileged” and private, so we weren’t able to freely share all the data for public consumption.
  • CC-BY-NC by {Guerrilla Futures | Jason Tester} Friday, October 11, 13 A lot of the city is not happy about the current wave of young wealth tech nerds spoiling it for everyone... :)
  • Friday, October 11, 13 Strong piece called “Out of Sight, Out of Mind” by Pitch Interactive in San Francisco, came out about 6 months ago. A visual representation of US drone strikes in Pakistan. Anyone see it?
  • Friday, October 11, 13 The piece grows over time, and places each death into a category: child, civilian, other, high profile. There is a feed of drone-related news underneath.
  • Friday, October 11, 13 It’s visually really strong and clear.
  • Friday, October 11, 13 Well-built. Informative. Revelatory of a hard, politically charged topic. I admire their guts to put it out.
  • Friday, October 11, 13 But, their approach attracted intelligent criticism. Along the lines of... “This is a great unintentional example of how data can be seriously distorted even if technically true.” “Data is terribly presented and clearly biased.”
  • Friday, October 11, 13
  • “I'm of the opinion that more information is usually a good thing, so it would be nice to see a full spreadsheet of the data and the methodology Pitch Interactive used. In both drone warfare and data reporting, a lack of transparency runs the risk of misleading the people supposedly being served by it.” Emma Roller, Slate Friday, October 11, 13 It would be ideal if everyone could always share their project data openly and freely, but we’re not there yet. I admire the Pitch guys for taking on some really hot political topics in their work. A lot of what we’re doing now is helping people with publicity, and that includes working on projects we feel deserve attention. This is also one of the nuttiest issues with the work that we do, I think. There’s a real challenge to represent finely crafted data and research in a way that does the work justice, and represents it in all its complexity. There’s a point you can reach in this kind of work where it’s been so simplified its meaning is dulled. Infographics (static, highly edited) pieces often suffer from this. So, a good goal seems to be to aim for exposing all the data in an interactive, searchable interface, and then layering expertise and highlights over the top, to help people see important parts easily.
  • Pay it forward Friday, October 11, 13 OK, so... winding up... I mentioned in my intro that Stamen is a group which works consciously to pay it forward; to create tools in the midst of client work, and to talk about the work, and share them. Not just tools either, actually, but techniques too.
  • Friday, October 11, 13 We’ve been consciously working on describing our work more clearly, and rigorously. We try to always create open source tools in the course of our work. If you’re trying to find work, talking about your current practice is a great way to do that. As Eric (Stamen CEO) sometimes says, do the type of work you want and put it out into the world. Incidentally, I was looking for a picture of a hard-to-open package, to act as a visual cue for a tool or technique that gets poorly described. I unlocked a new phrase for my lexicon: “wrap rage” and there are tons of funny videos about that on YouTube, for when you’re having a bad day.
  • Friday, October 11, 13 We take the time to write a “here’s how we did it” style blog post at the end of many of our projects... that’s actually become something of a product for the studio, too, and clients are beginning to ask us to do it for their projects, and are willing to pay for it. That’s interesting to me.
  • free CC-licensed map tiles Friday, October 11, 13 We developed 3 cartographic styles, which we made available to the world under the Creative Commons Attribution license, and we’ve watched them proliferate across the web, which is SUPER EXCITING. I was reporting on examples around the place at for a while... there’s more info there if you’re interested.
  • Friday, October 11, 13 We have 14 public repos available on Github, and are looking to add more. Most of them are map-related, including a couple of products too, Maptcha and Field Papers. Clients are beginning to ask us to produce public code too, which is also an emerging, interesting trend.
  • Friday, October 11, 13 Here’s one great example of a Stamen map out there in the wild, made with the help of CC-licensed Toner Lines/ Labels. It’s the Racial Dot Map; one dot per person across the USA. The map was created by Dustin Cable, a demographic researcher at the University of Virginia's Weldon Cooper Center for Public Service.
  • “Getting lost in validations and surprises.” Friday, October 11, 13 I stumbled upon this comment about the Racial Dot Map from Aaron Koblin, and I think it largely describes the work of data visualization.
  • Friday, October 11, 13 Speaking of surprises, this elephant popped out some forestry research in Gabon, in Central Africa. A scientist called Simon Lewis is using LIDAR to scan forests in a non-destructive way. This is the paper about the work: “Mapping tropical forest biomass with radar and spaceborne LiDAR in Lopé National Park, Gabon: overcoming problems of high biomass and persistent cloud”
  • Friday, October 11, 13 This sort of surprise is the holy grail of work like this. But, with clever capture, cleaning up, drawing, iteration and editing, you might spot an elephant too.
  • Thank You! @stamenglo Friday, October 11, 13