Bummer! This is just a preview. You need to be signed in with a Pro account to view the entire video.
Designing for Archives29:33 with Allen Tan
Most of us spend a good deal of our time online interacting with web services like Flickr, Dribbble and blog sites, but we rarely revisit our old material – and, if we discover a new service or brand online for the first time, it's often difficult to access and explore past output. As designers, what can we do to reshape these services online, to make looking at old content interesting, exciting, and serendipitous? How can we instill a sense of depth and history to our work and in the projects of the future?
So I, I feel like over the past day we've sort 0:02 of heard a lot about design and technology, and we have really 0:04 good speakers, and really wonderful people at this conference, but I wanna, 0:08 I wanna step back just a little bit, and talk about content. 0:13 And, I know this is a design in technology 0:18 conference, but I wanna talk about how content, especially 0:21 in the form of archives, how designers and technologists 0:25 can start to address the problems that I see. 0:29 And just to set this up, when I think of archives, I 0:33 think of when you come to a blog and you wanna find 0:35 all the old posts that people have made on that blog, you, 0:39 there's a couple of patterns that I think we've all fallen into. 0:43 There's the previous and next, and your 0:46 constantly paging back and you're, it takes a 0:48 really long time to go, go through the 0:51 entire set of arch, of archived blog posts. 0:53 If you look at either your Flickr favorites or 0:57 your chip Triple favorites, there's sort of like a 1:00 grid of, of images, and it's all reverse chron, 1:03 and it's also kind of hard to, to dig through. 1:05 And then there's stuff like, there's stuff like the Twitter archive, which looks like 1:10 Twitter, and there's, there's no real reward 1:15 I think for going, going through your tweets. 1:19 It's really you know, I think we need things 1:22 like data visualization to start making sense of this information. 1:25 And so I wanna start a little bit abstract and 1:29 sort of talk about why we need to be doing this. 1:33 And then I'll include some practical examples, sprinkled throughout 1:36 my talk just to ground this a little bit more. 1:40 Okay, so let's start. 1:43 [BLANK_AUDIO] 1:44 hi!, 1:46 I'm Allen. 1:47 And despite the title of this talk, I'm not a trained historian. 1:48 I'm not a trained archivist. 1:53 Like you, I make things for the web. 1:56 And these days I work at the New York Times, and the first 1:59 month I started working there, I went on a tour of the morgue. 2:03 This is the New York Times morgue, where there are clippings and 2:06 photographs of everything that the, the, that the Times has ever published. 2:09 And I found this. 2:15 This was a front page of the paper on 2:17 the morning of the sinking of the unsinkable Titanic. 2:21 [BLANK_AUDIO] 2:25 And, here's the rest of, the archives. 2:28 You know, you can see some photographs, and on the back there's some notes. 2:31 And there's some crossing outs, and there's a stamp on 2:37 the bottom that tells you when, when this photograph was published. 2:41 And this is what the morgue looks like. 2:46 Right? 2:50 This is what's in the file cabinets. 2:51 And they're all sorted by topic, and time. 2:52 And the man who takes care of this place, his name is, is Jeff Roth. 2:57 He told me that the morgue used to live in the same building as all the reporters. 3:01 It was very important for reporters doing their research. 3:07 If they were writing a piece about a politician running 3:10 for office, or someone famous just died, and they're, like, crap. 3:12 We don't need, we don't have an obituary ready. 3:17 We need to like, get everything we have ever written about that 3:19 person, and, and somehow pull it together into an article in 2 hours. 3:22 And the morgue would send them a file folder of 3:26 all the clippings and photographs that the Times had ever written. 3:29 And give it to them. 3:33 And when they're done with that article, they 3:34 would send the clips back to the morgue. 3:35 So this was a very important part of their research. 3:36 [BLANK_AUDIO] 3:39 Now, many newspapers and magazines, they, they kept 3:41 similar archives but most of them had been 3:44 dismantled and cleaned out and thrown out because 3:48 they take so much space and money to maintain. 3:51 This morgue is one of the few that still remain open today. 3:56 The morgue lives in a separate building now, down 4:01 the street from where I go to work every day. 4:04 [BLANK_AUDIO] 4:06 But to be honest, I, I don't know how much this morgue gets used today. 4:08 [BLANK_AUDIO] 4:11 So design for archives. 4:14 What do we think of when we say the word archives? 4:16 Do we think of something like the morgue, or do we think of 4:18 some deep under ground vault with dusty shelves and even 4:23 dustier manuscripts or maybe we even think of something like this? 4:27 Right? 4:33 The Egyptian pharaohs locked away in their tombs. 4:34 [BLANK_AUDIO] 4:36 All these places have been forgotten. 4:38 And they've been forgotten either because they fell out 4:42 of people's everyday lives, they no longer matter to 4:45 them, or because the people to which these things 4:47 did hold meaning for are dead and long gone. 4:51 Now the internet was designed to be redundant and resilient. 4:57 [BLANK_AUDIO] 5:01 Sure we still sometimes lose data, when geoshities when geocities shut 5:02 down or the recent .net magazine migration we lost all these articles. 5:08 That happens, but those are intentional losses, and, when 5:14 things happen to the unsinkable, that tends to make headlines. 5:19 And people pay enough attention to try and stop it. 5:23 [BLANK_AUDIO] 5:25 But what happens far more often to the pass is unintentional. 5:28 And so, it's much more difficult to guard against. 5:33 So, let me ask you this. 5:37 How many of you remember the last thing that you did on Instagram? 5:40 How many of you, without checking your phone, even 5:45 remember the last photo that you posted on Instagram? 5:48 When you go down your feed, it lets you teleport 5:52 instantly, right, to California, to Greece, to Vietnam, South Africa. 5:55 You're seeing 5 different countries all in a single moment in time. 6:01 And we, we're really good at this. 6:06 We're able to compress so much space into a single moment in time. 6:07 But we're not quite as good as doing the opposite, of showing one's, one moment in 6:12 time and seeing what, what you've done and 6:16 what you've done in the past, and you know. 6:18 To go farther and farther back. 6:21 [BLANK_AUDIO] 6:23 And so what happens far more often to the past is, we simply forget. 6:26 [BLANK_AUDIO] 6:32 It slips our mind so easily because for us, these are just things that happen. 6:34 Something that we did and, it doesn't hold any meaning for us yet. 6:40 Any weight. 6:43 [BLANK_AUDIO] 6:44 And so, when these things slip from not just our 6:47 short term memory, but our long term memory, this information 6:49 becomes effectively lost, even though it stays on the servers 6:53 of Instagram, or other web services, we can't access it. 6:55 We don't have access to this in our minds. 7:00 [BLANK_AUDIO] 7:02 And so in other words, I think the question when 7:04 you're designing for archives, is you're de, designing for amnesia. 7:07 [BLANK_AUDIO] 7:11 How do you design a time machine? 7:14 [BLANK_AUDIO] 7:16 Now, how does short term memory work right now on the web? 7:20 Usually when you go to a users 7:25 profile page there's a section called Recent Activity. 7:27 And there are all these little discreet items of 7:31 updates that you've all these actions that you've been doing. 7:34 But, I don't think anyone ever really pays much attention to it. 7:39 I, I know I don't, but I don't find that very surprising 7:42 it would be a little bit like if we were you know, 7:46 having a conversation and you asked me what I did yesterday and 7:50 I said something like, well, first at 8 o'clock, I woke up. 7:53 And then at 8:15, I brushed my teeth and then took a shower. 7:59 And then at 8:30, I went and walked the dog. 8:05 And then at 8:45 I threw a dog, or I threw 8:07 a stick at the do, at the dog and it ran away. 8:11 [BLANK_AUDIO] 8:15 I mean, after that conversation, I would not blame you if 8:19 you never again ask me how my day was, [LAUGH] right? 8:22 That is a terrible way to have a conversation. 8:24 But the reason why these activity update are so short on the web, is 8:28 that we've gotten really really good at 8:31 itemizing the posting and creation of content. 8:34 [BLANK_AUDIO] 8:37 Less often now do you think of putting up, up 8:40 a whole blog post, right, you're more often you're composing 8:42 a single Tweet, you're taking a single photo and posting 8:45 that on Instagram, you're leaving a single comment on Facebook, 8:50 [BLANK_AUDIO] 8:54 But, the units of creation 8:57 [BLANK_AUDIO] 8:59 can be separate from the units of reflection, right? 9:02 Right now we think of them as the same thing but they can be separate. 9:05 When, when we were still composing entire blog 9:10 posts, we, we didn't have to make this distinction 9:13 because if you were writing about, let's say, 9:16 a trip to Argentina, it was one cohesive update. 9:19 But if you were to do the same thing now, there, you know, maybe you posted about 9:25 your flight on Twitter and you took some pictures of some sunsets on Instagram. 9:31 And then maybe on Facebook there's this conversation between you 9:35 and your friends about what to eat or where to go. 9:39 So, if you were to come back to your trip a year later, you have 9:42 to forage, forage around a little bit 9:46 before the complete picture forms in your mind. 9:49 [BLANK_AUDIO] 9:52 Now, this atomization of creation is another topic for another day. 9:54 And, but I think it's mostly a good thing. 9:58 It's fine. 10:03 But, it just means that we now have to start thinking 10:04 very deeply about what the units of meeting are to a person. 10:08 See these two dinner plates? 10:15 This one, on the left, is the typical plate size in the 10:18 US and the plate on the right is the typical size in Europe. 10:22 [BLANK_AUDIO] 10:25 And in a study where they gave Americans, 10:29 I'm sure it would've been the same, you know, 10:32 for Europeans, but if they served, if they 10:34 served food to an American on a smaller plate, 10:38 those people said they were just as satisfied with how full they were. 10:43 Even though they ate less. 10:49 [BLANK_AUDIO] 10:50 Now there are a course a lot of cultural and psychological reasons for this right. 10:53 Most people eat whatever's on their first 10:58 plate before they start thinking about seconds. 11:00 There's cultural politeness about eating everything that you're served, but I think 11:02 the key fact remains here that these plate sizes, these plates 11:07 act as handles for how you manipulate and control how much you consume. 11:12 And the typical activity feed is a little bit like not having a plate. 11:18 [BLANK_AUDIO] 11:24 You have no sense of how much you're supposed to eat. 11:26 Everything is in these tiny pea sized morsels and they all 11:29 look the same and each one isn't very satisfying on its own. 11:33 So, either you're left hungry because you just said, 11:37 fuck it, I'm not gonna do this, or you 11:42 eat and eat and eat too much, and you're 11:46 bloated and you're self dis, you're, you're disgusted with yourself. 11:49 [BLANK_AUDIO] 11:52 But okay, some things online do have handles. 11:55 Facebook timelines separate out all this activity into years. 11:59 Into discrete years. 12:06 And this is great, right? 12:06 There's only a couple of items for you to filter and navigate by. 12:09 And more than that, it lets you wrap your arms around this information. 12:12 You get a sense of the whole. 12:17 So you have years, and you can open each year up. 12:21 And navigate by month, and little discrete pieces of activity, 12:23 like adding a new friend, they get bundled up together. 12:28 Because that's the unit of meaning. 12:30 It doesn't matter that I've, that I need 12:33 20 separate entries for adding 20 separate friends. 12:35 I just wanna know that in August I made 20 new friends. 12:38 [BLANK_AUDIO] 12:39 So this clustering of information is something I 12:42 think we need to do more in our archives. 12:44 [BLANK_AUDIO] 12:46 And this is, this is really clever. 12:49 This is pretty advanced, but I also think this is about as far as you can 12:51 go without really, you know, doing this automatically 12:56 without really asking users to ex, explicitly provide information. 13:00 Now, I think that I think we have 13:07 this bias towards collecting data from our users. 13:09 We, we think that anything that's automatic is great 13:14 because that doesn't take any effort from our users, 13:17 and we think anything that requires user input is 13:20 bad because well, what if people don't wanna do this? 13:23 This is too much work. 13:26 But, Flickr, old school Flickr, was the master of getting 13:27 information out of users of getting explicit information. 13:33 They, gave, they, they made the concept of tagging. 13:39 Really, really prevalent across the web, sure, but 13:45 they also gave these other tools to their users. 13:47 They gave sets, collections, and galleries. 13:50 Sets are what you think of as a normal full album, it's 13:53 just a collection of photos and collections are one, one level up. 13:55 They group collection, other collections then sets together 14:01 and Galleries, there are two, two rules with Galleries. 14:05 You could have up to 18 photos, and all of the photos had to be from other people. 14:08 You couldn't provide your own photos. 14:14 And the, the point of Galleries was just that you, they wanted 14:17 you to look at Flickr and, and bring back some specific perspective. 14:20 Some specific frame, 14:26 [BLANK_AUDIO] 14:28 And did, did users use these tools? 14:31 They did. 14:34 They didn't mind the effort. 14:36 [BLANK_AUDIO] 14:37 They created these and shared these and commented on these and the key to 14:40 their use was that you could share any of these units 14:45 privately or publicly, and this is incredibly flexible, right. 14:51 So I could, if I went on a trip to New York, I 14:56 could take my com, my entire photo stream completely private, and then maybe 15:00 to share with my family, I would take some photos of the hotel 15:05 and, and some of the, I don't know, tourist traps that I go to. 15:09 And then maybe with my design friends, I take some of those photos and put 15:14 them in a new collection, but I also 15:19 included an entire album about the high line. 15:21 And I can share that. 15:24 [BLANK_AUDIO] 15:25 It's incredibly powerful 15:27 [BLANK_AUDIO] 15:30 And I encourage users to revisit their collection over and over again, to derive 15:33 new meaning from their existing body of work by manipulating this information. 15:39 By giving them handles to, to do something with their data. 15:44 [BLANK_AUDIO] 15:48 Heres another thing, most activity feeds 15:52 organize items by reverse chrono, reverse chron-order. 15:57 Right? 16:01 Most recent and then a day ago, and then a week ago 16:01 and they look a little bit like this, they're just unconnected dots. 16:06 [BLANK_AUDIO] 16:09 But, I think what's missing here is, is cause and effect. 16:11 Right, the way we talk about the past you know lets 16:18 say, there was a github issue, that someone filed a bug. 16:22 And the way we talk about this is, we're like, oh, so-and-so found this bug and 16:26 then someone else wrote in to confirm that 16:31 they could produce this bug on their machine. 16:33 And then another person chimed in and, related it 16:35 to this other ticket that had already been filed. 16:40 And then finally, someone submitted a patch that fixed it. 16:43 Right. 16:47 So it's a little bit more like this. 16:48 [BLANK_AUDIO] 16:49 There's cause and effect and 16:52 [BLANK_AUDIO] 16:53 we create these atoms online, and we put them online and they get shared, and they 16:55 get favorited, and reblogged, retweeted, and they take on their own life. 17:01 They go on their own journeys. 17:08 They have their own history. 17:10 This is version one Mixel. 17:11 And, what I loved about, what you could do with the collages was that you could take, 17:13 you could create a snippet of a fragment of an image and use that in your collage. 17:18 But, someone else could also take that image, 17:24 and use it, reuse it in their collage. 17:28 And you could actually follow the life of that particular image 17:31 fragment, and see how it was used across all of Mixel. 17:33 I think that's great. 17:39 Right. 17:41 And we, we should really preserve and present the journeys of our atoms. 17:42 In our systems as well. 17:47 Just, as another example, on Rdio, if someone 17:48 shares a song with me and then I, if I listen to it and I add it to my 17:53 collection, sure these are all separate events to a computer, right? 17:58 Maybe that person sent that song to me 2 18:04 months ago and I never got around to, to listening 18:07 to it until now, and so they might appear 18:10 far, far apart on my activity feed, but they're related. 18:13 They're obviously related and when I look back on my activity, I 18:18 would wanna see that information presented, 18:23 this relationship presented to me as well. 18:25 [BLANK_AUDIO] 18:27 So, like I said I, I think we can imagine and 18:31 automatically capture a lot of these 18:34 sequences, but they're simply starting points. 18:36 And I think if we give users tools to tell 18:40 more complicated stories than we can imagine, they'll do it. 18:44 These are story telling tools. 18:48 Another example that I think a lot of you will be familiar with is do 18:51 your list apart redesign that happened recently which is gorgeous. 18:56 I'm a typographer at first, so the first thing that appeared in my Twitter 19:02 timeline when people were talking about it was how gorgeous the large type was. 19:06 [BLANK_AUDIO] 19:10 But the second thing I latched onto was their archive page, and I don't 19:13 have a screen shot of it here, but I'll just very quickly describe it. 19:16 All the articles are sorted by author, that's a piece of automatic data that 19:20 you get for free Just from their very smart tagging in CMS system and they also 19:26 you know sorted the articles by topic, 19:32 you know design, you know development, content strategy, 19:34 but it's still really hard if you were a new designer or a new developer and 19:39 you were digging through the history of the 19:46 web as represented in the OS apart archive, right? 19:48 [BLANK_AUDIO] 19:52 The design topic could be broken out really into the initial 19:54 move away from tables and starting to think about web standards and HTML 19:59 and CSS and then, you know, then the the Dao article 20:05 that was really influential came into being, and that's like a separate period. 20:10 And after that, there was a huge phase 20:16 of adaptive web design and responsive web design. 20:18 And so if I went to the design topic page, 20:21 I would wanna see this sort of history broken out. 20:24 I don't wanna just see 1000 articles were tagged as design. 20:28 This is what I think we should be thinking 20:34 about in terms of the shape of our content. 20:37 [BLANK_AUDIO] 20:39 Now of course we already have places to tell these stories. 20:43 Right, we have Twitter, we have Instagram, we 20:47 have Facebook, and so I think one question, 20:51 one way to answer the question of how 20:55 can we make these archives more relevant to people. 20:57 How do we reach more people? 21:00 Is to already be, is to be increasingly visible on the 21:02 platforms people are already on and to tell your stories there. 21:06 [BLANK_AUDIO] 21:08 I'm, I'm gonna shift gears a little bit and talk about three different projects. 21:11 [BLANK_AUDIO] 21:16 The first project is an art project by James Bridle who lives in the UK. 21:19 And he made this thing called Dronestragram. 21:25 Dronestragram reports every single drone strike made by the US military. 21:30 He takes the satellite view of the location of that drone 21:36 strike, puts a photo filter on it, because, why not, it's Instagram. 21:39 And then in the description of each photo, in the caption of 21:44 each photo, he posts a description of what happened in that strike. 21:50 And what's great about this, is that we 21:55 haven't quite understood how drone strikes work really. 21:59 We don't really understand it. 22:03 Maybe you read one article or two and you have a 22:04 sense of like okay, in a year there's 200 strikes and OK. 22:08 But, I check Instagram a couple times a day and every week 22:16 or so between photos of my friends, I see something like this. 22:20 And through this I get a real sense of the pace of these drone strikes. 22:25 [BLANK_AUDIO] 22:30 I really start to understand time in this way that I would 22:32 not be, be able to through, a piece in the New York Times. 22:35 Here's another example. 22:41 This is the real time Titanic account that was created by The History Press 22:42 to commemorate the 101st anniversary of the sinking of the Titanic 22:51 and it tweeted hypothetical bits and pieces of text and photos 22:55 based on research material for an entire month leading up to the sinking and for 23:02 most of the time it was kinda funny. 23:07 It was a lot of very like tweets because no one 23:09 on the ship really knew what was gonna happen, but we do. 23:13 And that's interesting there's, there's this tension here, right. 23:16 We know how this story ends. 23:20 [BLANK_AUDIO] 23:21 And I would be checking Twitter throughout the day 23:23 and seeing tweets from my friends and seeing this 23:29 [SOUND] and it sort of, I'm sort of halfway in this 23:35 world in the early 1900's and halfway in, 23:41 you know, in today, today's time. 23:47 And every, and life goes on in my time. 23:54 Even though the world is falling apart here. 23:57 [BLANK_AUDIO] 24:00 So I think, I think these two projects 24:03 exist as polar opposites of this, of a continuum. 24:06 The Titanic account had a very obvious narrative. 24:12 They, they knew where they were gonna start. 24:14 They knew where they were gonna end, and Joseph Graham is kind of just 24:16 you know there's no narrative there, it's just a way of trying to understand drones. 24:21 And this third project sort of sits some, somewhere in the middle. 24:26 This is a Twitter account called the Library of Aleph. 24:30 And it's this guy who goes through the 24:34 Library of Congress photo archives and he looks 24:37 at the photos and when he sees an 24:42 interesting caption, he posts the caption on Twitter. 24:44 [BLANK_AUDIO] 24:48 He doesn't link to the photo. 24:51 It's just, it's just the caption. 24:52 And so this sort of started out like Instagram or Junkstagram. 24:55 There was no real narrative. 24:58 But it found a narrative in July of this year. 24:59 [BLANK_AUDIO] 25:04 He was in the archives when the ruling of George Zimmerman came out. 25:10 And for those of you who don't, for those of you 25:18 who don't know, George Zimmerman was tried for killing a black man 25:21 and he was ruled innocent. 25:28 And so, this accounts are re-tweeting a couple of other things from history. 25:31 And I wanted to read a couple of them here. 25:36 Martin Luther King Jr pulls up the cross that was burned on the 25:40 lawn of his, of his home, as his son stands next to him. 25:45 Atlanta, Georgia. 25:49 Execution of 38 Sioux Indians at Mankato, Minnesota, December 26th, 1862. 25:52 Japanese merchant posts sales sign in preparation 26:01 for evacuation as small son looks on. 26:04 Lynching of Leo Frank, Marietta, Georgia. 26:08 Lynching, Sikeston. 26:13 Contrabands coming into camp in consequence of the proclamation. 26:18 A group of contrabands. 26:21 The ghetto, Chicago, Illinois. 26:27 The ghetto, New York, New York. 26:30 The public swimming pool has been changed into 26:35 a private pool, in order to remain segregated. 26:37 African American woman being carried to police 26:42 patrol wagon during demonstration in Brooklyn, New York. 26:44 [BLANK_AUDIO] 26:47 It sort of spontaneously found a story. 26:53 I don't think the person who created this account had 26:59 any objective when he started, but that night, in the middle 27:01 of all the anger and all the frustration that was coming 27:06 out in waves, and waves online, this, there was this account. 27:09 And it, it kept going. 27:14 It went through the night and it went on to the next day, every 20, 27:17 30 minutes relentless and not only did it 27:22 hold meaning for people, it created new meaning. 27:29 It was an act of renewal this dusty stuff from the turn of the last century, 27:33 met people's anger and it told them, this is not new, this has happened before. 27:39 And it told them, you are not alone in this. 27:45 [BLANK_AUDIO] 27:48 These are, these are all tiny time machines. 27:54 You're in the present. 27:58 You are always in the present because you were born in this decade, in this century. 27:59 But these tiny time machines open a little portal back 28:04 to a specific time, just big enough to fit you. 28:09 It is the ladder to the past. 28:13 It feels more real because it is imbedded in 28:17 the networks you use, everyday, as part of your life. 28:19 And you see these stories being told, or 28:24 you construct your own stories, from what you're seeing. 28:26 Stories from a long time ago, being told in you. 28:29 We don't need to design dusty shelves. 28:34 This is why they matter, why the past 28:37 matters, because they coexist with us in the present. 28:39 They're not things we put in a tidy box and forget. 28:45 They're part of the stories we tell each other today. 28:49 They are lenses that are personal and often political. 28:51 And they help us understand what's going on. 28:54 This stuff online, things that we spent 28:58 hours and days and months working and building 29:02 and that people have spent so many 29:06 hours putting their effort, time and effort into. 29:09 [BLANK_AUDIO] 29:13 Isn't it a shame that you just forget about this, this stuff is our heritage 29:14 and we should be taking better care of it. 29:23 Thank you. 29:25 [SOUND] 29:29
You need to sign up for Treehouse in order to download course files.Sign up