夜间模式设计的研究方法

移动界面设计点滴(4)——为了阳光而设计

六年前,我写了这样一篇短文。
六年后,手上的产品终于做到了一定实践。
看起来,发生了愿景中两个关键设计,适合的灰度与色彩对比度、适合的环境参与。
并将应用在多个产品中,所以分享供研讨。

这组Slideshow的关键内容是,对于竞品夜间模式的总结思路。
⽬前市面上夜间模式的取色标准,主要基于设计师的主观经验。但落地在产品中的数值确是精确的。那是否存在唯一真相?
下列量化方法可行的前提是,我相信主流设计师的直觉。
所以,通过对设计进行逆向还原、利用模型分析(HSV颜⾊色标准聚类分析、WCAG对⽐比度计算),进行判断。

PDF

Download the PDF file .

2 Thoughts on “夜间模式设计的研究方法

  1. 饺子 on 5 十二月, 2016 at 18:06 said:

    做的不错~

    不过有两个可能比较影响体验的问题:

    1.网站主题色:比如youtube主题色是红色,市面上浏览器夜间模式很多直接变成黑色,连未选中态的图标都看不清了;
    2.图片对比度:只给图片加遮罩会降低对比度,如果图片本身对比度就不强,看上去就非常费眼.

    当然解决以上问题,专门优化的开发成本可能很高~

    • 1. 恩,当前普遍的处理机制是稍粗暴,不考虑个性化。优化方法可能是在黑/灰色的基础上,增加原有颜色的一部分色相。
      2. 理想情况是能够更精确的分析个体图像的灰度值/对比度,处理方法可以是服务器端计算或本机,但总感觉公司会不买账吧。

发表评论

电子邮件地址不会被公开。 必填项已用*标注

Post Navigation