Material Design & iOS 13黑暗模式总结探索

版权申明：本文出自“阅文CDDC”原创，感谢“阅文CDDC”的原创教程分享！

本文是学习Material Design以及iOS13黑暗模式相关设计指导后的学习归纳及理解输出，希望在黑暗模式实际适配中给大家提供些帮助。

一. 黑暗模式是什么

在UI界面中大面积采用深色构成界面主体的设计，由于整体亮度降低可在黑暗环境中提供舒适性并可最大程度地减少眼睛疲劳,同时对比度应满足无障碍阅读（WCAG）AA级的标准，也可以理解成产品中对默认模式的一种补充。

二. 为什么黑暗模式这么受欢迎

1.沉浸式效果明显

大多数生产力软件，包括开发者使用的软件都以深色为背景。深色背景的优势是可以突出与我们主要交互操作的内容，弱化其他辅助元素并降低屏幕整体的亮度减少视觉压力。

FEVTE编注：更多平面设计理论学习请访问飞特网平面设计理论知识栏目，地址：https://www.fevte.com/plan/shejililun/

2.炫酷

科幻电影中的界面多是以代表未来的深色为主，这从侧面间接的影响了我们对于科幻印象，同时大多数App浅白色背景已经使部分用户产生审美疲劳。黑暗模式在不大改界面的同时还能给用户带来新鲜感。

3.省电

这应该是黑暗模式中最大的特点。

说到省电必须的说一下OLED 屏幕，OLED是未来屏幕发展的一个趋势。OLED 屏幕又叫有机发光二极管，它与传统的LCD屏幕最大的区别是自主发光不需要背光面板。所以它可以不发光显示纯黑色。这也可能是iOS13 把黑暗模式中背景色值直接设计成纯黑色的原因之一。

下图是YouTube 在默认模式及黑暗模式下相同界面耗电量的对比，通过对比可以看出当屏幕处于100%亮度下默认主题比黑暗主题高出60%左右的耗电量，这反映出黑暗模式省电效果非常明显。

三. 黑暗模式就是夜间模式？

这是很多人关心的问题

先看两张图，左边是网易云音乐的夜间模式，右边是YouTube黑暗模式。

通过图片对比发现，左图的对比度明显低于右图。试想一下，在白天使用夜间模式，界面内容是否还能看清。

夜间模式设计的出发点是用户夜间使用，采用更低的对比度让界面不刺眼。但由于黑暗模式有刚刚提到的各种优点，让它的使用场景并不仅限于夜晚，很多用户白天也会长时间使用，所以黑暗模式应满足WCAG无障碍阅读最低AA级的标准。

所以夜间模式不等于黑暗模式。

Ps：Material Design在移动端的应用主要是Android平台，以下主要是以平台为对比。