深色模式:你说的黑是什么黑(8)
2023-04-23 来源:飞速影视
体验一致:
操作系统内体验一致:参照iOS其他原生App体验建立设计原则;App内体验一致:从控件层面入手刷新体验。内容聚焦
降低边框存在感:纯黑底色,充分发挥OLED屏幕的无边界的感受;降低异形屏对内容容器边框的破坏:降低iPhone刘海存在感。视觉柔和:
采用纯黑大标题底色,上划时渐变出深色毛玻璃效果,并且降低标题栏的透明度;适用非纯白字色,防止页面对比度过高导致夜间对眼睛的刺激太强;重新审视分割线的运用,对于分割容器用的分割线做了重新设计,改用色块来分割。项目落地时,像微云这样的大型项目,有着几百个页面,直接一个一个页面刷一定会出一些问题,所以需要从抽象到具体,逐渐落地成型。
![深色模式:你说的黑是什么黑](http://fs.qqfile.top/re/aHR0cHM6Ly9waWNzNS5iYWlkdS5jb20vZmVlZC8zNzdhZGFiNDRhZWQyZTczYWMyZDA5NTgxYmExMzI4Yzg2ZDZmYTIyLmpwZWdAZl9hdXRvP3Rva2VuPWY3Zjc1YWQ3ZTA2ODU2YzQyNWNiMjlkNTQwMGFmOGJh0)
1. 色板更新,注意Check对比度
在更新色板时,需要特别注意的就是对比度。
对比度这个东西,在黑暗模式下变得尤其为妙;如果品牌主色是一个相对比较深的颜色,即使可能饱和度比较高,在深色模式下依然会导致对比度不足。
如何Check对比度是否符合要求呢?这里推荐一个网站可以参考:http://www.msfw.com/Services/ContrastRatioCalculator
![深色模式:你说的黑是什么黑](/images/loading.gif)
当你输入两个色值后,会有个对比度的数值出来;推荐值是7:1是比较推荐的对比度,大于4.5:1是可用,但是基于视觉柔和的原则,3:1算是一个最小极限值;但是如果大面积的对比度过高,也不适用我们视觉柔和的原则。
2. 刷组件,输出范例页面,此时开发可以并行开发
本站仅为学习交流之用,所有视频和图片均来自互联网收集而来,版权归原创者所有,本网站只提供web页面服务,并不提供资源存储,也不参与录制、上传
若本站收录的节目无意侵犯了贵司版权,请发邮件(我们会在3个工作日内删除侵权内容,谢谢。)
www.fs94.org-飞速影视 粤ICP备74369512号