
iOS 13 转瞬现已到了 Beta 8,Android 10 的正式版发布也近在眼前。现如今在 Apple、Google 的自家运用中稍加发掘就不难发现,许多运用都赶在正式版体系更新发布之前适配了暗色主题或暗色主题,它们的具体完成作用略有差异:有像 Twitter 这样选用深蓝布景的,也有像 Google 在自家运用中广泛选用的深灰,一些运用乃至还内置了专门针对 OLED 设备的纯黑主题……
作为体系级功用从 macOS、Windows 向 iOS、Android 全面推动的暗色主题,好像迎来了一个归于自己的「元年」。
暗色主题的必要性
不论自身具有多么强壮的主题引擎,是否具有暗色主题现已成为了许多人点评一款运用外观规划时的「必考题」。
常见的三种主题
为什么暗色主题是必要的?咱们可以从两个方面来答复这个问题。
首要天然是出于健康视点的考量。简直一切的智能手机都装备了主动调理屏幕亮度的功用,这个功用存在的含义,便是当咱们所在环境的光线亮度发生改变时,让手机屏幕处于一个合理的显现亮度上——既不会由于过暗导致屏幕内容难以辨识,也不会由于过亮让人感到扎眼。
环境光与屏幕亮度的明暗间隔在夜间会被扩大 | 图:Pixabay
假如咱们身处黑夜,这种环境与手机屏幕亮度的明暗间隔被进一步扩大,亮度比照带来视觉影响也愈加显着。一个略为极点但却非常常见的比如是,假如咱们在乌黑环境中长时刻凝视高亮光源,这个高亮光源平息的瞬间,本来凭肉眼可以牵强看清概括的周遭环境,此刻对咱们来说会变得一片乌黑(过一段时刻会康复,这与视杆细胞有关)。
因而尽或许下降屏幕亮度,缩小屏幕显现内容与环境光强度的间隔,是确保咱们夜间舒适玩机的重要条件,OLED 屏幕广泛运用后,其显现黑色不发光的特性也让进一步下降屏幕亮度成为了或许。
不过关于 OLED 屏幕而言,运用暗色主题对设备续航带来的积极影响也是人们热衷于暗色主题的原因之一。
在上一年年末举办的 2018 Android 开发者峰会上,Google 初次就 OLED、暗色主题和手机续航三者之间的联系发布了自己的研究结果:暗色主题可以使 OLED 设备在平等亮度下的电量耗费削减 63%;在以最高亮度展现单色静态图片的情况下,耗电由少到多依次为黑色、赤色、绿色、蓝色和白色。
Google 自家运用在明/暗主题下的耗电比照
因而咱们不难猜测,就和本年各大厂商都或多或少在自家生态体会内建立起了形态万千的「数字健康」功用相同,暗色主题在未来两年时刻里也会成为移动操作体系渠道上的一大潮流。
「纯黑」仅仅可选项
不过就在一部分用户翘首以盼等待「暗色主题年代」全面来临的一起,也有另一种声响以为暗色主题的实践作用并不怎样「护眼」。
问题出在 OLED 和纯黑主题上。
假如咱们以上方 Google 发布的研究结果为根底,天然就会得出「抱负状况下在 OLED 设备上运用纯黑主题是最省电的」这一定论。这也是为什么不少运用会将纯黑(true black)主题作为额定的夜间形式选项提供给用户的原因。
但这些看上去非常「良知」的 OLED 主题,从规划规范和实践观感的视点动身却不是都算不上完美。
布景 rgb0,0,0,账户称号255,255,255,但内容全体的灰色最高为180,180,180,颜色比照度为 10.12:1
以 Google 为例,Google 在最新的 Material Design 规划攻略中将暗色主题描绘为「默许主题或亮色主题的必要弥补」,这种必要性有一个不容忽视的条件——除了可以尽或许下降屏幕亮度,优异的暗色主题规划还应满意最低颜色比照度要求。
所以 Google 不引荐盲目为暗色主题调配纯黑布景的第一个原因,其实是出于无妨碍规划视点的考量。
这种颜色比照度要求在 Android 10 中其实已有表现:在开始的 Beta 1 测验版别中,咱们可以在 Pixel Launcher 中看到不少纯黑颜色的暗色 UI,包含长按桌面的弹出菜单、运用快捷方式列表等等;而相同的 UI 到了后来的 Beta 4 中现已换成了灰色,一种根底色为#121212、在不同界面中略有明暗差异的灰。
Google 引荐运用的暗色主题颜色
运用灰色而不是纯黑作为暗色主题主颜色的首要原因便是比照度,具体而言,Google 在 Material Design 暗色主题的规划规范中规则了这样几条准则:
比照度:暗色界面与主体纯白色文本的比照度等级至少为 15.8:1
层级:在具有高度的界面元素上,运用更为亮堂的颜色来表现层次感
去饱满:对原色进行去饱满处理,确保它们在一切界面层次中都满意《Web 内容可拜访性攻略》所规则的 4.5:1 规范
有限颜色:首要界面应选用暗色规划,少部分区域运用恰当强调色(亮色、去饱满色或亮堂的饱满色)
和朴实的黑底白字比较,灰底可以在确保满意文本可读性的条件下营造出更为舒适的比照度体会,真实做到减轻用户视觉疲惫的作用。
不过 Google 主张选用深灰而不是黑色作为暗色主题的主颜色,另一层原因来自 Material Design 自身。
层次对暗色主题而言仍然很重要
Material Design 诞生以来经历过数次更新和革新,开始 Google 在这个规划言语上所坚持的东西到头来有自我否定、朝令夕改的,也有自始自终都没有发生过改变的——暗影和层级正归于后者。
光影的改变往往也伴随着明暗的替换,但在纯黑的布景之上,一切投影都将失掉含义。换句话说,纯黑布景在处理夜间运用太亮这一问题的一起,也抹除了 Material Design 的根本特质。
但深灰色却能很好地让不同界面元素在暗色主题下保存明晰而直观的层次联系,让 Material Design 的中心特质不被损坏。在这里 Google 引入了「外表光源」这个理念。
外表光与 Z 轴高度相关
举个比如:当一个深灰色组件的 Z 轴高度较低(间隔用户较远)时,外表光相对较暗,而当这个组件的 Z 轴高度向上抬升(间隔用户越来越近),投射在这个组件上的光线强度添加,组件外表的亮度越来越高,深灰变成了浅灰。
亮色主题运用暗影来表现层次,暗色主题用的则是高光小结
纵观 iOS 和 Android 的官方暗色主题规划规范,咱们不难发现二者具有许多类似点:满意最低 4.5:1 的颜色比照度、重视对无妨碍形式的全面适配、与淡色形式观感附近……对 OLED 设备而言,纯黑布景当然可以到达最佳的省电作用,但无妨碍规划自始自终都是移动操作体系交互规划中至关重要的一环,在适配暗色主题的过程中,因噎废食直接放弃 Material Design 中心特征的做法也并不可取。
所以适配暗色主题并不是「换个纯黑色的布景」那么简略,咱们也等待更多国产运用可以赶快依据渠道规划规范适配出愈加舒适的暗色主题处理方案。
关于 iOS 的暗色形式规划规范,咱们此前在Power+ 2.0中已有具体解读,欢迎订阅阅读。
参考文献
本文所选用的核算颜色比照度东西为 Google 无妨碍规划文档中所引荐的https://contrast-ratio.com,颜色拾取东西为 Apple 公司旗下 macOS 自带的 Digital Color Meter。
