G端可视化中的适老化设计( 三 )


G端可视化中的适老化设计
文章图片
2)英文字体
英文字体类型的使用 , 英文数字的字体选择更明显的粗体 , 因为要展示数据 , 使得数据展示更加直观 , 依旧是选用无衬线体 , 比较推荐:D-DIN字体 。
G端可视化中的适老化设计
文章图片
3)字体大小
字体大小的定义 。 在字体大小的选择上 , 参考了页面上常规大小 , 定义了一套关于不同尺寸下的标准字号 , 正常1080P页面 , 最小字号不小于16px , 具体字体大小还需要参考设备清晰度 , 环境灯光 , 视距等因素 。
G端可视化中的适老化设计
文章图片
3.解决方案:颜色
1)颜色对比
界面中的前景与背景的对比度 , 是否足以让政府类客户清楚识别;
颜色不应该用作传达信息的唯一视觉手段 , 需要用额外的文字提示;
通过H(色相)S(饱和度)B(明度)的数值来划分色域 , 在保持H值不变的前提下 , 定义了10个色域 。 所以在前后景的颜色选择上 , 满足跨度至少为6 , 才能让目标人群准确识别文字信息 。
G端可视化中的适老化设计
文章图片
2)对比度检测
视觉呈现以及文案图像对比度至少要有7:1 , 大文本至少有4.5:1的对比度 。 有很多在线工具可以帮助检测颜色对比度以及是否达标 , 如ContrastRatio在线检测工具:
G端可视化中的适老化设计
文章图片
3)颜色多样
G端可视化中的适老化设计】画面采用多种饱和度较高的颜色 , 而不是单色;