Mac 视觉史 vol.2.5:山中俊治的「手绘板」
2022 年夏天,很偶然地在视觉书店翻到日本工业设计师山中俊治《设计的风骨》一书,在其中找到了一些关于 Macintosh 非常有趣的往事。在网络的犄角旮旯里寻访这些往事的过程中,倒是无意中补完了之前「Mac 视觉史 vol.2」中缺失的一些细节。
对于绝大多数的用户而言,Mac OS X 是 21 世纪初顶尖设计的范式,在今天,它是最优秀操作系统的当中的典型。但是在此之前,经历了无数次在设计和开发层面上的尝试,和持续不断的失败。
这本册子是山中俊治 10 年前网络博客的内容合集,其中 2009 年 6 月的一篇博文分享了这段过往。
山中俊治是日本著名工业设计师,东京大学教授,曾就职于日本汽车设计中心,后出走成为独立设计师。
大约是 1994 年,彼时已经成立个人工作室「Leading Edge Design」的山中俊治,联合猪股裕一、户田勉、宫崎光弘、须永刚司四人,一同组成一个提案小组,前往位于库比蒂诺的苹果总部,带着一套名为「Drawingboard」的 Macintosh 次世代 GUI 设计方案:
一拍即合的构想
初到库比蒂诺,山中俊治等 5 人面向当时的 Macintosh 团队,拿出了这套独特的提案。彼时焦头烂额的 Macintosh 团队正在推进代号为「Copland」的新版本操作系统,他们对于全新视觉风格有着极为旺盛的需求,而山中俊治的提案正是他们迫切想要的……某种可能性。
这是一套有着强烈美学特征的设计,「DrawingBoard」的主题风格命名也昭示了它的灵感来源——手绘板绘图。
工业设计出身的山中俊治,使用工业设计草图风格来呈现 UI 细节,用不同类型的阴影、倾斜 45 度角排线,硬朗的阴影色块,形同出血线的边角处理,增加几何感的倾斜边缘,共同塑造出一套完全不同早期 Macintosh 的视觉特征。
在提案的视觉设计上,山中俊治采用了极具手写质感的衬线字体,来搭配整个界面。在文件夹图标的设计上,同样沿用了这种出血线的勾边处理技巧,而其他快捷方式和应用程序的图标设计,则使用了内置斜线阴影的正方形来作为外轮廓,来统一不同图标造型。甚至在背景上,直接使用工业设计的画稿,提升视觉的形式感。
更有意思的地方在于,山中俊治的 GUI 设计方案当中,明显加入了一套底部工具栏来提高彼时 Mac OS 8 在桌面环境下的直观性,这似乎确实是优化 Mac OS 8 的一种有效手段。
从概念设计到落地呈现
「由于演示非常成功,设计方案直接进入了研发阶段。」山中俊治在他的博客当中写道。
虽然提案阶段他们对于各个 UI 元素如何呈现有清晰的构想,但是在真实的应用场景当中要如何设计、怎样应对不同的场景,要处理的细节就太多了。所以山中俊治随后作为项目总监,在库比蒂诺待了接近一年时间,和开发团队共同完成这一主题的设计。
由于所有视觉元素几乎都要手绘完成,随后转为对应的数字版本,这种充满艺术气息的不规整视觉元素,在彼时 Mac OS 8.5 的硬件上运行时,需要面对一些独属于它的加载问题,这也是导致这一主题的研发周期拉长的原因所在。
在「DrawingBoard」主题之下,悬停选中的方式也非常具有「手绘感」,选用的是强调色下划线来呈现,倒是优雅了不少。
在具体的 UI 控件细节上,比如标签页的设计上,设计稿和实际呈现上还是有不少差别,比如减少了出血线的使用来降低视觉信息量,在折角的位置增加加重强调的笔触,来强化这一风格的特征。
类似这样的「优化」还体现在很多 UI 细节的处理上,比如倾斜排线阴影的处理,也调整得更浅,而更具「工匠感」的衬线字体,也被替换为衬线近乎不存在的 Geneva 和 Gadget 字体。
直到此时,山中俊治还不知道苹果内部对于视觉风格探索,依然没有找对的路子。
Copland 极具前瞻性的另外一面,就是它本质上是一个「要你命 3000」。各种新的功能和特性出于市场需求和项目需求毫无节制地被加入进来,所有的功能相互之间都存在冲突和影响,所有人都很清晰地知道,Copland 是不可能被作为正式产品所发布出来的。
他的「DrawingBoard」也仅仅只是诸多备胎当中的一个,在关于信息当中,他的名字赫然在列:
直到今天,这段往事除了山中俊治本人的博客,关于「DrawingBoard」的信息并不多。不过当年曾经看到这一主题的果粉,倒是对于这些遗珠念念不忘。
消解怨念的方式
「1997 年 WWDC 会上,刚刚重返 CEO 职位的史蒂夫乔布斯站上台公布了这一设计,并表示非常欣赏我们的方案……」山中俊治在他的博客中回忆道,「最终,方案没有被正式采用」。
得不到的永远在骚动。这大概也是为什么这套设计成了无数爱好者的心头好和无法企及的夙愿。
有人选择了自己动手丰衣足食。22 年前,有 LiteStep(是一款 Windows 桌面环境的替代品)爱好者根据山中俊治的概念图自制了主题,名为 Mo85:
并且根据网友的论坛留言,也有 KDE(Linux 和类 Unix 系统桌面环境之一)的爱好者制作了类似的主题。而关于「DrawingBoard」的话题讨论一直绵延到今天,还未停止。
「最终版我们无缘得见,但却流传到网络上,短时间内流传广泛,受到拥护,想想真是不可思议。」山中俊治至今都对此耿耿于怀。因为它确实可以「被找到」。
前文中的「实物图」就是这么来的。
这个可以在 Mac OS 8.5 上运行的主题,也是油管 up 主 Pierre Dandumont 所发现的,他在一个内部代号为 Snowman,版本号为 8.2D8 的 Mac OS 8.5 beta 版光盘镜像中找到。我不知道他为了找到这个主题,他到底翻看了多少系统安装盘。
这一版本的系统中,还藏有系列第二篇中所提到的「……面向儿童的主题 P,以及更加具有未来派风格的主题 Z」,它们分别是 Gizmo 的童趣风主题:
以及科技风主题 Hi-Tech:
跨越时代的尝试
之所以拿「DrawingBoard」说事儿,因为它确实有点特殊。相比于同时代的其他尝试,它在视觉追求和体验层面上,距离 Mac OS X 更近。
「ID 公社」中一篇名为《数字时代的内外一致性》的文章中,提出了一个有意思的数字时代划分方式:
第一个是 1980 年代 Macintosh 上的图标,由 Susan Kare 设计,第二个为 iOS 6 及之前的「照片」图标,第三个为 iOS 7 后的「照片」图标。
Susan Kare 时期的图标因显示分辨率的限制,只能用低数据含量的象征图形来指代某个东西,可以称它是完全数字化的……
随着屏幕的分辨率增大,单位尺寸内容纳的信息含量越来越多,显示更多像素和更多的色彩……设计师尽可能让每一个像素都不浪费,这是数字时代早期一个常见的现象,当资源逐渐丰富起来时,就用它来模拟实体世界。
当屏幕分辨率达到了视网膜屏级别……数字时代所具有的不连续已经等同消失了,数字的拟真接近以假乱真,我们可以将这视作是数字时代对模拟时代的最后怀念。
「DrawingBoard」是山中俊治在当时那个节点,试图模拟实体世界的一种尝试,充满设计的情怀,也具备独特的调性,唯一的问题在于,它所选取的领域太窄,风格化程度过高,它的丰富性不足以满足所有人对于 GUI 的期待。而 Aqua 的设计语言具有更强普世性,Mac OS X 最终以这种形态出现,似乎具有某种必然性:
在乔布斯刚刚回到苹果的时候,Ratzlaff 曾在项目说明会上演示过这样的设计,只不过当时并没有引起足够的重视。Ratzlaff 发现这种通透明快的质感内在的共通,开始继续沿着这个方向去挖掘——明亮、有趣、多彩的视觉,用充满「水滴」质感来重新设计 UI 界面元素,彻底告别死板老旧的 UI 界面。
在视觉上,鲁宾斯坦所领导的团队,做过很多次不同的尝试。而 Ratzlaff 这种「水滴」视觉美学似乎走对了方向。
Ratzlaff 的思路和乔纳森在更深的层次上是不谋而合的:「什么东西和计算机界面毫无关联?」他能想到了糖果,想到了酒。
「它看起来好像来自另外一个星球……一个好的星球,一个拥有更好设计师的星球。」乔纳森说。
事物发展到临界点总会自然而然地出现变革。Mac OS X 和拟物化设计是 20 多年前的瓜熟蒂落,Vision Pro 卡在 Mac 40 周年这个节点上线出货,似乎也有点「献礼」的意味。
1984 年 1 月 24 日,Macintosh 128K 作为麦金塔家族第一款产品,正式发售;2024 年 1 月 19 日 Vision Pro 正式发售。隔着整整 40 年的两款产品,前者是消费级个人电脑领域的开启者之一和里程碑,后者则以全新的规格和策略,进入空间计算的时代,尝试为数字世界有效地升维。
当然我并不认为 Mac 的时代结束了,相反 Vision Pro 和 Mac 会成为更为复杂的数字生态中,各有偏重的产品形态,也许会在某个阶段,碰撞出更有意思的可能性。
写在最后
一直没想好用什么样的姿势开始写 Mac OS X ,不如回过头梳理一下山中俊治和他的「DrawingBoard」,稍事休息。
Mac 视觉史 vol.4 咱们继续。
引用来源:
- https://lleedd.com/blog/2009/06/14/drawingboard/#more-1268
- https://www.youtube.com/watch?v=KOEMz_saHCE
- https://www.journaldulapin.com/2017/06/12/mac-os-8-5-theme/
- https://forum.opendesktop.org/t/theme-based-on-mac-os-9-drawing-board/18773/4
- https://www.pling.com/p/1219916
> 关注 少数派小红书,感受精彩数字生活 🍃
> 实用、好用的 正版软件,少数派为你呈现🚀
© 本文著作权归作者所有,并授权少数派独家使用,未经少数派许可,不得转载使用。