Windows 设计史 03 | Windows XP：摆脱机械，拥抱自然

上期补充：在完成 Windows 设计史（二）后，我才注意到微软文档库中对当时「Neptune」项目的「活动中心」中所采用的「引导式导航（上期文章中称为「感应式导航」）」有更为详细具体的介绍，各位感兴趣的可以看看：

关联阅读：

前言

上期文章宕开一笔，回顾了微软在 20 世纪 90 年末进行的「操作系统网页化」和尝试构建「以任务为中心」的试验，这些努力大都无果而终，未能为 Windows 的用户界面带来彻底的变革。这期我们回到现实，看看 Windows 于 Win95 后在界面设计上还面临了哪些亟需解决的现实问题。问题之一也是在上期文章中缺席的一块内容：Windows 的视觉风格。

文章如有疏漏之处还请各位谅解并及时指出，也谢谢各位对本系列的支持。

设计风格的缺席

我在 Windows 设计史（一）中提到了 Windows 界面设计的许多方面，但其实还漏了一个方面：Windows 的设计风格。确实，同当时的许多操作系统一样，Windows 95 之后几年 Windows 的设计风格乏善可陈，也没逃出那种灰暗、机械的风格，按钮棱角分明，边框突出。虽然 Windows 也提供了诸如修改标题栏、按钮等颜色的选择，但不能从整体上摆脱设计风格的机械感。

随着 Windows 95 的发布，微软注意到了设计对于操作系统的重要性。同时微软也逐渐意识到，当时的这种机械感强、冷冰冰的视觉风格会让用户无所适从，拉开操作系统与用户的距离，进而削弱 Windows 的用户友好程度。进入世纪之交，苹果等系统都已开始走上了摆脱旧设计，探索新美学的道路，微软决定跟上这股潮流。

Windows 的「Whistler」项目就是在这样的背景下进行的。同时它还肩负着一个任务：统一 Windows 的 9x（面向普通消费者）和 NT（面向商业、企业、服务器端）两条生产线，构建以 Windows NT 为内核但面向主流消费者的版本。

摆脱机械，拥抱自然

在大学毕业后，Gregory Raiz 加入了微软，参与设计 Windows 用户界面的外观。他最初参与的正是我前文介绍的「Neptune」项目，虽然「Neptune」无果而终，但这一项目仍然提供了对于未来用户界面设计的一些方向。

在可用性测试中，Gregory 等人发现，虽然 Windows 用户在完成个人任务方面有着更高的成功率，但当被问及他们最喜欢的计算机以及他们认为对用户更友好的系统时，他们始终更倾向 Mac。当时苹果已经推出了 iMac G3，其一大亮点便是机身的半透明弧形外观，这大大提升了计算机的用户友好程度。当时苹果的 Mac OS 也有着更加柔和自然的的光影变化，整体上也显得更为亲近用户。下一代 Windows 作为合并 NT 和 9x 两大生产线的操作系统，意味着在Windows NT 适用于商业和企业用户的基础上，还需要增加适当的娱乐性以吸引普通用户。

于是，设计团队将「力求让操作系统体验更加友好」作为下一版 Windows 的设计目标。

在进一步研究之后，团队意识到融入自然元素可以使 Windows 变得不那么机械。于是，团队确立了下一版 Windows 的设计理念：摆脱「机械」的僵化和灰暗的视觉感，让操作系统感觉更「自然」。

下文将介绍 Windows 在世纪之交对于设计风格的一系列探索。然而，在这段历史中，还交织着一段看似与那一时代无关的一种风格：扁平化。

Windows 扁平化的开始？

据雷蒙德·陈的文章《诱饵视觉风格（The decoy visual style）》，在最终的视觉风格设计完成之前，为了分散公众注意力，微软制作了一些其他主题向公众展示，这些主题被称为「Mallard（本意为「野鸭」，也可指捕猎用的野鸭形状的诱饵模型）」。

Chartreuse Mongoose in build 2419 — 「Mallard」主题（黄绿色配色方案）

但考虑到实际被命名的「Mallard」主题只在「Whistler」项目中出现了很短的时间，因此雷蒙德·陈所说的「Mallard」主题可能也包括在「Whistler」项目前期采用的「Watercolor（水彩）」主题。

尽管这些主题只是所谓的「诱饵」，它们似乎都展现了 Windows 视觉风格的新趋向：弱化按钮等控件的突出感；主题颜色的选择上则采用蓝色、黄绿色等更为明亮的颜色，抛弃了过去灰暗的色调。这一风格与当时「Neptune」项目的概念设计也是一脉相承。

除了桌面，这种风格还反映在操作系统的其他地方，比如登录界面，并没有多少突出的按钮等控件，取而代之的是「文本」占据了中心位置。

启动界面也抛弃了前代 Windows 2000 的机械进度条样式和 Win95 式的加载条，新设计不断涌现：Beta 1 采用了点状加载条；Beta 2 则用上了经典四色加载条，显得更为活泼（个人最喜欢的 Windows 启动界面之一，可惜并未出现在正式版中）。

这种弱化突出效果，更加简洁、平面化的设计在微软当时的其他一些产品中也能见到。（比如下图所示的 Microsoft Money 2000。）

你也许已经注意到了，这与 Windows 在十年后采用的所谓「扁平化」的设计较为相似。

为什么这一时期 Windows 的设计风格会有这种转向？雷蒙德·陈在其博客文章《Windows UI「睫毛膏」的演变（The evolution of mascara in Windows UI）》中提出了他的看法。他指出，Windows 自 Windows 3.0 起便引入了 3D 视觉元素，并在 Win95 时大量采用。然而，3D 元素的过多使用也带来了一些不好的结果，雷蒙德·陈形容道，「对话框上的按钮有太多浓重的黑色轮廓，看起来像是刷了很差的睫毛膏。」

为抑制这种对 3D 元素的滥用，微软开始有意的减少界面的 3D 效果，转而在界面元素之间使用「更微妙的分隔线。分隔线变得更柔和，有时甚至完全消失」，向 2D 转变，于是就出现了微软 2000 年前后这种「平面化」的设计趋向。

下面展示了两个版本的 Microsoft Word，可以直观地看出，Word 95 的工具栏等处采用的还是 3D 突起按钮，而到了 Word 97 已经改为了 2D 按钮，只在鼠标点击后显示按下效果。

插曲：Candy 主题

随着时间的推移，当时「Whistler」项目里的更多主题逐渐被揭开。其中一个主题名叫「Candy（糖果）」，制作时间大概在 2000 年 6-8 月。

这个主题长什么样呢？虽然标题栏按钮等元素的设计与当时的「水彩」主题差异不大，但内部按钮、滚动条等设计却与当时苹果的 Aqua 界面非常相似。不过据推测该主题仅用于测试用途，微软最终并没有（估计也不会）将其内置进最终版本中。

不过正如我上文所述，上面这些主题（Candy 除外，它并未实际应用）都成了所谓的「诱饵」，真正「胜出」的，是一个叫「Luna（月神）」的主题。

Luna：「蓝天绿草」还是「塑料玩具」？

「Luna」主题的原型设计始于 1999 年，于 2001 年 1 月在 CES 2001 会议上正式亮相。最终版本的主题以蓝色和绿色作为默认配色，另有「银色」和「橄榄绿」配色方案。「蓝色」喻指「蓝天」，「绿色」喻指「绿草」，契合 Windows「贴近自然」的设计理念。

Windows XP build 2600 中的 Luna — Luna 最终版本（默认蓝绿配色方案）

微软在《Windows XP 视觉指南（下文简称《指南》）》里用 4 个词概括了 Windows 的新设计风格：清新、向往、多彩和简单。《指南》中还写道，「标题栏和任务栏具有柔软的塑料感，鼠标悬停时按钮会亮起，邀请您单击它们。微妙的三维按钮和控件使用颜色和光线来提供更好的反馈。微妙的渐变和发光则为背景和工具栏增添了深度和丰富性。」「丰富的蓝色调色板加上绿色、红色和黄色的点缀定义了 Windows 的新默认外观。颜色用于提高可发现性并传达按钮的含义，例如绿色的「开始」按钮和红色的「关闭」按钮。告别灰色，迎接更智能、友好的颜色。」

不过，尽管微软表示「一旦您使用了 Windows 的新外观和感觉，您就再也不想回到 Windows 经典（Classic）主题了」，但也不是所有用户都能接受 Luna 界面。一些用户和媒体将 Luna 形容为「费雪玩具」¹，认为它塑料感太强，设计略显幼稚。对此微软也提供了替代方案：Windows XP 仍然保留了前代的「经典」主题，同时微软也在其官方网站上提供了多种主题。

除此之外，微软也更新了 Windows 的主题引擎，降低了第三方制作 Windows 主题的难度。不过尽管如此，仍须通过修补系统文件 uxtheme.dll 使 Windows 接受非微软签名的主题，才能采用第三方主题。

与主题相适应，系统内部的图标也经过了重新设计。新图标采用 48×48 像素，以 32 位颜色呈现，并提供 8 位透明度。与前代相比 Windows XP 的图标绘制得更细致，有着全新的光影效果，色彩也更为丰富亮丽。但也正如 Marcin Wichary 在文章《一千平方像素的画布》所言，许多图标采用的颜色过于相近，因此「（颇具讽刺意味的是）就像 Windows 1.0 的情况一样，很难区分一排排看起来相似的蓝色倾斜形状，尤其是当图标缩小时。」

走失的「扁平化」

对比「水彩」主题，Luna 的原始设计与最终的 Luna 主题，其中似乎存在一些细微的差异：「扁平化」是不是变少了？尽管雷蒙德·陈称「Windows XP 也加入了「扁平就是好」的潮流（比如文件资源管理器「任务窗格」的设计）」，但最终的 Luna 似乎减少了扁平元素的采用，微软在《指南》中也用了「3D 按钮」等词语描述 Luna，而如今我们在谈论 Windows XP 时似乎也仍将其归为「拟物化 3D 设计」，而非「扁平化设计」。原因何在？

关于这一点，目前网上我并未找到十分详细的解释。一种说法认为，在当时的时代背景下，仍有相当一部分人没接触过电脑，因此计算机的界面仍然需要模拟现实环境才能使较多用户适应，某种意义上，「拟物化 3D 设计」在当时仍然是不可或缺的。因此，尽管微软做了类似「扁平化」设计的尝试，但并不能完全脱离拟物化设计。而当时的多数操作系统仍是朝着拟物化设计去努力，苹果 Mac OS X 新推出的 Aqua 界面更是将拟物化设计推向了一个新的高度。

就连微软自己，在 Windows XP 之后也走上了同样的道路。雷蒙德·陈在他的那篇文章（写于 2004 年）结尾写道，「谁知道这种（扁平化）视觉表达方式还能占据主导地位多久。当人们厌倦了平面的僵硬感时，3D 会强势回归吗？」，事实证明，他的预感最终在 Windows XP 的下一代成为了现实。

当然，这是后话了。

而扁平化也并没有从 Windows 中完全消失，而是继续出现在了 Media Center 等微软产品中，若隐若现，若即若离。直到约十年后，它才有了属于自己的名称——「Metro²」

Media Center/Remote View — Windows XP Media Center

告别纯色背景：自然之「极乐」

尽管 Windows 3.x 中便以支持设置桌面壁纸，但后面的 Windows 9x 仍采用纯色作为默认壁纸，NT 系列也只是简单的以 Windows 徽标作为壁纸（Windows 2000 甚至也采用纯色）。

在「Whistler」项目中，为了凸显 Windows 的个性，微软决定选一张真正的照片作为下一版 Windows 的默认壁纸。那么新壁纸该以什么为主题呢？微软想到了大自然。柔和的自然元素能有助于减少系统的机械感，使系统看起来对用户更友好。而当时的 Windows 的设计经理 Rob Girling 进行了用户研究，发现人们确实普遍偏爱风景壁纸。

那么该选什么风景呢？此时，摄影师 Charles O'Rear，以及他拍摄的一张草地的照片进入了微软的视线。这张草地的照片是 1996 年 1 月 O'Rear 拜访女友 Daphne Irwin 时在加州索诺玛（Sonoma）高速公路旁拍下的，原名是「Bucolic Green Hills」。

Windows XP 的产品设计主管 Jen Shetterly 看上了这张照片。它不仅符合 Luna 的配色需求，同时也与自 Windows 95 起「云」主题元素的采用不谋而合。于是 2000 年，微软通过 Corbis 联系 O'Rear 购买这张照片，照片到手后微软将其命名为「Bliss（极乐）」。³

除了「Bliss」之外，同样由 Charles O'Rear 拍摄的「红月沙漠（Red Moon Desert）」也曾被用作 Windows XP 的默认壁纸（后成为 Windows XP 内置壁纸之一）。据 Girling 说，他还计划在 Windows XP 专业版中使用办公楼的照片作为默认壁纸，但这个想法被微软高层否决了，可能是因为当时「Bliss」大量出现在 Windows 的营销中。

「Bliss」壁纸成为 Windows 史上最为著名的壁纸之一，甚至也成为 Windows 的标志形象之一。同时，「Bliss」的诞生也结束了 Windows 桌面默认采用纯色背景的历史。从此以后，壁纸也成为了 Windows 展现设计特色的一个重要的舞台，各个版本的设计风格也都通过壁纸得到了很好的体现。

后续：就在 Charles O'Rear 在加州索诺玛县拍下 Bliss 的 27 年后，另一操作系统的设计团队踏上了这片土地，「索诺玛」也成为了这一操作系统新版本的名称和壁纸取景地——macOS Sonoma。
macOS Sonoma

鲜明的「旗帜」：徽标的变化

为了匹配 Windows 的新设计风格，徽标（Logo）也需要做一定的转变。于是微软委托 Frog Design 为新版本 Windows 设计徽标。（顺带一提，这家设计公司也参与过早期苹果电脑的设计。）

微软要求，「Windows 徽标需要保持其在悠久历史中积累的品牌资产，同时也要向更灵活、用户友好的品牌演变」。Frog Design 认为，原徽标经典的四色排列既代表着「打开世界的窗口」，也代表着「探索和发现的旗帜」，新徽标也应该朝这一方向设计。于是，Frog Design 团队设计了 50 个新徽标，既有偏向「窗口」的，也有偏向「旗帜」的。最终，由 Cathy Potter 设计的 3 种徽标被选中交给微软。新徽标完成了从机械方形旗帜到飘扬的自然旗帜的转向，契合 Windows「自然」的设计理念。

除了徽标之外，Frog Design 还为 Windows XP 设计了媒体播放器（Media Player）等组件的界面。

之后，这一旗帜形状的徽标一直使用了约十年（之后只在视觉效果上略有改动），直到另一位设计师发出了「灵魂拷问」：你的名字是「Windows（窗户）」，为什么徽标要用旗帜？

当然，这是后话了。

「eXPerience」

2001 年 10 月 25 日，新一代 Windows —— Windows XP 正式发布。「XP」这一名称来自英文「eXPerience（体验）」，显然，这个版本的变化就集中在用户的「体验」上。

Windows XP 宣传画 "eXPerience the excitement!"

除了前文所述设计风格的改变之外，微软还对 Windows XP 用户界面的其他部分进行了调整。

开始菜单变为了双列式，左侧会显示用户最近使用的程序，用户也可选择固定常用程序，提高了用户查找程序的速度。

任务栏引入了分组功能，同一程序的不同窗口可以合并，减少了任务栏空间占用。

还有一些细节，比如，「开始」按钮延伸到了屏幕角落，允许直接单击任务栏一角来激活菜单，应用了「菲茨定律⁴」。

控制面板借鉴了 Neptune 项目中采用的「引导式导航」的概念，以「任务」来编排设置项目。用户也可以选择切换为曾经的「经典」视图，直接显示全部选项。类似的设计也出现在文件资源管理器的「任务窗格」中。

另外还有一个细节就是：自 Windows XP 开始，系统安装完成后桌面上默认只有一个「回收站」图标。不过可能是受非原版 Windows 影响，不少人可能仍然还有「Windows XP 及之后很长一段时间 Windows 桌面上仍默认有『我的电脑』项目」的误解。

结尾：从「别人想要」到「我想要」

在雷蒙德·陈的博客中有一篇很有意思的文章，《Luna 的外观（The look of Luna）》。其中谈到，在对 Luna 界面进行用户测试时，人们对 Luna 的反应通常是「哇，这对 XX 来说会是一个很棒的 UI」，其中 XX 可能是「我爸爸」「我的员工」或「我女儿」。雷蒙德·陈写道，「人们并不认为自己会认可这套 UI；相反，他们认为别人会接受这套 UI。」这促使 Windows 的设计团队继续思考 Windows 界面的设计方向，并在 Windows XP 之后的 Windows 中进行了探索。令人欣慰的是，新界面获得了人们的认同，人们面对新 UI 的反应是：「哇，这对我来说会是一个很棒的 UI。」这套 UI 是什么呢？就是下期的主角——「Aero」。

当然，关于 Windows XP 的下一代（代号「Longhorn」）可聊的点远不止「Aero」，作为 Windows 历史上开发周期最长的一代系统⁵，在我看来「Longhorn」可以堪称微软最疯狂的一个项目，疯狂到，到最后，必须从头再来……

参考资料

> 下载少数派客户端、关注少数派小红书，感受精彩数字生活 🍃

> 实用、好用的正版软件，少数派为你呈现 🚀