用一篇文章，带你回顾桌面GUI 的设计发展史

很高能打标题，阅读这篇关于桌面应用设的文章。

阅读过我前两篇文章朋友可以看出那两篇其实分享是交互设计里常基础设计原则和跨平台规范。没，在我写作计划开始，我会努力理和结些业内知名设计原则和平台规范，和大家起「回归设计本」。

前被 YouTube 推了一个视频：《 1984: young Steve Jobs introduces the Macintosh》，仔细了一下乔布斯当演示的 Demo，发现：34年前的个人脑，在硬件、兼容、功能、性能、交互细节、视觉表现等方面今的个人脑有着非常显的差别，但不论是当年的底层系统还是面应用，它 GUI 基本要素相比今天并没有大变化。好，下从 GUI 诞生和进化来看桌应用设计有哪些基本要素。

一、GUI的发展

1973 Xerox Alto

1973年第一个可视操作的 Alto计算机在施乐帕洛阿托研究中心（Xerox PARC）成。Alto 是第一个把计算机有元素集合到一起的图形界面操作系统。它使了3键鼠标、位算显示器、图形口、太络连接。——维基百科

Alto 的继承者 Xerox Star 在1981年首次使了口设计，Xerox Star 虽然在商上没有取得成功，但当时研发团队在计算机交互界面和方式的创，为日后的普及做了卓越的贡献，如：鼠标、矩形口、滚条、按钮、桌面、面向对象编程、多任务处等。

人机交互界面设里，我们常会听到一词，就「所见即所得」的可视化交互体验，它早被运用 Alto算机的设理念之中，当时被称WYSIWYG（What You See Is What You Get）。Alto 的系统 GUI，可以对文档行创建、编辑查看，还可以不同作站之间以电子化的形式存储、调用、传输文档，也可以通过网络将文档打印出。

第个拥有 GUI 操作系统计算 Xerox Alto 及继承者 Xerox Star，首使用了窗口设计。

1979年12月，乔布在施乐 PARC 参观了 Alto，由此生了深刻印象并获常有价值启发。

他们（PARC）给我看了三样东，但我被第一件东亮瞎了，以至于我甚至看到另外两。他们向我展示的东之一面向对象编程。他们给我看了，但我 get到。他们给我看的另一实际一联网的算机系统。超过一 Alto算机使用电子邮件，我也 get到。那亮瞎我的第一件东就图形用户界面（Graphical User Interface），我认这我这辈子见过的好的东。——Steve Jobs

1983 Apple Lisa

1983年苹果计算机公司推 Apple Lisa 个人计算机，是全球第一款搭载图形户界面（GUI）的个人计算机。

1984 Macintosh

1986 X Windows System

1986年首款用于 Unix 窗口系统X Window System 发布。

1988 OS/2

OS/2由微软 IBM 公司共同创造，后由 IBM 单独发的一套操作系统。OS/2「Operating System/2」的缩写，因该系统作 IBM 第二人算机PS/2系统产品线的理操作系统引入的。

1990 Microsoft Windows 3.0

微软在1990年发行 Windows 3.0非成功。除了改进应程序的之外，利虚拟存，Windows 容许 MS-DOS 软件有更好的多任务表现。上个人电脑的图像处改良（使VGA图像卡），和使保护模式记忆模式，应程序较容易更多的存储器。从此，PC 和 Macintosh 开始一较。

1995-2018 Windows VS Mac

二、桌面应用UI设计的基本要素

回顾完 GUI 发展历史中的重时刻，我们回到本文的主题：不论当的底层系统还桌面应用，它们 GUI 的基本素相比今天并的变化，表：窗口、单、具栏、图标。

窗口

应程序为使数据而在图形户界面中设置的基本单元。应程序和数据在口实现一体。在口中，户可在口中操作应程序，进行数据的管、生成和编辑。通在口周设有菜单、图标，数据放在中央。

窗口中，根据各种数据/应用程序的内设标题栏，一般窗口的方，并其中设化、小化（隐藏窗口，并非消除数据）、面、缩（仅显示标题栏）动作按钮，可以简单对窗口行操作。——维基科

窗口桌面应用的层（操作系统它的底层），也桌面应用UI 的核元素。窗口可以被移动、、缩小的，用于置内功能的器。

从 GUI 发展历程可以看出，底层系统和桌应用在以窗口这个象和数据载体，用户传信息。

单

菜单，又称单或功表，在计算机应中是指图形使者界面（GUI）中的可户在数个有联项中择自己需要功的组件，它是人机界面中的元素之一。——维基百科

菜单通由可供择的一组字和符号组成，是一系列命令的列表。户鼠标单击中一个项后，就指定计算机执行一个特定作或功。

单一般用提供指向各种操作功能的捷途径，比如打储存文档、退出程序、操作数据。应用可以将它当作一系列常用命令的捷键，不需用户详细了解这些命令的使用语法。

大多数应用提供了下样和弹出样菜单，位常出现在应用顶部。

具栏

与菜单一样，工具栏是一种有联作的集合，户可通过工具栏供的功，对于数据、档进行功性操作。工具栏更多从属于应软件，户可通过菜单调或取消它们。

具栏如果处于活动状态，就会以一组可视图标的形式呈，可视图标通常还会配以小的文本标签。

桌面应用的具栏发展到今天，置通常出应用主窗口的顶部。很多应用允许用户根据人需自义具栏，对具栏中的按钮对象行添加、删除、调整置。

图标

在桌面中，图标常常用表示计机系统中的程序、功能、数据或数据集。应用程序的启动图标依靠别具一和显著的风，一直被为产品品牌的一个重要部分。

不论是1984年的 Macintosh 还是今的 macOS 和 Windows，用户最熟悉的打开桌面应用的方式是通鼠标点击图标来启动应用。

对桌面应用身来说，应用窗口内的工具栏和功能集合也以图标的形式表达信息。

总结

了解完 GUI 的发展史，可以清楚地发现面应用 UI计的基本要素包括：窗、菜、工栏、图标。写完这篇文章后，一直在思考这4项面 UI计的基本要素，乃至像鼠标、键盘这种息输入工，为什一直适用今的个人脑，没有发生质的变化。基于目前的认知，个人认为有这个因素：

图形化的界面能是目前最最成熟的人机互信息的载，因为我们能看到的物，其是由二空间的形，和三空间的所构成的（能还存在其他度表现形式，就不扯远）。我们之所以认识文字，是因为我们在识字时是先住形，将形与意匹、忆。因此，图形化用户界面是符合人类能的存在。

人类和物最根本的差别是么？是人类会制工具从事生产劳，而物会。因此，图形户界面里的工具栏是符合人类本的存在。
计算机编程语言和术的核心思想可能没变。（不了解计算机编程，这条是猜的）

从用户心智模型的角度来看，图形化用户界面处用户心智的平稳期，已经长时间被我们接受，我们已经习以为常，想要被打破，就得等到下一个轮回。

本涵盖的个人观点较多，如果你在这类话题上有一样的想法或观点，非一起交流。

欢迎关注作者的微信公众：「设意志」

图片素作者：Alexey Kuvaldin