南宫28官网- 南宫28官方网站- APP下载京东物流UED:深耕B端物流场景打造科学护眼色彩体系
2026-04-19南宫28官网,南宫28官方网站,南宫28APP下载“色彩是我们感知世界的重要媒介,对于信息传达有着重要的作用,能使人们能够更有效的感知设计的意图和内涵,使传达更高效。且人对色彩的视觉感知与想象能力,能够指导人做出预测、理解和决策。”
色彩是体现品牌与基因的关键因素,构建科学高效的色彩系统,建立产品的品牌形象,对产品设计极具指导意义。京东物流用户设计部在B端色彩上也进行了一些深入的挖掘和沉淀,一方面希望强化用户的京东物流品牌印象和认知,另一方面构建科学有效的色彩系统,为产品的发展提供优质高效的设计系统基础。
目前没有专门的研究及体系原则解决上述问题,当下B端系统产品缺少对单一界面长时间操作人员体验的深层次关注与设计,只通过增加界面颜色、深色模式、光照条件与等解决基础体验,缺乏该领域的新技术应用和更全面的色彩体系设计,该人群的需求依旧未得到关注和满足。
•与设备、环境和光照条件影响较大,在窗边反光严重,在光照条件较好的小办公室且使用小屏幕的用户,浅色颜色影响较小;
目前市面上很多B端工作台色彩标准,但是没有一套成熟的方案来解决B端用户视觉疲劳、刺眼的问题;
20家主流阅读、教育app及学习机,文字阅读模式下护眼模式设置方式及背景色选取方案;
眼动数据(眨眼持续时间、注视持续时间、眨眼次数、注视点个数、眼跳幅度、 瞳孔面积)、主观评估、 心率检测;
白炽灯(室内光源)更合适,最佳色温5000K,照度2000lx,水平照度300lx、垂直照度 200lx( 照度配比1.5),屏幕亮度100cd /m2;
* 参考文献:《电子屏幕诱发视觉疲劳的眼动特征来自观看视频和阅读文本的研究》、《电子显示屏色温及蓝光辐射与视觉健康关系研究》、《显示终端色域与亮度对视觉疲劳影响的研究》等,文献来源:中国知网
影响色彩呈现的因素有很多种,可以从对比度、明度、饱和度、光照环境、颜色等多方面深入分析色彩对视觉舒适度的影响。
对比度指的是物体明暗程度的差异,包括亮度、色度等参数。合适的对比度有助于清晰地感知图像信息,提高视觉舒适度和效率。过高或过低的对比度都会引起视觉不适,长时间处于这种环境下会导致视觉疲劳甚至损伤。《国际标准WCAG2.0》具体规定如下:
饱和度指颜色的纯度或强度,简单点理解就是颜色中的灰色量含量的高低,明度指的是颜色中混合了多少白色或黑色。饱和度和亮度很大程度上决定了色彩呈现给用户的感受,饱和度、明度越高,视觉冲击力越强烈;饱和度、明度较低的时候,视觉上越温和。人眼对低饱和低明度色彩的忍耐度更高。
除了对比度和明度,光照环境与界面颜色显示是决定视觉舒适度的一个重要因素。除此之外影响因素还有有眨眼的频率,刺眼的程度或者光盲区等。其他重要的考虑因素还包括颜色表现、低反射和光线的均匀分布。
在室内外(夜间)光照强度都较好的办公职场内,用户的视觉疲劳强度较小;部分职场室内关照条件较差,用户在长时间及夜间使用系统时易产生视觉疲劳。
各种颜色对光线的吸收和反射是各不相同的,过分鲜艳的颜色会使人产生倦怠的感觉,过分深暗的颜色则会使人的情绪感到沉重。由于红色和黄色对光线反射比较强,因此容易产生耀光而刺眼。青色和绿色对光线的吸收和反射都比较适中,所以对人体的神经系统、大脑皮层和眼睛里的视网膜组织比较适应,给人带来凉爽和平静的感觉。因此人在看绿色、青色,视神经会比较相对舒适。
综合竞品分析及理论依据研究结果,我们初步得出了灰色系、黄色系、绿色系能够明显解决视觉疲劳的问题,但是具体到界面中应当使用何种饱和度的颜色,还需要对设计方案进行科学的验证,因此在方案后我们需要主客观结合(眼动数据、心率、主观评估)进行设计方案验证:
白色亮度(饱和度)在84.6%一89.4%之间时, 视觉疲劳最小,纯白色更易疲劳;反射光线含多种色,光抵达视网膜的光量子越多,消耗能量越大;
视觉刺激最小;波长较短,刺激较低,对光的吸收和反射的程度都比较适中,对神经系统、大脑皮层、视网膜都无不良的刺激反应。
由于原本的物流品牌色饱和度及亮度较高,在护眼界面反差较大,与页面整体配色融合度较差,所以在护眼模式中对原本的品牌色做了调整,叠加原始品牌主色中的绿色(15%)进行颜色倾向调和。
参考RGB颜色规律,选取品牌护眼色为基准色,分别以10%透明度为一个色阶,叠加#FFFFFF与#000000,并与相应色阶的中性色进行叠加,形成具有品牌特色的灰阶。
为了模拟用户一天中实际的视觉状态,分为3组实验小组,分别为视觉状态良好(10点~11点)、视觉状态疲劳(16点~17点)、无室外光线点);
3组用户佩戴眼动仪浏览4个设计方案(白、灰、黄、绿)5分钟,间隔休息2~3分钟,并且在每个方案实验前后都设有主观问卷评估用户视觉疲劳度,总用时30分钟左右;
实验环境100平米以上开放空间、背景颜色为灰色、光源色温5000K/照度2000l、显示器色温4500K、亮度日间日光180cd/m²、夜间LED100cd/m²、清晰度50%、对比度90%;
*瞳孔大小的变化可以反映视觉负荷,当视觉任务相对简单,或眼睛适应良好时,瞳孔倾向于保持在较小的状态
以上数据表明灰色、绿色、黄色的整体数据表现均优于白色,所以相较于白色其他护眼色更有助于改善视疲劳。
用户306人,136人名选择灰色(44%),37人选择绿色,60人选择黄色,33名用户选择其他。
根据实验结果及规范色阶,进行原色与灰、绿、黄三系护眼色阶的映射关系矫正,确保系统实现护眼模式的同时,不降低信息可读性及操作效率。
梳理线上颜色使用不规范问题,最终整合需改造颜色29个进行编码化,并对编码进行定义、使用描述、对应原色值与护颜色值,并支持拓展其他护眼色系。
将颜色编码在页面上进行结构化标注,并交付开发,结合颜色编码表,实现一次开发上线三套护色。
在职场轮岗实操过程中发现,在视觉疲劳度较高、屏幕显示效果较差情况下,灰色护眼模式为最佳选择方案,可降低视觉疲劳度、同时不损失信息可读性。
护眼模式受职场环境、自然光照、人工光源、工位密度、职场氛围、个人颜色喜好、使用习惯、基础视力、视觉疲劳度等多方面因素综合影响,因此为用户提供多种配色方案,用户可根据自主选择切换,验证目前三套护眼方案可行性较好,可以满足不同用户护眼诉求。
LUI3.0物流B端系统组件目前已完成60+个基础组件开发,计划将护眼模式纳入LUI3.0组件,同时增加护眼色板,实现一键切换护眼模式,解决用户视觉疲劳问题,提升工作舒适度。
仓储订单界面护眼模式前期已在北京亚一无人仓试点,整体反馈较之前白色更加舒适,现场反馈及线上换色情况效果较好,逐步覆盖高频操作页面,目前已全国推广上线;
根据场景调研,商家用户有强烈的护眼换肤需求,因此在国内工作台全系统页面实现护眼模式切换,覆盖多商家条线年全面推广上线。返回搜狐,查看更多


