2020-7-6 资深UI设计者
苹果WWDC 2020在6月23日通过线上形式召开,本次开发者大会没有发布太多硬件产品。不过macOS的新版本macOS big Sur依旧引来了大波关注,坦诚的讲这次版本更新属实是很震惊,这可能是近10年苹果第二次颠覆性的改变,上次还是2013年的iOS 7开始全面扁平化,从而引发了设计圈「扁平拟物大战」。
从系统连续性上看AirPods可以在不同设备上无缝切换,不同设备直接可以复制粘贴等等,显而易见的一件事是,苹果启动了macOS的「 iOS化」,所以回归到设计上,这次的升级对设计语言上的影响概括来说有以下几个方面:
逐步 iOS 化的 macOS
不知道大家有没有这种感觉:以前从诺基亚(或Android手机)切换到iPhone,动机是cool~,漂亮的外观让人第一面就爱上了,恨不得马上就拿起来把玩。现在给你个选择切换回Android手机,不管那款手机有多漂亮多美好看,心里第一句话很有可能是:「XXX手机很棒,但我已经离不开苹果的生态了哦!」(我就是这种德行,尝试了N次还是回来了哈哈哈哈哈。)
这大概就是苹果在系统打通的层面下的功夫,更加注重生态的维护,在不同的设备间寻找更多场景产生更多联系。从设计的层面来看,iOS化的macOS对iPhone用户更加友好,有相同的操作习惯,不必在mac和iOS上来回的切换。其实在Material Design推行的过程中就有相似的做法,Chrome的全面MD化,让整个设计语言贯穿在移动设备和个人电脑中。
1. 完全继承iOS基因的控制中心/通知中心和dock
全新的control center,可以看的出继承了iOS/iPad OS的语言,UI和交互几乎是没有任何变化,整合系统一致性的初衷是甚好,在当下这个情况,不得不说亮度和声音的调节我更依赖于物理键盘(或touchBar),不太清楚硬整合在一起的理由(难不成是过度解读了,也许人家就想继承继承)。
从苹果对产品的终局目标来看,也许会在硬件上取消物理控制按键或者更加优化 touchBar 去操控必要的属性(也有传闻说这是在为触控版本的 macOS 做准备)。
同样iOS化的通知中心(讲真,用户实际的桌面未必这么干净,真是担心本身在电脑侧使用频率就不是那么高的通知中心被混乱的文件夹淹没)
2. 进一步强调的沉浸式氛围
全局设计中最令我欣喜的是menu Bar的更进一步的优化!我在sketch里模拟了下效果(非严谨模拟哦),大概得出的结论是加高了背景模糊值,减少了本身的填充透明度,达到了现在的效果。
感官上来看的话是一个微小的改动,但从层级整合的角度这是苹果设计的一大提升,通过光影等自然世界的隐喻抽象设计来减少硬性层级划分,也符合Alan Dye(苹果用户界面设计副总裁)提出的「深度,阴影和半透明性用于创建层次结构」。
除了壁纸以外,图标是最引人瞩目的变化啦!iOS化的图标规格的约束不用多说了,还有就是「新拟态」的第一次亮相。新拟态出现一定意义上是对这个时代获取信息时枯燥感的厌烦与反抗,举个例子:就像当你日复一日的穿基本款T恤的时候一定向往印花T恤,不管你是多么的成熟有型哈哈哈哈哈。
△ 左图为新拟态,右图为MD
icon的设计植入了新的设计理念,更突出去表现现实环境下的真实状态,注重光影和厚度的变化,尤其是光影。细看每一个icon,严格遵循同一个光源(正顶光)去设计。
但话说回来,很难讲这套icon是否成功,有几个明显的弊端也暴露出来了:
1. 可用性与美感的平衡
新拟态更重注光感的细腻程度,但对信息的有效呈现打了一定的折扣,这块苹果权衡决策下放弃了些许的美感,增强了有效的信息传递。
△ 图片来源dribbble
2. 统一性
对一个生态来讲,最最理想的是每一个生活在内的成员要和谐的相处,新的拟态风格相比扁平时代的图标显然给第三方开发者增加了难度,这种难度极有可能对没有太多设计资源但又想好好开发应用的创业团队造成一定的打击(换句话说催生了设计外包的工作也不错哈哈哈哈哈)。
总的来说,优势和弊端同时存在吧,啥事都没有完美的不是么~下图是这次改版里我相对还比较喜欢的几组icon了。
布局结构的简化处理
从官方的HIG介绍中,sidebar被重点提到了。透过去看,其实是布局的底层逻辑发生了变化,10.15的时候上下两段左右分栏的方式会存在一定的误区:全局action控制当前试图的交互???
从层级关系上也可以勉勉强强讲得通,但实在是太牵强了,特别是前进后退按钮存在所有文件之上这个蜜汁布局居然维持了这么久。层级清晰的梳理后带来的一大优势就是视觉的复杂性被降低了,借助现在这种列表视图,很大程度上前进后退都用不到了。
另外要提及的是设计师可以思考的问题,下一代模糊效果-渐进模糊。这种模拟现实生活的真实模糊包括阴影/反光/相互透出,同时要考虑光源/角度/环境等等,不再单纯的只是黑色/透明度(有兴趣的话可以在sketch里模拟下或者留言讨论讨论~)。
人脑是需要一个提示来识别物体,我们称之为反馈设计,这是人机交互中非常重要的一个环节,这也是为什么许多按钮仍带有阴影的原因。但是,这版本的macOS工具栏图标丢失了形状以消除视觉复杂性,所以重塑后的反馈会鼓励用户去操作。
对于设计师来讲,不要害怕不强调所有选项,并非每个按钮都需要具有形状。只要设计足够的反馈一样可以起到被点击的效果,例如当用户将鼠标悬停在其表面上时,可能会出现更多的色彩更有趣的动画,并尽可能消除视觉上的复杂性。
这次升级除了设计上的优化外,safari的变化也足够令人欣喜,可以快速通过 tab 知道当前网页的内容的功能真是令人欣喜(虽然我记得之前Yandex浏览器就是这么做的哈哈哈哈)。
可以预知时间地点的apple map:
悄悄的说,感觉苹果越来越像腾讯了,有些小微企业的创新功能一受用户喜欢不是买过来就是抄过来,有一种垄断的感觉,想想悲催的Alfred和workflow都是这种命运。
macOS big Sur 的升级可以说是苹果对未来的进一步探索,站在设计师的角度,有几个值得学习的点:
文章来源:优设 作者:Nana的设计锦囊