Matrix 首页推荐

Matrix 是少数派的写作社区,我们主张分享真实的产品体验,有实用价值的经验与思考。我们会不定期挑选 Matrix 最优质的文章,展示来自用户的最真实的体验和观点。

文章代表作者个人观点,少数派仅对标题和排版略作修改。


因为今年采用了新的正式版推送节奏,今年 6 月面世的第一个 Android 16 正式版本并未实装 Material 3 Expressive。完整的 Material 3 Expressive 视觉翻新在随后的 9 月更新和本月的 QPR2 更新中陆续交付完成。

与此同时,过去这段时间在 iOS 26.2 和 Android 16 正式版之间「左右横跳」的经历,也时常让我陷入「为什么我会更喜欢 Android 16」这样的自我反思当中1。加上大部分开发者尤其是国内开发者,对 Google 的设计规范向来是「尊重理解但不采用」的态度,Google 自己也表示 Material 3 Expressive 不是 M4 而是 Material 3 的新版本……

大部分 Android 用户对 Material 3 的认知,依然停留在 Material You「壁纸取色」和 monet 色彩系统层面。

关联阅读:

 

那究竟什么是 Material 3 Expressive?虽然我不是设计师也不是开发者,这个问题的答案还是得带着问题从设计规范里找找。顺便我们也介绍一下 Android 16 正式版的视觉翻新细节,以备后续文章更新使用。

色彩即是层级

色彩方面,Material 3 Expressive 更注重用色彩去引导层级

最初的 Material Design 采用高度和阴影来体现层级

Material 3 的色彩系统经历了两年多时间的不断完善,从为特定组件引入更多强调色选项、用不同的「表面色调」层级取代传统的 Material 组件阴影层级、采用更明艳的文本与图标配色、到今年完整支持 Android 系统内建的对比度等级切换,Material 3 Expressive 和最初在 Material You 推出时构建的那套 monet 色彩系统相比,最大的视觉观感应该就是层级更丰富、色彩更明艳、同时也更重视对比度呈现了。

Material 3 Expressive 官方设计指引

在 Android 16 正式版中,我们也可以在「设置 > 显示和触控 > 颜色对比度」中找到这套拥有默认、中、高三种可选层次的色彩对比度选项。这甚至都还不够——通知控制中心面板、多任务以及应用抽屉等区域,还额外引入了恰到好处的玻璃模糊效果来进一步体现层次感2

Android 16 还引入了大量的背景模糊来辅助体现层级

交互化作形变

Material 3 Expressive 也引入了多达 14 种全新或翻新过的系统组件。相比传统设计语言规范在圆角或形状上给定标准值的做法,Material 3 Expressive 以 Google 自己开展的研究结果为理论依据,提倡开发者在设计时敢于用打破组件固定形状的方式来将用户的注意力锚定在视觉重心和关键操作上。

Material 3 Expressive 官方设计指引:打破常规、用不一样的形状来吸引注意力

在 Android 16 正式版的系统界面中,将这个设计思路体现得最直观的应该就是控制中心按钮了。具备切换状态的开关,比如勿扰模式、闹钟、Wi-Fi 连接等,在关闭状态下的按钮圆角统一、开启后则会沿用点按操作的形变动画,直接以圆角更小的圆角矩形形状呈现。

所以新版控制中心应该也是 Material 3 Expressive 争议性的集合:Google 认为与大部分周边元素不同的形状(比如这里的圆角矩形)能够让人一眼便知当前在激活状态的控制开关,但同时又有很大一部分用户初见这个控制中心时觉得凌乱、怪异,并不统一的圆角和相对繁复的控件形状选用反而分散了注意力。

尽管已经习惯了,但我也觉得第一眼确实是乱

重拾边界与框线

适当的分组逻辑和容器组件,辅以表面色调、尺寸、间距、节奏、相似度等手段,归集关键元素,体现视觉重心,同样也是 Material 3 Expressive 围绕「注意力系统」打造的设计思路。

Material 3 Expressive 官方设计指引:把相似的信息用内容框「框」起来

所以前些年国产系统厂商跟风过的那套舍弃框线、没有边界的设计风格现在也转向了。在 Android 16 正式版中,相同类型的通知、相同属性的设置入口,都被装在圆角统一的不同「容器」里,同时容器整体再以更明亮的色调、更大的外部间距等方式来与背景区分——所以尽管实际上内容呈现密度降低了,但视觉上总会给人一种依然紧凑的错觉。

Android 16 中通知和设置项入口均采用了这种分组方式

弹簧驱动的系统

动画效果方面,Material 3 Expressive 引入了包含刚度(stiffness)、阻尼(damping)和初始速度(initial velocity)的「弹簧」来驱动动画

刚度决定动画速度的整体快慢、阻尼决定回弹效果有无,二者结合初始速度共同决定整个弹簧动画的时长。

这三个元素共同取代了之前相对原始的减速效果(easing)和持续时间(duration),从大家喜闻乐见的「模拟物理世界运动」角度出发,可以说是更加科学也更加精细了——但与此同时开发者又并不一定必须了解物理,所以 Material 3 Expressive 又借助 token 的方式,将打包好的刚度、阻尼和初始速度配置方案按照空间类别(比如从 A 点到 B 点的动画)和效果类别(比如从 A 形状变成 B 形状的动画)打包成两套方案好供开发者调用——标准和 expressive,前者适用于大部分场景,后者回弹动画明显、更适合活泼灵动的动画系统。

Material 3 Expressive 官方设计指引:此前的持续时长和减速效果等参数,被简化成了两套 token

Android 16 正式版则在大部分系统动画中选择了 expressive 这套方案,下拉通知中心时的通知列表、进入多任务界面时的任务卡片、打开应用抽屉时的顶部边框……都配有轻快、活泼但时长又毫不拖沓的回弹动画,并且 Google 也毫不吝啬地给大部分动画效果配上了振动反馈,反馈触发位置一般放在松手、按下等操作锁定或终点触达的位置,给人一种更加明确的反馈感。

举个例子,当你尝试将某条通知从它所在的分组容器中滑动删除时,这里的动画会有三个阶段:

  1. 首先会借助阻尼,给你一种粘滞感——提示你正在将一个分组里的内容,从它的容器里「拽」出来
  2. 达到分离的临界点时,振动反馈触发,同时被选中的通知圆角发生形变——从触觉和视觉上提示你操作确定触发
  3. 如果你没有松手,这条通知接下来就会加速滑走,然后其它通知从分离状态重新合并为使用统一圆角的容器……
就像从果冻里取一块黄桃?

注意力战争

最后,Material 3 Expressive 也提倡借助可变字体的字重、字宽等参数,配合字体大小、颜色,来营造文本排版的层级感并最终引导用户的注意力

不过对中文用户来说 Android 16 正式版所搭载的可变思源黑体依然存在字重缺失(没有 100-400)的问题,所以大部分开发者也不太可能在自己的应用中完全整合 Material 3 Expressive 的所有上述特点,来构建 Google 在文档里所提倡的「高光时刻」了——对某些积重难返的大厂应用来说更是如此。这显然又来到了典型的 Google 式多部门协同体验、或者说眼高手低、语言一套行动一套——大家习惯怎么描述怎么来的环节,我们也暂时按下不表。

Material 3 Expressive 官方设计指引:用字体构建层级,同样也能抓住用户注意力

聊到这里,回到文章开头的那个问题,为什么对国内用户而言 iPhone 相比 Pixel 从各方面来说都是一台更好的手机,但我还是难忍时不时拿起 Pixel 把玩的冲动?我想答案就在 Material 3 Expressive 处处强调的「注意力」这三个字上。

iOS 26 的 Liquid Glass 自有其层级规范,在新的人机指南中 Apple 将 Liquid Glass 定义为一种通过层级感很强的玻璃材质和动态响应来组织界面的手段,把重点推到视觉前景,其它内容用模糊、透明度和光线来适当隐去,在用户视线上形成一个明确的「焦点」。

在 Vision Pro 这样的立体「空间」里,玻璃是一种很自然、也很能体现层次的材质

但问题在于手机屏幕并不像 Vision Pro 的目镜

手机屏幕的同屏控件、元素、文本密度和 Vision Pro 是两个概念,在 visionOS 中你可以通过前景、背景、光影、透明度来体现的空间感,在手机屏幕上就是薄薄的一层,并且尽管 Apple 提醒不要把玻璃材质到处铺成「噱头」,但这种材质本身就具备这种吸引力不谈3,iOS 26 系统界面本身其实也很难避免玻璃材质堆砌的观感。

iOS 26.2 的主屏和控制中心

所以当我拿起 iPhone,进入主屏,扑面而来的是玲珑剔透的小组件和图标、是随光影角度变换的高亮边框、是梦幻般折射的材质边角……但一切似乎都和层级感没有太大的关系。

在视觉上没有重心、注意力相对分散的情况下,除了淹没在玻璃的光影里我就只有「拿起手机把事儿办完」的想法——完全不会有欣赏一下 PixelPlay 这种优质 Material 3 Expressive 的想法。

今年的 PixelPlay 倒是很快复现了 Google 的设计稿

当然,Material 3 Expressive 和 Liquid Glass 在我看来其实算是两种极端,这里也并没有要给二者强行分个高低的意思(毕竟目前我主力机还是 iPhone)。如何把注意力引导到设计和功能的重点上是门学问,Material 3 Expressive 和 Android 16 正式版给出了一套讨好眼球、甚至可以说有点激进的方案,Liquid Glass 则更加注重生态内的设计一致性和使用习惯。

不知道各位喜欢哪一种呢?

参考资料:

> 关注 少数派小红书,感受精彩数字生活 🍃

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

16
6