WEBVTT 00:00:01.541 --> 00:00:04.626 How did the field of human-computer interaction get started? 00:00:04.626 --> 00:00:10.460 One good place to begin our story is in July of 1945, when Vannevar Bush wrote 00:00:10.460 --> 00:00:16.506 an article for the Atlantic Monthly, later reprinted in Life, called “As We May Think”. 00:00:16.506 --> 00:00:22.010 Today, technology has mostly augmented people’s physical abilities; 00:00:22.010 --> 00:00:29.194 Bush outlined a vision for information technologies that augmented people’s intellectual abilities. 00:00:29.194 --> 00:00:33.024 Who is this guy? What’s his deal? And what led to his pressing vision? 00:00:33.024 --> 00:00:36.993 Bush was vice-president and dean of engineering at MIT in the 1930’s, 00:00:36.993 --> 00:00:39.724 where, incidentally, he was Fred Terman’s advisor. 00:00:39.724 --> 00:00:42.658 Terman went on to become dean of engineering at Stanford 00:00:42.658 --> 00:00:45.725 and in the eyes of many the father of Silicon Valley. 00:00:45.725 --> 00:00:48.863 In 1939, Vannevar Bush moved to Washington. 00:00:48.863 --> 00:00:51.722 He’s a leading scientific policy maker 00:00:51.722 --> 00:00:53.824 He directs a lot of the government funding, 00:00:53.824 --> 00:00:58.747 and indeed creates and is instrumental in setting up large-scale university research. 00:00:58.747 --> 00:01:03.530 This administrative effort eventually leads to the creation of the National Science Foundation and ARPA, 00:01:03.530 --> 00:01:07.096 institutionalizing government-funded scientific research. 00:01:07.096 --> 00:01:10.788 The goal of this article, written in the final months of World War II, is to ask 00:01:10.788 --> 00:01:15.916 “What can government-funded scientists do to create a better world in peace time?” 00:01:15.916 --> 00:01:19.077 and his vision was a strongly human-centred one. 00:01:19.077 --> 00:01:23.458 Bush wrote of a future interactive desk; he calls the system “memex.” 00:01:23.458 --> 00:01:28.512 The idea is that all of the world’s information would be available on the knowledge worker’s desktop. 00:01:28.512 --> 00:01:34.941 Key to the memex idea was effective user interfaces for information storage and retrieval. 00:01:34.941 --> 00:01:39.415 Remember, this is 1945, so there aren’t yet practical digital computers — 00:01:39.415 --> 00:01:42.594 the first room-scale digital computers were just being built — 00:01:42.594 --> 00:01:47.892 and the idea was to use microfiche — high density film — to store everything! 00:01:47.892 --> 00:01:51.972 Even more impressive, Bush’s memex vision invents hypertext: 00:01:51.972 --> 00:01:56.684 he has this idea that people could author trails through this information store, 00:01:56.684 --> 00:02:00.142 save them for later use, and share them with others. 00:02:00.142 --> 00:02:04.287 But you’re not always at your desk, right? You want technology to come with you. 00:02:04.287 --> 00:02:07.989 And knowledge workers need to produce content as well as consume it. 00:02:07.989 --> 00:02:11.418 And the world isn’t just textual; it’s also visual. 00:02:11.418 --> 00:02:14.410 So Bush imagined that, in the future, you’d wear a camera, 00:02:14.410 --> 00:02:19.253 right in the centre of your head, like a third eye, and use it to capture stuff. 00:02:19.253 --> 00:02:23.049 And he worked out a design that made it as easy as possible to take pictures, 00:02:23.049 --> 00:02:26.092 so there’re no dials or settings to fiddle with. 00:02:26.092 --> 00:02:32.413 As with the memex desk, the details turned out differently; but the core vision was right on target. 00:02:32.413 --> 00:02:36.540 Today, for example, there are more than a billion camera phones that people carry with them. 00:02:36.540 --> 00:02:41.924 The programmable digital computers that soon follow, like the ENIACS on here, 00:02:41.924 --> 00:02:44.345 were a huge technological lead-forward. 00:02:44.345 --> 00:02:48.585 But, as you can see from the wires, the user interface left a lot to be desired. 00:02:48.585 --> 00:02:53.577 The idea of providing a more effective interface to computers has a long and storied history, 00:02:53.577 --> 00:02:58.622 beginning with Grace Hopper’s invention in the early 1950’s of the first compiler. 00:02:58.622 --> 00:03:01.723 What’s inspirational for me is that she conceptualized 00:03:01.723 --> 00:03:06.715 how improved tools could provide a much wider audience with access to computation. 00:03:06.715 --> 00:03:10.265 In the intervening years, good programming environments for the desktop and Web 00:03:10.265 --> 00:03:14.988 enabled legions of developers to create the content that helped put a PC on every desk. 00:03:14.988 --> 00:03:20.533 It’s a long path from Grace Hopper’s visionary work on the compiler to the graphical user interface. 00:03:20.533 --> 00:03:23.993 There are three key highlights I’d like to share with you along the way. 00:03:23.993 --> 00:03:29.944 The seeds of direct manipulation were sown at MIT at Lincoln Labs by Ivan Sutherland. 00:03:29.944 --> 00:03:33.583 The key innovation of the graphical user interface is that the user’s input 00:03:33.583 --> 00:03:36.643 is performed directly on top of the system’s output. 00:03:36.643 --> 00:03:43.328 This input-on-output directness makes the interface much easier to understand and much more intuitive. 00:03:43.328 --> 00:03:49.382 This input-on-output directness makes the system much easier to understand and feel more intuitive. 00:03:49.382 --> 00:03:55.423 In the case of Sutherland’s Sketchpad, the input was a light pen and the output was an oscilloscope. 00:03:55.423 --> 00:03:58.850 Here’s a short clip of the system in action: 00:03:58.850 --> 00:04:01.979 (You can see, we have several unusal pieces of input-output equipment here. 00:04:01.979 --> 00:04:06.423 We have a scope, and these are unusual at the time. 00:04:06.423 --> 00:04:10.211 And pushbuttons. Toggle switches. 00:04:10.211 --> 00:04:12.124 We have several other related devices. 00:04:12.124 --> 00:04:17.395 This made the TX-2 a fine candidate for the Sketchpad devlepments back in 1961. 00:04:17.395 --> 00:04:23.516 As I draw my art of say… on the scope, it reinforces what I have in mind. 00:04:23.516 --> 00:04:26.518 This is in general part of the design process.) 00:04:26.518 --> 00:04:30.519 The next major stop on our journey is the creation of the mouse and hypertext; 00:04:30.519 --> 00:04:32.789 these are key foundations for the Web. 00:04:32.789 --> 00:04:36.484 In 1945, Doug Engelbart was a navy radar technician. 00:04:36.484 --> 00:04:39.257 Engelbart spent his monotonous years in the Philippines. 00:04:39.257 --> 00:04:45.716 In the library, he found a copy of the magazine Life; It reprinted Bush’s Atlantic Monthly article. 00:04:45.716 --> 00:04:51.287 As John Markov writes, the idea of a device that could extend the power of the human mind 00:04:51.287 --> 00:04:54.256 left Engelbart awestruck. 00:04:54.256 --> 00:04:58.882 He had a vision. It took a long time, but eventually he got some funding and set to work. 00:04:58.882 --> 00:05:04.250 And what Doug Engelbart came up with, he showed to the world in his famous 1968 demo. 00:05:04.250 --> 00:05:11.052 (The research program that I’m going to describe to you is quickly characterizable by saying, 00:05:11.052 --> 00:05:18.017 if, in your office, you, as an intellectual worker, were supplied with a computer display, 00:05:18.017 --> 00:05:22.509 backed up by a computer that was alive for you all day, 00:05:22.509 --> 00:05:25.557 and was infinitely responsive to the reaction you have, 00:05:25.557 --> 00:05:27.720 how much value will you derive from that? 00:05:27.720 --> 00:05:30.827 And in a second you’ll see the screen and it’s working. 00:05:30.827 --> 00:05:36.286 And the way the tracking spot moves in conjunction with movements of that mouse.) 00:05:36.286 --> 00:05:40.617 Engelbart’s mouse worked with two orthogonal wheels. 00:05:40.617 --> 00:05:47.375 Each was a potentiometer, a variable resistor, like stereos commonly have for a volume knob. 00:05:47.375 --> 00:05:50.559 So you get about 300° of a turn and that’s it. 00:05:50.559 --> 00:05:55.119 Its usable parameter provided about 5 inches of motion in each direction. 00:05:55.119 --> 00:05:58.381 After the 1968 demo, Doug takes a show on the road. 00:05:58.381 --> 00:06:02.585 He travels the country with a 16-millimetre Bell & Howell projector. 00:06:02.585 --> 00:06:06.711 Ivan Sutherland had recently joined the faculty at the University of Utah. 00:06:06.711 --> 00:06:14.149 Doug comes to visit and shows the demo, and in the audience is Ivan’s PhD student Alan Kay. 00:06:14.149 --> 00:06:16.174 Alan has been dreaming of a personal computer. 00:06:16.174 --> 00:06:21.056 He sees Engelbart’s video and his eyes bugged out — they have the same dream. 00:06:21.056 --> 00:06:24.102 After his PhD, Alan moved to the Stanford AI Lab, 00:06:24.102 --> 00:06:27.342 where John McCarthy’s group has an early time-sharing system, 00:06:27.342 --> 00:06:31.613 maybe the place in the world where every person had their own terminal. 00:06:31.613 --> 00:06:35.988 From there, he moves to Xerox PARC, where he fleshes out his vision of a Dynabook. 00:06:35.988 --> 00:06:40.779 Here is a picture of the prototype that Alan made in the early 1970’s. 00:06:40.779 --> 00:06:42.769 This isn’t a functioning computer at all; 00:06:42.769 --> 00:06:46.797 it’s made out of carboard; it’s a prototype designed to communicate a vision. 00:06:46.797 --> 00:06:50.884 With this vision in hand, Alan Kay and his colleagues at Xerox PARC start building 00:06:50.884 --> 00:06:54.408 the foundation of the first real graphical user interface. 00:06:54.408 --> 00:06:57.970 It took them a decade to get it all together, to get it ready to ship. 00:06:57.970 --> 00:07:01.522 Xerox released the STAR computing system in 1981. 00:07:01.522 --> 00:07:07.009 The STAR featured a bitmapped display, a window-based graphical user interface, icons, folders, 00:07:07.009 --> 00:07:12.357 mice, ethernet network, file servers, print servers, and email. 00:07:12.357 --> 00:07:14.823 This next clip shows the fruit of their labour: 00:07:14.823 --> 00:07:20.182 (The display screen shows your working environment; we call this the desktop. 00:07:20.182 --> 00:07:24.963 Using the Move key, you can arrange your desktop in any way you like. 00:07:24.963 --> 00:07:29.958 Making a copy of one of these blank documents is like turning a sheet off a pad of paper. 00:07:29.958 --> 00:07:33.257 The [inaudible] of users to make their own form pads 00:07:33.257 --> 00:07:36.667 is one example of the usatibility [sic] built into the system. 00:07:36.667 --> 00:07:39.850 The screen closely approximates the appearance of a printed page. 00:07:39.850 --> 00:07:46.546 And I’m going to copy it into this upper document, and the new paragraph will appear here. 00:07:46.546 --> 00:07:52.318 This is a little window that lets me set the various parameters of the paragraph.) 00:07:52.318 --> 00:07:57.743 When the STAR shipped, this was almost four decades after Vannevar Bush’s vision, 00:07:57.743 --> 00:08:03.513 three decades after Grace Hopper’s compiler, two decades after Doug Engelbart’s first functioning system, 00:08:03.513 --> 00:08:09.806 and a decade after Alan Kay set off to work building this computer, inspired by the Dynabook ideas. 00:08:09.806 --> 00:08:14.624 This is an example of what Bill Buxton calls “the ‘Long Nose’ of Innovation”, 00:08:14.624 --> 00:08:17.071 that the early ideas behind a new technology paradigm 00:08:17.071 --> 00:08:22.879 are often seeded decades before the major commercial adoption. 00:08:22.879 --> 00:08:26.288 I’m sharing this history as we begin this course for a couple of reasons: 00:08:26.288 --> 00:08:31.542 First, seeing seminal work reminds me that good ideas are often klunkier early on. 00:08:31.542 --> 00:08:36.019 Second, as Johnny Lee and Bill Buxton point out, if you are looking for a good future product, 00:08:36.019 --> 00:08:42.523 the seeds you need may already be out there in rough form, waiting for you to polish it into a diamond. 00:08:42.523 --> 99:59:59.999 Third, I just think these early systems are totally awesome and it’s really inspiring.