[Script Info] Title: [Events] Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text Dialogue: 0,0:00:01.00,0:00:04.44,Default,,0000,0000,0000,,Let’s continue our journey of these design heuristics. Dialogue: 0,0:00:04.44,0:00:07.76,Default,,0000,0000,0000,,Before we do, I’d like to remind you that many of the interfaces Dialogue: 0,0:00:07.76,0:00:11.19,Default,,0000,0000,0000,,that we’re going to look at could fit into multiple different heuristics, Dialogue: 0,0:00:11.19,0:00:14.94,Default,,0000,0000,0000,,and the most important thing is to identify the problem: Dialogue: 0,0:00:14.94,0:00:20.17,Default,,0000,0000,0000,,If you identify and fix the problem, the label is of secondary importance. Dialogue: 0,0:00:21.36,0:00:24.54,Default,,0000,0000,0000,,Our next heuristic is “recognition over recall.” Dialogue: 0,0:00:24.54,0:00:33.71,Default,,0000,0000,0000,,Create interfaces that make objects, actions, options, and directions visible or easily retrievable. Dialogue: 0,0:00:33.71,0:00:38.63,Default,,0000,0000,0000,,And one of my favorite examples of this is [that] any time you see a Post-It note, Dialogue: 0,0:00:38.63,0:00:45.21,Default,,0000,0000,0000,,that probably means that the relevant information isn’t as ready at hand as it ought to be. Dialogue: 0,0:00:45.21,0:00:48.15,Default,,0000,0000,0000,,Here’s a photograph I took of one of our lunch meetings. Dialogue: 0,0:00:48.15,0:00:51.63,Default,,0000,0000,0000,,And here you can see we have shwarma and falafel. Dialogue: 0,0:00:51.63,0:00:54.02,Default,,0000,0000,0000,,They each have a number on them. Dialogue: 0,0:00:54.02,0:01:00.54,Default,,0000,0000,0000,,And we have a code that’s used to distinguish which number means which kind of sandwich. Dialogue: 0,0:01:00.54,0:01:05.34,Default,,0000,0000,0000,,And of course, the reason for this is that someone spent all their time making these delicious, Dialogue: 0,0:01:05.34,0:01:08.44,Default,,0000,0000,0000,,and didn’t take the time to write out the whole label on it. Dialogue: 0,0:01:08.44,0:01:10.94,Default,,0000,0000,0000,,So it’s understandable and fixable. Dialogue: 0,0:01:10.94,0:01:15.17,Default,,0000,0000,0000,,But, from an interface design perspective, it would be faster to find the chicken shwarma Dialogue: 0,0:01:15.17,0:01:21.42,Default,,0000,0000,0000,,if it was written directly on there, as opposed to in code. Dialogue: 0,0:01:24.36,0:01:28.84,Default,,0000,0000,0000,,Here’s a screen shot of a ticket-buying website, and what you can see Dialogue: 0,0:01:28.84,0:01:33.50,Default,,0000,0000,0000,,is that it gives you a couple of options like buy tickets for today or for a future day. Dialogue: 0,0:01:33.50,0:01:37.81,Default,,0000,0000,0000,,There’s a couple of problems from a heuristics perspective with this screen. Dialogue: 0,0:01:37.81,0:01:43.67,Default,,0000,0000,0000,,For starters — and we’ll get to this in a little bit — the layout is kind of all over the place. Dialogue: 0,0:01:43.67,0:01:48.63,Default,,0000,0000,0000,,But also the thing that we’re going to look at here is the fact that we have this intermediate screen Dialogue: 0,0:01:48.63,0:01:52.00,Default,,0000,0000,0000,,which I think could be done away with with clever design. Dialogue: 0,0:01:52.00,0:01:55.39,Default,,0000,0000,0000,,It, for example, brings you to a page Dialogue: 0,0:01:55.39,0:02:00.52,Default,,0000,0000,0000,,that offers up show times for today and offers you a dialog box to switch the day. Dialogue: 0,0:02:00.52,0:02:05.36,Default,,0000,0000,0000,,And so, by setting up reasonable defaults, you can avoid extra hurdles . Dialogue: 0,0:02:05.36,0:02:10.53,Default,,0000,0000,0000,,In addition to leading with reasonable defaults, it can be valuable to provide previews. Dialogue: 0,0:02:10.53,0:02:16.03,Default,,0000,0000,0000,,This is a screen shot of a web design tool where there are many templates available. Dialogue: 0,0:02:16.03,0:02:22.24,Default,,0000,0000,0000,,However, all of the templates are shown in textural listing, which is not well suited for the task. Dialogue: 0,0:02:22.24,0:02:28.67,Default,,0000,0000,0000,,You have to think through whether that’s what you want, and that’s a difficult thing to do reliably. Dialogue: 0,0:02:28.67,0:02:35.34,Default,,0000,0000,0000,,By contrast this is a different web design tool that offers previews of all of the templates available, Dialogue: 0,0:02:35.34,0:02:39.52,Default,,0000,0000,0000,,and it’s much easier to see if that’s the design that you’d like. Dialogue: 0,0:02:40.28,0:02:44.04,Default,,0000,0000,0000,,Next up, flexibility and efficiency. Dialogue: 0,0:02:44.04,0:02:47.12,Default,,0000,0000,0000,,An simple and straight forward example of this Dialogue: 0,0:02:47.12,0:02:52.05,Default,,0000,0000,0000,,is to provide keyboard accelerator shortcuts and similar things like that for experts. Dialogue: 0,0:02:52.05,0:02:55.82,Default,,0000,0000,0000,,This is the View menu of the Firefox web browser. Dialogue: 0,0:02:55.82,0:03:01.44,Default,,0000,0000,0000,,And this is a great example of offering flexibility and support for experts in two ways. Dialogue: 0,0:03:01.44,0:03:05.37,Default,,0000,0000,0000,,First, we can see that there’s keyboard shortcuts available. Dialogue: 0,0:03:05.37,0:03:12.14,Default,,0000,0000,0000,,And second, the View Source menu will let you retrieve the page source of any page that you’re looking at, Dialogue: 0,0:03:12.14,0:03:18.08,Default,,0000,0000,0000,,so you can look under the hood — not something that most people want to do; valuable for experts. Dialogue: 0,0:03:18.08,0:03:20.97,Default,,0000,0000,0000,,This is the Expedia hotel search, Dialogue: 0,0:03:20.97,0:03:26.18,Default,,0000,0000,0000,,and it does a really nice job of making the common cases quite easy to get to. Dialogue: 0,0:03:26.18,0:03:29.00,Default,,0000,0000,0000,,Popular cities are shown with a radio button. Dialogue: 0,0:03:29.00,0:03:33.14,Default,,0000,0000,0000,,But also, if you’d like to go to a less popular city, Dialogue: 0,0:03:33.14,0:03:36.39,Default,,0000,0000,0000,,there’s a free entry field that you can type in anything that you want. Dialogue: 0,0:03:36.39,0:03:39.56,Default,,0000,0000,0000,,And so this is a nice example of defaults with options. Dialogue: 0,0:03:39.56,0:03:44.76,Default,,0000,0000,0000,,Flexible interfaces can also foreground and push relevant ambient information. Dialogue: 0,0:03:44.76,0:03:47.09,Default,,0000,0000,0000,,This is a screen shot of BusyCal, Dialogue: 0,0:03:47.09,0:03:52.37,Default,,0000,0000,0000,,which will allow you to view the weather forecast on your weekly view of your calendar. Dialogue: 0,0:03:52.37,0:03:57.36,Default,,0000,0000,0000,,Here’s another example of productivity in the user interface: This is Google’s Gmail, Dialogue: 0,0:03:57.36,0:04:03.07,Default,,0000,0000,0000,,which, if you click Spam on a recipient that it knows how to unsubscribe you from, Dialogue: 0,0:04:03.07,0:04:08.91,Default,,0000,0000,0000,,it will offer the opportunity to directly unsubscribe you from that email as well. Dialogue: 0,0:04:08.91,0:04:13.93,Default,,0000,0000,0000,,And I think this is an example of how, if you’re going to be proactive in an interface, Dialogue: 0,0:04:13.93,0:04:19.27,Default,,0000,0000,0000,,you need to do it well and offer a clear, immediate, task-relevant benefit. Dialogue: 0,0:04:19.27,0:04:27.06,Default,,0000,0000,0000,,People generally don’t like proactive interfaces that distract, interrupt, break flow, or provide irrelevant information. Dialogue: 0,0:04:27.06,0:04:33.73,Default,,0000,0000,0000,,Another nice example of support for richer use is to offer recommendations on a particular page. Dialogue: 0,0:04:33.73,0:04:39.44,Default,,0000,0000,0000,,And so here you can see if you like this one beverage here, [there are] other beverages you might like. Dialogue: 0,0:04:44.36,0:04:49.93,Default,,0000,0000,0000,,And again, if you’re going to offer recommendations, or other kinds of proactivity, keep it relevant. Dialogue: 0,0:04:49.93,0:04:53.94,Default,,0000,0000,0000,,This is an example from Amazon, of discussion fora for products Dialogue: 0,0:04:53.94,0:04:58.08,Default,,0000,0000,0000,,that are almost entirely unrelated to the product that is being shown. Dialogue: 0,0:04:58.08,0:05:01.66,Default,,0000,0000,0000,,And it just distracts from the user’s main goal — Mostly they’re wondering Dialogue: 0,0:05:01.66,0:05:06.90,Default,,0000,0000,0000,,“Why on earth did these things end up at the bottom of some completely unrelated webpage?” Dialogue: 0,0:05:06.90,0:05:12.99,Default,,0000,0000,0000,,And finally, [while] flexibility can be incredibly valuable, it is possible to go overboard. Dialogue: 0,0:05:12.99,0:05:17.95,Default,,0000,0000,0000,,This is a photograph from Bill Moggridge who shows an interview with a user Dialogue: 0,0:05:17.95,0:05:24.61,Default,,0000,0000,0000,,who had hacked their remote control to limit it to just the relevant functionality that they needed. Dialogue: 0,0:05:24.61,0:05:31.21,Default,,0000,0000,0000,,And so, flexibility can sometimes be at tension with minimalism. Dialogue: 0,0:05:31.21,0:05:36.78,Default,,0000,0000,0000,,Our eighth heuristic is “aesthetic and minimalist design.” Dialogue: 0,0:05:36.78,0:05:42.20,Default,,0000,0000,0000,,When people view your webpage, for example, they’re viewing it on a screen, Dialogue: 0,0:05:42.20,0:05:47.50,Default,,0000,0000,0000,,and so they see not the entire page, but one screen’s worth at a given time. Dialogue: 0,0:05:47.50,0:05:51.91,Default,,0000,0000,0000,,What they see is what’s called “above the fold” — it comes from newspapers. Dialogue: 0,0:05:51.92,0:05:55.48,Default,,0000,0000,0000,,Here’s an example of a screen where the relevant information — Dialogue: 0,0:05:55.48,0:06:00.06,Default,,0000,0000,0000,,what the weather forecast is — is not even visible anywhere above the fold. Dialogue: 0,0:06:00.06,0:06:03.91,Default,,0000,0000,0000,,Everything above the fold is all of the chrome and extra stuff, Dialogue: 0,0:06:03.91,0:06:07.03,Default,,0000,0000,0000,,but the core information you have to scroll down for. Dialogue: 0,0:06:07.03,0:06:10.95,Default,,0000,0000,0000,,And to the extent that you’re trying to optimize for user experience, Dialogue: 0,0:06:10.95,0:06:18.12,Default,,0000,0000,0000,,it would be better to have the core information above the fold. Dialogue: 0,0:06:18.12,0:06:24.21,Default,,0000,0000,0000,,As we’ll talk about in visual design, if you’re going to use color and other cues, Dialogue: 0,0:06:24.21,0:06:27.62,Default,,0000,0000,0000,,have them mean something, and do so judiciously. Dialogue: 0,0:06:27.62,0:06:32.15,Default,,0000,0000,0000,,Here’s an example of a check out page that’s using lots of different colors, Dialogue: 0,0:06:32.15,0:06:40.02,Default,,0000,0000,0000,,and has a real cacophony in terms of its hierarchical organization on screen, for no apparent purpose. Dialogue: 0,0:06:40.02,0:06:43.80,Default,,0000,0000,0000,,And here’s a screen shot from Google’s help system. Dialogue: 0,0:06:43.80,0:06:48.93,Default,,0000,0000,0000,,Google is often thought of as an example of minimalist design and they often do this quite well. Dialogue: 0,0:06:48.93,0:06:54.04,Default,,0000,0000,0000,,I wanted to show one example where, I think, some more information could be stripped out, Dialogue: 0,0:06:54.04,0:06:56.88,Default,,0000,0000,0000,,or rather some more noise could be stripped out. Dialogue: 0,0:06:56.88,0:07:00.58,Default,,0000,0000,0000,,And what I’m looking at in particular is this stuff here, Dialogue: 0,0:07:00.58,0:07:06.28,Default,,0000,0000,0000,,where all of the table borders and other stuff are what you most see, Dialogue: 0,0:07:06.28,0:07:11.15,Default,,0000,0000,0000,,whereas what you actually most care about is the data in the survey, Dialogue: 0,0:07:11.15,0:07:15.64,Default,,0000,0000,0000,,and so, if you get rid of all of the extra lines and chart junk, Dialogue: 0,0:07:15.64,0:07:20.03,Default,,0000,0000,0000,,it can be clearer to see the parts that you cared the most about. Dialogue: 0,0:07:21.80,0:07:26.60,Default,,0000,0000,0000,,Here’s a log in screen that I think does a nice job of keeping the email address only in one place Dialogue: 0,0:07:26.60,0:07:30.43,Default,,0000,0000,0000,,because it’s right up top here, and then you get to say Dialogue: 0,0:07:30.43,0:07:34.21,Default,,0000,0000,0000,,whether or not you’re a returning customer or a new customer. Dialogue: 0,0:07:34.21,0:07:38.32,Default,,0000,0000,0000,,If you’re a returning customer you enter your password; or if you’re a new customer, Dialogue: 0,0:07:38.32,0:07:46.60,Default,,0000,0000,0000,,like the screen shows here, you create a new password and then type it in and go on from there. Dialogue: 0,0:07:46.60,0:07:50.40,Default,,0000,0000,0000,,By contrast, this flight search website has the exact same information — Dialogue: 0,0:07:50.40,0:07:53.68,Default,,0000,0000,0000,,number of stops — in two separate places. Dialogue: 0,0:07:53.68,0:07:56.63,Default,,0000,0000,0000,,And it’s possible that this increased clarity. Dialogue: 0,0:07:56.63,0:08:02.66,Default,,0000,0000,0000,,However, there is a cost of complexity, and there’s also a cost of vertical screen real estate, Dialogue: 0,0:08:02.66,0:08:07.19,Default,,0000,0000,0000,,where by listing the same thing twice, you’re pushing other stuff down. Dialogue: 0,0:08:07.19,0:08:12.64,Default,,0000,0000,0000,,Often by being dynamic about what you show or figuring out how to show things just once, Dialogue: 0,0:08:12.64,0:08:20.29,Default,,0000,0000,0000,,you can have all of the relevant information fit more clearly and in a less cluttered way on the screen. Dialogue: 0,0:08:20.29,0:08:27.76,Default,,0000,0000,0000,,One of the easiest conceits to make as a design team is that the people using your site will care as deeply Dialogue: 0,0:08:27.76,0:08:33.26,Default,,0000,0000,0000,,and will want to spend as much time using the site as you’ve spent building the site. Dialogue: 0,0:08:33.26,0:08:37.38,Default,,0000,0000,0000,,And so it can be easy to have feature creep and lots of bells and whistles and doodads. Dialogue: 0,0:08:37.38,0:08:39.88,Default,,0000,0000,0000,,But that’s not necessarily what people want. Dialogue: 0,0:08:39.88,0:08:45.56,Default,,0000,0000,0000,,Here’s an example of a student loan website that offers you the ability to add widgets to your home screen. Dialogue: 0,0:08:45.56,0:08:50.88,Default,,0000,0000,0000,,Now this is the kind of site that you log in to probably a couple times a year? [laugh] Dialogue: 0,0:08:50.88,0:08:56.33,Default,,0000,0000,0000,,It’s not likely to be a site that you’re going to want to festoon with all sorts of gadgets. Dialogue: 0,0:08:56.33,0:09:02.70,Default,,0000,0000,0000,,Next let’s talk about helping users recognize, diagnose, and recover from errors. Dialogue: 0,0:09:02.70,0:09:06.40,Default,,0000,0000,0000,,One of the first steps of doing this is making the problem clear. Dialogue: 0,0:09:06.40,0:09:14.40,Default,,0000,0000,0000,,Here’s a hotel reservation site where all it says is: “Mistake. month. back.” Dialogue: 0,0:09:14.40,0:09:18.36,Default,,0000,0000,0000,,It’s hard to know what to do. Dialogue: 0,0:09:18.36,0:09:22.72,Default,,0000,0000,0000,,Here’s one that’s a little bit better: It’s a registration site for an event. Dialogue: 0,0:09:22.72,0:09:27.10,Default,,0000,0000,0000,,And what we see here is that it says you must fill out all the required fields. Dialogue: 0,0:09:27.10,0:09:31.51,Default,,0000,0000,0000,,Okay, that’s a little better. But which fields didn’t I fill out? Dialogue: 0,0:09:31.51,0:09:37.19,Default,,0000,0000,0000,,This page is screens and screens long; there’s lots and lots of things that need to be checked. Dialogue: 0,0:09:37.19,0:09:41.42,Default,,0000,0000,0000,,Which of the myriad things on this page did I forget to check? Dialogue: 0,0:09:41.42,0:09:46.13,Default,,0000,0000,0000,,Maybe you could show me just a page that has the one or two things forgotten Dialogue: 0,0:09:46.13,0:09:51.48,Default,,0000,0000,0000,,rather than the whole pile of stuff and force me to scroll through it again. Dialogue: 0,0:09:51.48,0:09:57.41,Default,,0000,0000,0000,,Here’s a dialog box that shows the error and explains it clearly, Dialogue: 0,0:09:57.41,0:10:00.46,Default,,0000,0000,0000,,but it doesn’t offer you much in terms of solving the problem. Dialogue: 0,0:10:00.46,0:10:04.03,Default,,0000,0000,0000,,It says that there’s not enough space on your iPod. Too bad. Dialogue: 0,0:10:04.03,0:10:09.67,Default,,0000,0000,0000,,A more effective solution would be to offer some view into what’s taking up all the space, Dialogue: 0,0:10:09.67,0:10:14.73,Default,,0000,0000,0000,,or to offer reasonable ways of limiting the amount of media Dialogue: 0,0:10:14.73,0:10:17.49,Default,,0000,0000,0000,,that you’re trying to put on the device so that it can all fit. Dialogue: 0,0:10:17.49,0:10:23.62,Default,,0000,0000,0000,,And in this particular case, more recent versions of this application handle this problem better. Dialogue: 0,0:10:23.62,0:10:31.97,Default,,0000,0000,0000,,A common mistake in writing error messages is to offer one dialog box for all of the possibilities. Dialogue: 0,0:10:31.97,0:10:37.06,Default,,0000,0000,0000,,Here’s a screen shot of trying to open a file where it doesn’t know the file type. Dialogue: 0,0:10:37.06,0:10:41.66,Default,,0000,0000,0000,,And it says, “The application that you chose (‘(null)’), could not found. Dialogue: 0,0:10:41.66,0:10:45.70,Default,,0000,0000,0000,,Check the file name or choose another application.” Dialogue: 0,0:10:45.70,0:10:50.31,Default,,0000,0000,0000,,Well this would be a whole lot better if we were speaking the user’s language: Dialogue: 0,0:10:50.31,0:10:52.21,Default,,0000,0000,0000,,“Null” may not be the best choice. Dialogue: 0,0:10:52.21,0:10:58.26,Default,,0000,0000,0000,,And also if we offered up a reasonable application for that file type. Dialogue: 0,0:10:58.26,0:11:02.10,Default,,0000,0000,0000,,A lot of common tasks on the web are search-based tasks. Dialogue: 0,0:11:02.10,0:11:05.04,Default,,0000,0000,0000,,So here’s a screenshot from searching for a flight, Dialogue: 0,0:11:05.04,0:11:08.77,Default,,0000,0000,0000,,where the constraint specified yielded no possible solution. Dialogue: 0,0:11:08.77,0:11:13.81,Default,,0000,0000,0000,,For complex search tasks. if a user specifies an unreasonable set of constraints, Dialogue: 0,0:11:13.81,0:11:16.99,Default,,0000,0000,0000,,one of the most powerful things that you can do as a designer Dialogue: 0,0:11:16.99,0:11:22.62,Default,,0000,0000,0000,,is to offer a relaxation of those constraints that makes this more workable. Dialogue: 0,0:11:22.62,0:11:27.41,Default,,0000,0000,0000,,Many years ago, I worked with Chuck Rich at Mitsubishi Research in Boston. Dialogue: 0,0:11:27.41,0:11:30.56,Default,,0000,0000,0000,,And he was working on a research system called Collagen Dialogue: 0,0:11:30.56,0:11:34.04,Default,,0000,0000,0000,,that would find ways to intelligently relax these constraints — Dialogue: 0,0:11:34.04,0:11:37.58,Default,,0000,0000,0000,,among other things — to help users get their work done better. Dialogue: 0,0:11:37.58,0:11:42.34,Default,,0000,0000,0000,,And this kind of smart relaxation can be a really powerful technique. Dialogue: 0,0:11:42.34,0:11:45.74,Default,,0000,0000,0000,,I wanted to end talking about errors on a good note. Dialogue: 0,0:11:45.74,0:11:50.49,Default,,0000,0000,0000,,Here’s a web browser dialog box that lets you know Dialogue: 0,0:11:50.49,0:11:54.39,Default,,0000,0000,0000,,if you go to a URL that it believes to be suspect, Dialogue: 0,0:11:54.39,0:11:57.59,Default,,0000,0000,0000,,it will let you know that you probably don’t want to be here, Dialogue: 0,0:11:57.59,0:12:03.03,Default,,0000,0000,0000,,and it offers to get you out of here and explain more about why this webpage was blocked. Dialogue: 0,0:12:03.03,0:12:08.08,Default,,0000,0000,0000,,There’s probably future further innovations that can happen in this kind of error work. Dialogue: 0,0:12:08.08,0:12:13.57,Default,,0000,0000,0000,,But I think that this is a pretty good darn start and a lot better than the way things used to be. Dialogue: 0,0:12:13.57,0:12:19.33,Default,,0000,0000,0000,,And that brings us to our last heuristic, which is better help and documentation. Dialogue: 0,0:12:19.33,0:12:25.61,Default,,0000,0000,0000,,It can be easy to think about help as somebody else’s problem and not part of the real app. Dialogue: 0,0:12:25.61,0:12:31.00,Default,,0000,0000,0000,,Fortunately, I think on the web, help and documents have become more integrated. Dialogue: 0,0:12:31.00,0:12:37.30,Default,,0000,0000,0000,,One of my favorite examples for this is learning programming systems where websites like PHP, .NET Dialogue: 0,0:12:37.30,0:12:41.79,Default,,0000,0000,0000,,can help you learn programming systems by providing examples. Dialogue: 0,0:12:41.79,0:12:45.40,Default,,0000,0000,0000,,Here’s another example-driven strategy from UPS’s website. Dialogue: 0,0:12:45.40,0:12:50.58,Default,,0000,0000,0000,,It offers you the opportunity to subscribe to a number of mailing lists. Dialogue: 0,0:12:50.58,0:12:53.85,Default,,0000,0000,0000,,And if you wonder what each of these mailing lists might give you, Dialogue: 0,0:12:53.85,0:12:56.21,Default,,0000,0000,0000,,on another screen I’ve batched them together here. Dialogue: 0,0:12:56.21,0:13:01.56,Default,,0000,0000,0000,,It will show you examples from each of those mailing lists of the content you are likely to receive. Dialogue: 0,0:13:01.56,0:13:04.07,Default,,0000,0000,0000,,That’s a really powerful kind of preview strategy. Dialogue: 0,0:13:04.07,0:13:08.83,Default,,0000,0000,0000,,And here is an example of a print dialog box to tell you what the problem is, Dialogue: 0,0:13:08.83,0:13:11.67,Default,,0000,0000,0000,,but doesn’t help you find the solution. Dialogue: 0,0:13:11.67,0:13:17.85,Default,,0000,0000,0000,,For starters, I think somebody wants to know, is the stuff that’s outside the margins relevant? Dialogue: 0,0:13:17.85,0:13:22.82,Default,,0000,0000,0000,,Is it just formally outside the margins, but nothing’s actually getting cut off? Dialogue: 0,0:13:22.82,0:13:27.19,Default,,0000,0000,0000,,or is there important document parts that I care about that are being cut off from the page? Dialogue: 0,0:13:27.19,0:13:31.09,Default,,0000,0000,0000,,And, what do you think the most reasonable path is to solving this problem? Dialogue: 0,0:13:31.09,0:13:39.14,Default,,0000,0000,0000,,Should I change the page size, or orientation, or move the header and footer? Help me solve it! Dialogue: 0,0:13:39.14,0:13:43.74,Default,,0000,0000,0000,,Here’s a dialog box for the photo merge feature of Adobe’s Photoshop Elements, Dialogue: 0,0:13:43.74,0:13:46.31,Default,,0000,0000,0000,,which is a very cool feature if you set it up right. Dialogue: 0,0:13:46.31,0:13:50.24,Default,,0000,0000,0000,,However, you need to specify multiple photos as input from the project bin. Dialogue: 0,0:13:50.24,0:13:54.70,Default,,0000,0000,0000,,And this is something that the dialog box actually could do a better job of leading you through. Dialogue: 0,0:13:54.70,0:14:00.59,Default,,0000,0000,0000,,It could then say let me show you and it could highlight the project bin on the screen or something like that. Dialogue: 0,0:14:00.59,0:14:04.04,Default,,0000,0000,0000,,Here are two screenshots from eBay. Dialogue: 0,0:14:04.04,0:14:08.88,Default,,0000,0000,0000,,On the left we have an interesting approach, where eBay has built its own internal messaging system. Dialogue: 0,0:14:08.88,0:14:13.23,Default,,0000,0000,0000,,And if, for the sake of argument, we decided that’s the right thing to do, Dialogue: 0,0:14:13.23,0:14:17.88,Default,,0000,0000,0000,,and that the internal messaging is better than directly responding to email — Dialogue: 0,0:14:17.88,0:14:21.05,Default,,0000,0000,0000,,I’m not sure about that, but we’ll go with it for now — Dialogue: 0,0:14:21.05,0:14:25.65,Default,,0000,0000,0000,,they’ve done a clever thing, which is, when you reply, the reply mail address says, Dialogue: 0,0:14:25.65,0:14:31.76,Default,,0000,0000,0000,,“Hey, use the yellow button,” and in the middle of replying it, you can see, “Oops, I made a mistake. Dialogue: 0,0:14:31.76,0:14:35.02,Default,,0000,0000,0000,,That’s right… I need to use the internal messaging system.” Dialogue: 0,0:14:35.02,0:14:37.34,Default,,0000,0000,0000,,It’s an interesting hack. Dialogue: 0,0:14:37.35,0:14:41.12,Default,,0000,0000,0000,,And here’s another screenshot from eBay, on the right hand side, Dialogue: 0,0:14:41.12,0:14:44.40,Default,,0000,0000,0000,,where when new functionality is introduced — Dialogue: 0,0:14:44.40,0:14:48.07,Default,,0000,0000,0000,,for example the ability to compare multiple options in your card — Dialogue: 0,0:14:48.07,0:14:51.18,Default,,0000,0000,0000,,it can call that out inside the user interface. Dialogue: 0,0:14:51.18,0:14:55.76,Default,,0000,0000,0000,,And I think the ability to combine help directly into the user interface Dialogue: 0,0:14:55.76,0:14:58.79,Default,,0000,0000,0000,,is one of the most exciting advances in this area. Dialogue: 0,0:14:58.79,0:15:03.20,Default,,0000,0000,0000,,And it’s something that was less common in previous desktop applications. Dialogue: 0,0:15:03.20,0:15:06.84,Default,,0000,0000,0000,,And here’s an example that I think is interesting. Dialogue: 0,0:15:06.84,0:15:12.49,Default,,0000,0000,0000,,This is the unsubscription dialog box for a mailing list, Dialogue: 0,0:15:12.49,0:15:16.02,Default,,0000,0000,0000,,and if you click “I receive too many emails,” Dialogue: 0,0:15:16.02,0:15:19.35,Default,,0000,0000,0000,,it says “Wait, you can change the frequency,” Dialogue: 0,0:15:19.35,0:15:23.80,Default,,0000,0000,0000,,and you have the opportunity to receive mailing list mails at a less frequent interval. Dialogue: 0,0:15:23.80,0:15:26.75,Default,,0000,0000,0000,,I think that this is an actually a really nice solution, Dialogue: 0,0:15:26.75,0:15:29.72,Default,,0000,0000,0000,,because sometimes you want to receive some mail, but not too much. Dialogue: 0,0:15:29.72,0:15:32.84,Default,,0000,0000,0000,,In other cases, maybe you’ll view this as harassing Dialogue: 0,0:15:32.84,0:15:35.71,Default,,0000,0000,0000,,and you’ll wish that you could just be done with this task quickly, Dialogue: 0,0:15:35.71,0:15:40.43,Default,,0000,0000,0000,,but in either case, I thought it was an interesting and creative solution. Dialogue: 0,0:15:40.43,0:15:43.73,Default,,0000,0000,0000,,I think it’s really important that help be sincere, Dialogue: 0,0:15:43.73,0:15:47.95,Default,,0000,0000,0000,,and there’s one class of help and additional information Dialogue: 0,0:15:47.95,0:15:54.45,Default,,0000,0000,0000,,that I think is, at least in effect, not providing users with the information that they need, Dialogue: 0,0:15:54.45,0:15:57.74,Default,,0000,0000,0000,,and that’s EULA’s, or end-user licensing agreements. Dialogue: 0,0:15:57.74,0:16:05.57,Default,,0000,0000,0000,,Here’re two examples of EULA screens where it’s very easy to click through without ever read the EULA. Dialogue: 0,0:16:05.57,0:16:13.02,Default,,0000,0000,0000,,And my hunch is that nearly all users do click through without reading the EULA. Dialogue: 0,0:16:13.02,0:16:17.58,Default,,0000,0000,0000,,If nobody needs to know the terms of the licensing agreement, that’s very reasonable, Dialogue: 0,0:16:17.58,0:16:20.72,Default,,0000,0000,0000,,but my hunch is that the reason these things exist is Dialogue: 0,0:16:20.72,0:16:25.50,Default,,0000,0000,0000,,because they have consequence of some sort the user should probably be informed about. Dialogue: 0,0:16:25.50,0:16:28.71,Default,,0000,0000,0000,,And so if you’re designing a site that has terms for users, Dialogue: 0,0:16:28.71,0:16:34.96,Default,,0000,0000,0000,,think about “Is there a way that you can at least summarize what the key things somebody’s agreeing to are” Dialogue: 0,0:16:34.96,0:16:42.43,Default,,0000,0000,0000,,without having them click through it or having never even seen or read a lick of the agreement at all. Dialogue: 0,0:16:42.43,0:16:45.49,Default,,0000,0000,0000,,And to close on a positive note, one nice thing Dialogue: 0,0:16:45.49,0:16:49.12,Default,,0000,0000,0000,,that you can do with help on a website is to help people have fun. Dialogue: 0,0:16:49.12,0:16:51.18,Default,,0000,0000,0000,,Filling out forms can often be really boring, Dialogue: 0,0:16:51.18,0:16:55.58,Default,,0000,0000,0000,,and here’s an example from a hotel website where one of the options has a little joke on the inside, Dialogue: 0,0:16:55.58,0:17:00.04,Default,,0000,0000,0000,,and so that bit of levity can help increase the user experience.