1.3.36

老龄化产品设计研究

Recommanded by editor
上海/设计爱好者/4年前/4088浏览
老龄化产品设计研究Recommanded by editor
Jadero

本文与大家一起探讨下老龄化产品设计有哪些关注的点。

因为最近做的B端产品面向的基本用户都是政企单位的中老年用户,发现他们的视觉、听觉、触觉跟年轻人都不一样。

主要关注以下几个点

  • 避免使用小于16像素的字体(取决于设备,观看距离,行高等)。

  • 人们可以自己调整文字大小。(取决于项目的排期。)

  • 请特别注意文本的对比度。

  • 重要界面元素请避免蓝色。

  • 当视频或音频内容对于用户体验至关重要时,请提供字幕。

  • 使用简单有意义的图标,提供图形的名称。

  • 信息架构尽量不改变。

  • 多任务时要聚焦当前任务。

  • 手势动作简单。

  • 触摸目标尺寸间距足够大。

  • 互动时间要长。



一、避免使用小于16像素的字体,设置字体大小。

文本和按钮的大小也应该保持较大。基本上,任何阅读类或点击类的内容都应该按一定比例放大。字体至少应该是16px(有些可能12px也够,但在这种情况下越大越好),当然同时要保留字体设置功能,让他们能够再放大或再缩小字体。无衬线字体通常是增强屏幕文字可读性的首选。(在我的本次项目中,因为涉及到开发时间成本的问题,字体设置功能被搁浅了,所以整体设计的字体看上去比一般界面大2个字号左右。)

在Ant Design设计语言中有讲到确认最小字体的方法,通过肉眼到物体之间的距离、物体的高度以及人的最小可接受视角,构成一个三角函数关系。

https://elvers.us/perception/visualAngle/(视角计算器网址)

有学者研究表明老人偏好的最小可接受视角是0.75度,而视距是43cm,换算之后相当于字高5.62mm

对于一个系统来说标准方案并不一定能够满足所有人,老人随年龄增加,视力障碍愈发严重,让用户自行调节字号大小,可以满足不同时期的需求,如iOS系统中总共有12种尺寸可以选择。


二、文本对比度。

良好的对比度一直是Material Design 和 Human Interface Guidelines 中着重强调的。

[使用强烈对比的颜色以提高可读性。许多因素会影响颜色的感知,包括字体大小和粗细,颜色亮度,屏幕分辨率和照明条件。当您增加视觉元素(如文本,字形和控件)的颜色对比度时,可以帮助更多的人在更多情况下使用您的应用。若要确定UI中相邻颜色的对比度是否达到可接受的最低水平,请使用基于Web Content Accessibility Guidelines(WCAG)颜色对比度公式的在线颜色计算器。]   - Human Interface Guidelines

在WCAG 2.0 (Web Content Accessibility Guideline,Web内容无障碍指南)中给出了颜色对比度的指导意见:

  • 对比度(AA 级):文本的视觉呈现以及文本图像至少要有 4.5:1 的对比度;大号文本(字重为 Bold 时大于 18px,字重为 Regular 时大于 24px )以及大文本图像至少有 3:1 的对比度;

  • 对比度(AAA 级):文本视觉呈现以及文本图像至少有 7:1 的对比度;大号文本(字重为 Bold 时大于 18px,字重为 Regular 时大于 24px )以及大文本图像至少有 4.5:1 的对比度。

有一些在线工具可以帮助我们测试对比度是否满足 WCAG 2.0 AA 的「色彩无障碍设计」标准,比如WebAIM`s Color Contrast Checker、Contrast-ratio、EightShapes Contrast Grid、Color Tool等网站。


三、避免使用蓝色。

老年人眼睛最常见的问题是视力障碍,俗称“老花眼”,所以很多老人家都需要佩戴老花镜或者设置更大号的字体,另外还有研究表明,老年人对蓝色的阴影不太敏感。

考虑到老年人眼睛对蓝颜色的阴影不敏感,那么就要降低设计中使用蓝色元素时的对比度。从这方面来说,任何面向老年人的网页和APP都应该选择使用对比度高的色彩,以便于让他们能清楚地看清界面的变化。

但是我正在经历的项目中,公司品牌色是蓝色,所以我们对产品做了一套类似QQ换肤的色卡体系。

四、当视频或音频内容对于用户体验至关重要时,请提供字幕。

增加老年人的记忆,随着年龄的增长,其他类型的记忆也会受到损害。短期记忆和情景记忆特别容易受到伤害。并且,尽管原因尚不清楚,但是老年人通常难以操纵他们的工作记忆的内容。这意味着他们可能难以理解如何在产品或界面中组合复杂的新概念。


五、使用简单有意义的图标,提供图形的名称。

图标应该尽可能地用文本标记,因为这能清楚地说明图标的功能,同时确保任何文本都是简明的、易懂的,保证不需要文字的老人不会看着不舒服,那些需要阅读文字的老人可能会因为没有包含它而不懂操作。

逻辑推理和概括抽象等思维能力越老越丧失,在图标上的设计更应该注意,符合自然感知,能准确的表达含义,避免过度抽象。

《About Face》中说到“使用图标能提高中间级用户的使用效率;而使用文字,对于新手用户更适合。”

对于老龄用户,或许有部分用户是没接触过互联网产品的,或许有部分用户是从门户网站就开始接入互联网的,20年变迁逐渐变老。但我们不能对用户的知识储备做任何假定,还是尽量提供标签文字为好。

六、信息架构尽量不改变。

用户在产品上完成一个任务,必然会从一个地方探索着到达目的地,就像去超市购物,一个好的导航系统能够指引我们很快的找到想买的商品,则在产品中清晰的UI导航是非常重要。固定不变的导航系统能让用户记忆路径,进入超市知道去哪里买洗漱用品,去哪里买水果,不看导航指引牌就可以径直走过去。固定的UI导航系统可以使用户依靠肌肉记忆使用产品,效率更高。长期程序性记忆不会随年龄增加而衰减,但短期的情景记忆会损失,这就意味着老人学习新概念的能力较差,更改了导航系统,可能又得花很大的成本去学习。


七、多任务时要聚焦当前任务。

这一条我想不管是否针对老年人,这一交互原则都很重要。人和系统如何“对话”,简单直接是有效法则。

随着年龄增长,工作记忆有所衰退,记一件事情需要更长的时间,存储新的记忆比年轻人差。在生活中老年人经常会用纸笔记录来辅助记忆,我爷爷就打印了一张待办事项的纸,每天在纸上划掉吃过的药。所以在产品设计中要注意的是,需要逐步介绍产品功能,防止认知过载;由于记忆差,则尽量避免跨屏任务;在长任务中,给出明确的反馈和最终目标的提醒。

八、手势动作简单。

从电脑端“单击、双击、拖拽”等,到如今手机端“单击、长按、3D touch、双指捏合”等交互动作,用户可以操作的手势动作越来越多。随着年龄增大,人们的运动控制能力退化,对于老年人固然不会进行比较复杂的手势动作,还是以“点击、滑动”为主。

如果必须要使用这些复杂的操作,务必确保这些激活的动作可以通过点击或UI按钮来实现。或者可提供视频帮助,用户就可以随时查看如何正确进行手势操作。


九、触摸目标尺寸间距足够大,互动时间要长。

老人的视觉和触觉的感知能力降低,在界面设计中需要放大触摸目标使目标项足够清晰,能够提高老人点击的准确率和速度。44*44 point是Apple HIG建议的一个最小点触面积,这里的44point可以换算成物理尺寸为0.27英寸(6.86mm)。有文章建议老龄化产品的点触最小目标为10.5mm,同时减少相邻互动元素之间的距离,至少相距2mm。

再说“Fitts` Law”中表明任意一点移动到目标中心点位置所需的时间与该点到目标的距离和大小有关,距离越大时间越长,目标越大时间越短。所以为了提高效率,需要讲点击目标设定为合理的尺寸大小。

老年人由于生理原因导致注意力要迟钝些且较难持久,失去了年轻时控制注意过程所需的精度和速度。所以产品与老人互动时需要持续较长时间,比如一般的Toast会展示3s,对于老人来说,引起注意的响应时间和阅读文字的速度等都比较慢,所以这些互动的时间得长。再比如其他声音、振动的反馈也需要适当放大来提高互动效果。

综上,本文从颜色、排版、图像、导航、交互等界面设计的基础内容,对老龄化产品设计提供了几点建议,皆在提高产品使用的可用性和易用性,满足老年人的使用需求,体现出科技产品对老年人的关怀,能够继续享受数字科技生活。



结语:最后放几张图激励自己,设计都是在不断的学习中,欢迎大家来拍砖。


图片来自网络,如有侵权联系我删除。

参考文章:

https://www.shejidaren.com/laonian-ren-de-chanpin-sheji-zhinan.html

https://www.sohu.com/a/253567611_114819

http://zsll.chinaqking.cn/yc/2019/1643840.html

https://www.smashingmagazine.com/2015/02/designing-digital-technology-for-the-elderly/

https://blog.csdn.net/shadowcz007/article/details/103798190

77
Report
|
160
Share
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
Be the first to comment
Log in