Graphical User Interfaces: Crash Course Computer Science #26

Summary

本视频回顾了图形用户界面（GUI）的发展历史，从1984年苹果Macintosh个人电脑的发布开始，这是第一台带有图形用户界面和鼠标的普通消费者可以购买的电脑。视频讲述了GUI的起源，包括早期的交互式图形应用程序如Sketchpad和Spacewar!，以及道格拉斯·恩格尔巴特对现代GUI的重大贡献。恩格尔巴特在1964年与同事比尔·英格拉姆一起发明了第一台计算机鼠标。视频还介绍了Xerox Alto的开发，这是第一台真正的GUI计算机，以及Xerox Star系统，它扩展了桌面隐喻，引入了“所见即所得”（WYSIWYG）的概念。尽管Xerox Star商业上并不成功，但其创新理念对后来的计算机研究产生了深远影响。视频还讲述了苹果Lisa和Macintosh的发布，以及微软Windows的崛起，特别是Windows 95的推出，它引入了许多至今仍在使用的GUI元素。最后，视频指出尽管GUI已经无处不在，但它们并非总是完美无缺，计算机科学家和界面设计师仍在努力创造更易于使用且功能更强大的计算体验，以实现恩格尔巴特增强人类智力的愿景。

Takeaways

• 🖥️ 1984年发布的苹果Macintosh个人电脑是首款带有图形用户界面（GUI）和鼠标的个人电脑，这一创新使得非专业人士也能直观地使用电脑。
• 🌐 图形用户界面的出现是数十年研究的结果，早期的交互式图形应用如Sketchpad和Spacewar!为GUI的发展奠定了基础。
• 🧭 道格拉斯·恩格尔巴特（Douglas Engelbart）被认为是现代GUI的真正先驱，他的“增强人类智力”（Augmenting Human Intellect）报告对计算领域产生了深远影响。
• 🖱️ 1964年，恩格尔巴特与同事比尔·英格利什（Bill English）共同发明了世界上第一只计算机鼠标。
• 📈 1968年，恩格尔巴特在秋季联合计算机会议上展示了他的整个系统，这场演示被称为“所有演示之母”，展示了现代计算的许多特性。
• 📚 施乐公司（Xerox）的帕洛阿尔托研究中心（PARC）开发了第一台真正的GUI计算机——施乐Alto，它采用了桌面隐喻（Desktop Metaphor），这一概念使得用户界面更加直观易用。
• 🏢 Xerox Star系统在1981年发布，它扩展了桌面隐喻，引入了文件看起来像纸张、可存放在文件夹中等概念，并且提出了“所见即所得”（WYSIWYG）的概念。
• 💡 史蒂夫·乔布斯（Steve Jobs）在1979年访问了Xerox PARC，并受到了GUI的启发，这直接影响了苹果后续产品的设计。
• 💻 苹果的Lisa电脑是首款带有图形用户界面和鼠标的苹果产品，但由于价格昂贵，市场反响不佳。
• 📉 Macintosh电脑在1984年发布，初期销售强劲，但随后销售放缓，部分原因是缺乏软件支持。
• 💻 微软在1985年发布了Windows 1.0，随后Windows 95的推出，以其先进的GUI特性和易用性，迅速占领了市场。
• 🔄 计算机科学家和界面设计师继续努力工作，以创造更易于使用且功能更强大的计算体验，不断向恩格尔巴特增强人类智力的愿景迈进。

Q & A

苹果的Macintosh个人电脑在1984年发布时，它与当时其他个人电脑相比，最主要的革新是什么？

苹果的Macintosh个人电脑最主要的革新是它首次将图形用户界面（GUI）和鼠标引入到个人电脑中，这与当时其他个人电脑使用的命令行界面相比，是一个根本性的进步。图形用户界面通过在屏幕上展示可执行的功能，使用户能够通过“指向并点击”的方式与电脑交互，极大地提高了电脑的直观性和易用性。

图形用户界面（GUI）是如何从早期的研究成果逐渐发展起来的？

图形用户界面（GUI）的发展是多年研究的结果。早期的交互式图形应用程序如Sketchpad和Spacewar!为GUI的发展奠定了基础，但它们是单一的程序，并非集成的计算体验。Douglas Engelbart被认为是现代GUI的真正先驱。他在1962年的一份开创性报告《增强人类智力》中提出了利用计算机作为交互工具来解决复杂问题的想法，并最终创建了oN-Line系统和第一个计算机鼠标。

Douglas Engelbart在1968年的秋季联合计算机会议上展示了什么？这次展示为何被称为“所有演示之母”？

Douglas Engelbart在1968年的秋季联合计算机会议上展示了他的整个系统，包括了位图图形、视频会议、文字处理以及实时协作编辑文档等功能。这次展示持续了90分钟，展示了现代计算的许多特性，包括鼠标和多个窗口（尽管它们不能重叠）。由于其展示内容的全面性和前瞻性，这次演示被称为“所有演示之母”。

Xerox Alto是如何将桌面隐喻（Desktop Metaphor）应用到用户界面设计中的？

Xerox Alto将桌面隐喻应用到用户界面设计中，通过将2D屏幕视作桌面的顶部。就像桌面上可以放置多张纸张一样，用户可以同时打开多个计算机程序，每个程序都包含在自己的框架内，即一个窗口。这些窗口可以像桌面上的纸张一样重叠，阻挡背后的项目。此外，还有像计算器和时钟这样的桌面配件，用户可以将其放置在屏幕上并移动。这种设计让用户能够无需或几乎无需培训就能立即识别如何使用界面。

Xerox Star系统是如何进一步扩展桌面隐喻的？

Xerox Star系统通过将文件设计成纸张的样子，并能够存储在小文件夹中，进一步扩展了桌面隐喻。所有这些都可以放在你的桌面上，或者被放入数字文件柜中。从用户的角度来看，这是一种新的抽象层次。Xerox Star还引入了“剪切”、“复制”和“粘贴”等术语，这些术语借鉴了人们在打字机上编辑文档时的做法。

Steve Jobs在1979年访问Xerox PARC时，他看到了什么，这对苹果公司的产品有何影响？

Steve Jobs在1979年访问Xerox PARC时，看到了Xerox的图形用户界面在清晰的位图显示器上运行，所有操作都通过直观的鼠标输入来驱动。这次展示对Steve Jobs产生了深远的影响，他后来表示这就像是一层面纱从他眼前揭开，他能够看到计算的未来。Steve Jobs回到苹果后，与他的工程团队一起工作，发明了新特性，比如菜单栏和用于存储待删除文件的垃圾箱，垃圾箱满了甚至会膨胀。苹果的第一款带有图形用户界面和鼠标的产品是1983年发布的Apple Lisa。

为什么Apple Lisa在市场上并不成功？

Apple Lisa在市场上不成功的原因主要有两个：一是其价格极其昂贵，几乎是当时25,000美元的等价物；二是尽管Apple Lisa是一款非常先进的机器，但市场上对这种新技术的接受度并不高，导致销售不佳。

苹果的Macintosh电脑为何能够在市场上取得初步的成功？

苹果的Macintosh电脑能够在市场上取得初步成功，主要是因为其相对较低的价格（约6,000美元，是Lisa价格的四分之一）和用户友好的图形用户界面。Macintosh在最初的100天内售出了70,000台，显示出了其受欢迎的程度。

为什么最初的Windows操作系统是基于DOS的，这对用户意味着什么？

最初的Windows操作系统是基于DOS的，因为DOS是当时微软已有的操作系统，但它并不是为运行图形用户界面（GUI）而设计的。这意味着早期的Windows系统在用户界面和性能上可能不如Mac OS那样直观和流畅，因为它们需要在一个非GUI的操作系统上模拟GUI环境。

Windows 95相比于早期的Windows系统有哪些显著的改进和新特性？

Windows 95相比于早期的Windows系统进行了重大的重写，提供了不仅仅是更精细的图形界面。它还引入了Mac OS当时不具备的高级特性，如程序多任务处理和受保护的内存。此外，Windows 95引入了许多至今仍在Windows版本中看到的GUI元素，如开始菜单、任务栏和Windows Explorer文件管理器。

Microsoft Bob为何未能在市场上取得成功？

Microsoft Bob未能在市场上取得成功，主要是因为它将桌面隐喻推向了极端，创造了一个过于复杂和过度设计的用户界面。用户需要在一个虚拟房间中与各种对象互动，这些对象代表了应用程序，这种设计过于繁琐，不符合用户的使用习惯和期望，导致用户体验不佳。

图形用户界面（GUI）的发展历程中，有哪些因素导致了它们从早期的设计逐渐演化成今天的形式？

图形用户界面（GUI）的发展历程中，有许多因素导致了它们的演化。这包括技术的创新、用户需求的变化、市场竞争、以及界面设计的最佳实践。在这个过程中，许多不良的设计被尝试并最终被淘汰，而有效的设计则被保留和改进。此外，像Engelbart和Xerox PARC这样的先驱者的工作，以及苹果和微软等公司之间的竞争，都对GUI的发展产生了重要影响。

Outlines

00:00

🖥️ 图形用户界面的诞生与普及

本段介绍了图形用户界面(GUI)的发展历史。1984年苹果公司发布了第一款带有图形用户界面和鼠标的个人电脑——Macintosh，这标志着GUI的主流化。然而，GUI的起源可追溯至数十年前的研究，包括1962年的Sketchpad和Spacewar!程序。Douglas Engelbart被认为是现代GUI的真正先驱，他在1962年的报告《增强人类智力》中提出了利用计算机作为交互工具以解决复杂问题的想法，并在1964年与同事Bill English共同发明了第一台计算机鼠标。1968年，Engelbart在秋季联合计算机会议上展示了他的整个系统，这场演示被后人誉为“所有演示之母”。尽管该系统商业上并未成功，但对计算机研究者产生了巨大影响。Engelbart因此获得了1997年的图灵奖。70年代初，Engelbart团队的许多成员，包括Bill English，转而加入了施乐公司的帕洛阿尔托研究中心(Xerox PARC)。在那里，他们开发了第一台真正的GUI计算机——Xerox Alto，并于1973年完成。Xerox Alto的设计采用了桌面隐喻，使用户能够直观地理解如何使用界面。

05:01

📚 Xerox Alto与桌面隐喻的发展

Xerox Alto计算机的问世，代表了GUI设计的重要里程碑。大约制造了2000台Alto，它们在施乐公司内部和大学实验室中得到使用，但并未商业销售。PARC团队继续改进硬件和软件，最终在1981年推出了Xerox Star系统。Xerox Star扩展了桌面隐喻，文件看起来像纸张，可以存放在文件夹中，这些文件夹可以放在桌面上或收进数字文件柜。Xerox Star还引入了文字和图形创建工具的创新，包括“剪切”、“复制”和“粘贴”的概念，这些都是从人们使用打字机编辑文档时的实际操作中借鉴而来的。Xerox提出了“所见即所得”(WYSIWYG)的概念，意味着计算机上制作的内容在打印出来时应该与现实世界的版本完全相同。尽管Xerox Star技术上先进，但由于价格昂贵，销量并不理想。与此同时，IBM PC及其兼容机的推出，使得市场上出现了大量价格低廉的个人电脑。1979年12月，Steve Jobs参观了Xerox PARC，并被那里的图形用户界面所震撼。尽管有许多传言称苹果公司“窃取”了Xerox的创意，但实际上Xerox主动寻求与苹果合作，并在苹果即将进行的IPO前购买了价值一百万美元的股份，并要求苹果披露Xerox PARC的所有创新成果。Steve Jobs回到苹果后，与工程师团队一起开发了新特性，如菜单栏和垃圾桶等，最终推出了Apple Lisa，这是苹果首款带有图形用户界面和鼠标的产品，尽管技术上先进，但市场反应不佳。

10:03

💼 苹果与微软的GUI竞争及未来发展方向

随着Apple Lisa的市场失败，苹果公司推出了价格更亲民的Macintosh，这款产品在最初100天内销售了7万台，但随后销售开始下滑。主要问题是没有软件开发商为这款采用全新界面的机器开发软件。与此同时，竞争对手迅速迎头赶上，其他个人电脑也开始配备虽然原始但可用的图形用户界面，并且价格更低。苹果的财务状况日益严峻，Steve Jobs与新任CEO John Sculley之间的紧张关系加剧，导致Jobs被迫离开苹果。不久之后，微软发布了Windows 1.0，虽然在美观上不及Mac OS，但这标志着微软在个人电脑行业的激烈竞争和近乎垄断的开始。十年内，微软Windows几乎运行在95%的个人电脑上。微软在Windows 3.1之后开始开发新的面向消费者的操作系统，并推出了具有改进GUI的Windows 95，引入了多任务处理和受保护的内存等高级功能。Windows 95引入了许多至今仍在使用的GUI元素，如开始菜单、任务栏和Windows资源管理器。微软并非无懈可击，它曾尝试通过一个名为Microsoft Bob的产品使桌面隐喻更易于理解和友好，但该产品并未成功。今天的GUI设计是经过自然选择的产物，无论是Windows、Mac、Linux还是其他桌面GUI，几乎都是Xerox Alto首次引入的WIMP范式的演变版本。在这个过程中，许多糟糕的想法被尝试、测试、改进、采纳或放弃。尽管GUI无处不在，但它们并不总是完美的。计算机科学家和界面设计师继续努力工作，以打造更易于使用且功能更强大的计算体验，以实现Engelbart增强人类智力的愿景。

Keywords

💡图形用户界面（GUI）

图形用户界面（Graphical User Interface, GUI）是指使用图形化方式，通过视觉元素如图标、菜单和窗口等与用户进行交互的界面。在视频中，GUI的引入是计算机发展史上的一次重大突破，它使得非专业人士也能直观地使用计算机，而不需要记住复杂的命令行指令。例如，苹果的麦金塔电脑是首款带有GUI和鼠标的个人电脑，极大地提高了计算机的易用性。

💡Macintosh

Macintosh是苹果公司在1984年发布的个人电脑，它首次将GUI和鼠标引入到普通消费者可购买的电脑中。Macintosh的发布标志着GUI主流化，尽管GUI的研究和开发已经有数十年的历史。在视频中，Macintosh被视为推动GUI普及的关键产品，它使得计算机操作变得更加直观和用户友好。

💡道格拉斯·恩格尔巴特（Douglas Engelbart）

道格拉斯·恩格尔巴特是计算机科学家，被誉为现代GUI的真正先驱。在第二次世界大战期间，恩格尔巴特受到Vannevar Bush关于Memex概念的启发，后来他在加州大学伯克利分校完成了博士学位，并在1962年发表了题为《增强人类智力》的开创性报告。恩格尔巴特预见到计算机不仅是自动化工具，还可以成为解决复杂问题的重要交互工具。他在1964年与同事比尔·英格里希共同发明了第一个计算机鼠标。

💡Xerox Alto

Xerox Alto是施乐公司帕洛阿尔托研究中心（Xerox PARC）在1973年开发的第一台真正的GUI计算机。Alto的设计采用了桌面隐喻，将2D屏幕视作桌面的顶部，用户可以像在真实桌面上一样同时打开多个程序窗口。Alto团队使用了窗口、图标、菜单和指针（WIMP界面）来设计界面，这是大多数现代桌面GUI的基础。Alto的开发对后来的计算机界面设计产生了深远的影响。

💡事件驱动编程

事件驱动编程是一种编程范式，其中代码的执行是由一系列事件触发的，而不是简单的从上到下顺序执行。在GUI应用中，这种编程方式尤为重要，因为用户的操作（如点击按钮、选择菜单项）会触发特定的事件，然后相应的事件处理器会被调用以响应这些事件。在视频中，当用户点击“roll”按钮时，会随机生成一个数字并显示在文本框中，这就是事件驱动编程的一个例子。

💡桌面隐喻（Desktop Metaphor）

桌面隐喻是一种用户界面设计概念，它将计算机的2D屏幕比作桌面，用户可以在屏幕上打开多个窗口，每个窗口都像是桌面上的一张纸，可以重叠，模拟了真实世界中办公桌的使用方式。这种隐喻使得用户能够直观地理解如何在计算机上组织和操作文件和应用程序。在视频中，Xerox Alto的设计采用了桌面隐喻，极大地提升了用户界面的易用性。

💡窗口（Window）

在GUI中，窗口是一个矩形区域，它提供了对应用程序的视图，用户可以通过窗口与应用程序进行交互。窗口可以包含文本、按钮和其他控件，并且可以重叠，模拟了现实世界中纸张的堆叠。在视频中，窗口是构成GUI的基本元素之一，用户可以在窗口中执行各种任务，如文本编辑、数据处理等。

💡WIMP界面

WIMP是窗口（Windows）、图标（Icons）、菜单（Menus）和指针（Pointer）的缩写，它描述了一种常见的图形用户界面设计范式。WIMP界面使用户能够通过窗口来管理应用程序和文档，通过图标来表示应用程序或文件，通过菜单来进行命令选择，以及通过指针来指向和选择屏幕上的项目。在视频中，Xerox Alto的开发团队采用了WIMP界面设计，对后来的GUI设计产生了深远的影响。

💡Xerox Star

Xerox Star是施乐公司在1981年发布的计算机系统，它扩展了桌面隐喻的概念，文件看起来像纸张，可以存储在文件夹中，这些文件夹可以放在桌面上或放入数字文件柜中。Xerox Star还引入了剪切、复制和粘贴的概念，这些都是从人们在打字机上编辑文档的实际操作中借鉴来的。尽管Xerox Star在技术上非常先进，但由于其高昂的价格，销量并不理想。

💡What-You-See-Is-What-You-Get（WYSIWYG）

What-You-See-Is-What-You-Get（WYSIWYG）是一种用户界面设计理念，意味着用户在屏幕上看到的内容就是最终打印或输出的样子。施乐公司的研究人员提出了这个概念，它极大地提高了文本和图形创建工具的效率。WYSIWYG界面使用户能够即时看到他们的编辑和格式更改，而不需要像以前那样通过多次打印和复印来确认结果。在视频中，WYSIWYG是Xerox Star系统的一个重要特性，它影响了后来的文字处理软件和图形设计工具。

💡Steve Jobs

Steve Jobs是苹果公司的联合创始人之一，他在1979年访问了施乐PARC，并被那里的图形用户界面所震撼。Steve Jobs认识到了GUI在个人计算机上的潜力，并将其理念带回苹果公司，推动了Macintosh的开发。尽管有关他“窃取”Xerox想法的说法，但实际上Xerox是主动接触苹果公司寻求合作的。Steve Jobs的这次访问对苹果公司的产品开发产生了深远的影响，也对整个个人计算机行业产生了重要影响。

Highlights

1984年发布的苹果Macintosh个人电脑是第一台带有图形用户界面和鼠标的电脑，这与当时其他个人电脑的命令行界面相比是一个巨大的进步。

图形用户界面（GUI）的出现使得普通人无需记住命令，只需通过“指向并点击”的方式与电脑互动，极大地提高了计算机的直观性。

Macintosh推动了GUI的普及，但其背后是几十年的研究结果。

道格拉斯·恩格尔巴特（Douglas Engelbart）被认为是现代GUI的真正先驱，他提出了增强人类智力的概念。

1964年，恩格尔巴特与同事比尔·英格利希（Bill English）共同发明了世界上第一台计算机鼠标。

1968年，恩格尔巴特在秋季联合计算机会议上展示了他的整个系统，这场演示被称为“所有演示之母”。

施乐公司（Xerox）的帕洛阿尔托研究中心（Xerox PARC）开发了第一台真正的GUI计算机——Xerox Alto，完成于1973年。

Xerox Alto团队采用了窗口、图标、菜单和指针（WIMP界面）的设计，这是大多数现代桌面GUI的基础。

Xerox Star系统在1981年发布，扩展了桌面隐喻，文件看起来像纸张，可以存放在文件夹中。

Xerox Star引入了“所见即所得”（WYSIWYG）的概念，使得计算机上制作的内容在打印出来时与真实世界版本完全相同。

苹果公司的Steve Jobs在1979年访问了Xerox PARC，并受到GUI的启发，这直接影响了后来苹果产品的设计。

苹果的第一台带有图形用户界面和鼠标的产品是1983年发布的Apple Lisa，但由于价格昂贵，市场反响不佳。

1984年发布的Macintosh电脑以更低的价格取得了初步成功，但随后销售开始下滑，部分原因是缺乏软件支持。

微软在1985年发布了Windows 1.0，虽然不如Mac OS美观，但它标志着微软在GUI领域的起步。

Windows 95引入了许多至今仍在使用的GUI元素，如开始菜单、任务栏和Windows Explorer文件管理器。

微软的Microsoft Bob尝试将隐喻推向极致，通过创建一个虚拟房间和可互动的对象来简化桌面隐喻，但最终并未成功。

今天的GUI是WIMP范式的演变版本，许多糟糕的想法经过测试和失败后被淘汰，而好的设计得以保留和改进。

计算机科学家和界面设计师继续努力工作，以创造更易于使用且功能更强大的计算体验，以实现恩格尔巴特增强人类智力的愿景。

Transcripts

Hi, I’m Carrie Anne, and welcome to CrashCourse Computer Science!

We ended last episode with the 1984 release of Apple’s Macintosh personal computer.

It was the first computer a regular person could buy with a graphical user interface

and a mouse to interact with it.

This was a radical evolution from the command line interfaces found on all other personal

computers of the era.

Instead of having to remember... or guess... the right commands to type in, a graphical

user interface shows you what functions are possible.

You just have to look around the screen for what you want to do.

It’s a “point and click” interface.

All of a sudden, computers were much more intuitive.

Anybody, not just hobbyists or computer scientists, could figure things out all by themselves.

INTRO

The Macintosh is credited with taking Graphical User Interfaces, or GUIs, mainstream, but

in reality they were the result of many decades of research.

In previous episodes, we discussed some early interactive graphical applications, like Sketchpad

and Spacewar!, both made in 1962.

But these were one-off programs, and not whole integrated computing experiences.

Arguably, the true forefather of modern GUIs was Douglas Engelbart.

Let’s go to the thought bubble!

During World War 2, while Engelbart was stationed in the Philippines as a radar operator, he

read Vannevar Bush’s article on the Memex.

These ideas inspired him, and when his Navy service ended, he returned to school, completing

a Ph.D. in 1955 at U.C.

Berkeley.

Heavily involved in the emerging computing scene, he collected his thoughts in a seminal

1962 report, titled: “Augmenting Human Intellect”.

Engelbart “believed that the complexity of the problems facing mankind [was] growing

faster than our ability to solve them.

Therefore, finding ways to augment our intellect would seem to be both a necessary and a desirable

goal."

He saw that computers could be useful beyond just automation, and be essential interactive

tools for future knowledge workers to tackle complex problems.

Further inspired by Ivan Sutherland’s recently demonstrated Sketchpad, Engelbart set out

to make his vision a reality, recruiting a team to build the oN-Line System.

He recognized that a keyboard alone was insufficient for the type of applications he was hoping

to enable.

In his words: "We envisioned problem-solvers using computer-aided working stations to augment

their efforts.

They required the ability to interact with information displays using some sort of device

to move [a cursor] around the screen."

And in 1964, working with colleague Bill English, he created the very first computer mouse.

The wire came from the bottom of the device and looked very much like a rodent and the

nickname stuck.

Thanks thought bubble!

In 1968, Engelbart demonstrated his whole system at the Fall Joint Computer Conference,

in what’s often referred to as “the mother of all demos”.

The demo was 90 minutes long and demonstrated many features of modern computing: bitmapped

graphics, video conferencing, word processing, and collaborative real-time editing of documents.

There were also precursors to modern GUIs, like the mouse and multiple windows – although

they couldn’t overlap.

It was way ahead of its time, and like many products with that label, it ultimately failed,

at least commercially.

But its influence on computer researchers of the day was huge.

Engelbart was recognized for this watershed moment in computing with a Turing Award in

1997.

Federal funding started to reduce in the early 1970s, which we discussed two episodes ago.

At that point, many of Engelbart’s team, including Bill English, left and went to Xerox's

newly formed Palo Alto Research Centre, more commonly known as Xerox PARC.

It was here that the first true GUI computer was developed: the Xerox Alto, finished in

1973.

For the computer to be easy to use, it needed more than just fancy graphics.

It needed to be built around a concept that people were already familiar with, so they

could immediately recognize how to use the interface with little or no training.

Xerox’s answer was to treat the 2D screen like the top of a desk… or desktop.

Just like how you can have many papers laid out on a desk, a user could have several computer

programs open at once.

Each was contained in their own frame, which offered a view onto the application – called

a window.

Also like papers on a desk, these windows could overlap, blocking the items behind them.

And there were desk accessories, like a calculator and clock, that the user could place on the

screen and move around.

It wasn’t an exact copy of a desktop though.

Instead, it was a metaphor of a desktop.

For this reason, surprisingly, it’s called the Desktop Metaphor.

There are many ways to design an interface like this, but the Alto team did it with windows,

icons, menus, and a pointer – what’s called a WIMP interface.

It’s what most desktop GUIs use today.

It also offered a basic set of widgets, reusable graphical building blocks...things like buttons,

checkboxes, sliders, and tabs which were also drawn from real world objects to make them

familiar.

GUI applications are constructed from these widgets, so let’s try coding a simple example

using this new programming paradigm.

First, we have to tell the operating system that we need a new window to be created for

our app.

We do this through a GUI API.

We need to specify the name of the window and also its size.

Let’s say 500 by 500 pixels.

Now, let’s add some widgets – a text box and a button.

These require a few parameters to create.

First, we need to specify what window they should appear in, because apps can have multiple

windows.

We also need to specify the default text, the X and Y location in the window, and a

width and height.

Ok, so now we’ve got something that looks like a GUI app, but has no functionality.

If you click the “roll” button, nothing happens.

In previous examples we’ve discussed, the code pretty much executes from top to bottom.

GUIs, on the other hand, use what’s called event-driven programming; code can fire at

any btime, and in different orders, in response to events.

In this case, it’s user driven events, like clicking on a button, selecting a menu item,

or scrolling a window.

Or if a cat runs across your keyboard, it’s a bunch of events all at once!

Let’s say that when the user clicks the “roll” button, we want to randomly generate

a number between 1 and 20, and then show that value in our text box.

We can write a function that does just that.

We can even get a little fancy and say if we get the number 20, set the background color

of the window to blood red!

The last thing we need to do is hook this code up so that it’s triggered each time

our button is clicked.

To do this, we need to specify that our function “handles” this event for our button, by

adding a line to our initialize function.

The type of event, in this case, is a click event, and our function is the event handler

for that event.

Now we’re done.

We can click that button all day long, and each time, our “roll D20” function gets

dispatched and executed.

This is exactly what’s happening behind the scenes when you press the little bold

button in a text editor, or select shutdown from a dropdown menu – a function linked

to that event is firing.

Hope I don’t roll a 20. Ahhhh!

Ok, back to the Xerox Alto!

Roughly 2000 Altos were made, and used at Xerox and given to University labs.

They were never sold commercially.

Instead, the PARC team kept refining the hardware and software, culminating in the Xerox Star

system, released in 1981.

The Xerox Star extended the desktop metaphor.

Now, files looked like pieces of paper, and they could be stored in little folders, all

of which could sit on your desktop, or be put away into digital filing cabinets.

It’s a metaphor that sits ontop of the underlying file system.

From a user’s perspective, this is a new level of abstraction!

Xerox, being in the printing machine business, also advanced text and graphics creation tools.

For example, they introduced the terms: cut, copy and paste.

This metaphor was drawn from how people dealt with making edits in documents written on

typewriters.

You’d literally cut text out with scissors, and then paste it, with glue, into the spot

you wanted in another document.

Then you’d photocopy the page to flatten it back down into a single layer, making the

change invisible.

Thank goodness for computers!

This manual process was moot with the advent of word processing software, which existed

on platforms like the Apple II and Commodore PET.

But Xerox went way beyond the competition with the idea that whatever you made on the

computer should look exactly like the real world version, if you printed it out.

They dubbed this What-You-See-Is-What-You-Get or WYSIWYG.

Unfortunately, like Engelbart’s oN-Line System, the Xerox Star was ahead of its time.

Sales were sluggish because it had a price tag equivalent to nearly $200,000 today for

an office setup.

It also didn’t help that the IBM PC launched that same year, followed by a tsunami of cheap

“IBM Compatible” PC Clones.

But the great ideas that PARC researchers had been cultivating and building for almost

a decade didn’t go to waste.

In December of 1979, a year and a half before the Xerox Star shipped, a guy you may have

heard of visited: Steve Jobs.

There’s a lot of lore surrounding this visit, with many suggesting that Steve Jobs and Apple

stole Xerox’s ideas.

But that simply isn’t true.

In fact, Xerox approached Apple, hoping to partner with them.

Ultimately, Xerox was able to buy a million dollar stake in Apple before its highly anticipated

I.P.O. -but it came with an extra provision: “disclose everything cool going on at Xerox

PARC".

Steve knew they had some of the greatest minds in computing, but he wasn’t prepared for

what he saw.

There was a demonstration of Xerox’s graphical user interface, running on a crisp, bitmapped

display, all driven with intuitive mouse input.

Steve “later said, “It was like a veil being lifted from my eyes.

I could see the future of what computing was destined to be.”

Steve returned to Apple with his engineering entourage, and they got to work inventing

new features, like the menu bar and a trash can to store files to be deleted; it would

even bulge when full - again with the metaphors.

Apple’s first product with a graphical user interface, and mouse, was the Apple Lisa,

released in 1983.

It was a super advanced machine, with a super advanced price – almost 25 thousand dollars

today.

That was significantly cheaper than the Xerox Star, but it turned out to be an equal flop

in the market.

Luckily, Apple had another project up its sleeve: The Macintosh, released a year later,

in 1984.

It had a price of around 6,000 dollars today – a quarter of the Lisa’s cost.

And it hit the mark, selling 70,000 units in the first 100 days.

But after the initial craze, sales started to falter, and Apple was selling more of its

Apple II computers than Macs.

A big problem was that no one was making software for this new machine with it’s new radical

interface.

And it got worse.

The competition caught up fast.

Soon, other personal computers had primitive, but usable graphical user interfaces on computers

a fraction of the cost.

Consumers ate it up, and so did PC software developers.

With Apple’s finances looking increasingly dire, and tensions growing with Apple’s

new CEO, John Sculley, Steve Jobs was ousted.

A few months later, Microsoft released Windows 1.0.

It may not have been as pretty as Mac OS, but it was the first salvo in what would become

a bitter rivalry and near dominance of the industry by Microsoft.

Within ten years, Microsoft Windows was running on almost 95% of personal computers.

Initially, fans of Mac OS could rightly claim superior graphics and ease-of-use.

Those early versions of Windows were all built on top of DOS, which was never designed to

run GUIs.

But, after Windows 3.1, Microsoft began to develop a new consumer-oriented OS with upgraded

GUI called Windows 95.

This was a significant rewrite that offered much more than just polished graphics.

It also had advanced features Mac OS didn’t have, like program multitasking and protected

memory.

Windows 95 introduced many GUI elements still seen in Windows versions today, like the Start

menu, taskbar, and Windows Explorer file manager.

Microsoft wasn’t infallible though.

Looking to make the desktop metaphor even easier and friendlier, it worked on a product

called Microsoft Bob, and it took the idea of using metaphors to an extreme.

Now you had a whole virtual room on your screen, with applications embodied as objects that

you could put on tables and shelves.

It even came with a crackling fireplace and a virtual dog to offer assistance.

And you see those doors on the sides?

Yep, those went to different rooms in your computer where different applications were

available.

As you might have guessed, it was not a success.

This is a great example of how the user interfaces we enjoy today are the product of what’s

essentially natural selection.

Whether you’re running Windows, Mac, Linux, or some other desktop GUI, it’s almost certainly

an evolved version of the WIMP paradigm first introduced on the Xerox Alto.

Along the way, a lot of bad ideas were tried, and failed.

Everything had to be invented, tested, refined, adopted or dropped.

Today, GUIs are everywhere and while they’re good, they are not always great.

No doubt you’ve experienced design-related frustrations after downloading an application,

used someone else’s phone, or visited a website.

And for this reason, computer scientists and interface designers continue to work hard

to craft computing experiences that are both easier and more powerful.

Ultimately, working towards Engelbart's vision of augmenting human intellect.

I’ll see you next week.