如何测试图标的可用性

在网页设计和UI设计中,图标不仅仅是为了视觉上的美化,更多是为了提高指示和可识别的作用,那么什么样的 Icon 才是可用性高的呢?本文作者 AURORA BEDFORD 提出从发现性、理解性、预测性、吸引力这4个方面来评价图标,也为图标设计构思提供了一个方向。

图标的可用性测试

设计师经常使用图标来节省页面空间、提高用户识别速度。随着像智能手机、可穿戴设备等这些小屏设备越来越流行,图标的使用也更多了。但是,这些图标是否可用?唯一的方法就是对这些图标进行用户测试。

如何进行图标测试

不同方法可以解决图标可用性的不同方面,判断图标是否可用可以从以下4个量化指标来测量:

1)发现性:用户能否发现页面上的图标;

2)理解性:用户能否理解图标的意义;

3)预测性:用户能否猜到图标点击会发生什么;

4)吸引力:图标是否美观;

以上4个指标都是图标设计中起着关键性的作用,但需要独立去思考如何来提升。

图标测试方法

图标评价的方法有很多,要根据评价目标和所处的设计阶段来决定测试方法。图标评价方法可以分为2大类:无背景的图标测试、基于背景的图标测试,区别在于图标测试时,是否将图标放在页面中进行用户测试。无背景的图标测试,就是单独用图标(测试素材只有图标,没有页面)进行测试;基于背景的图标测试,就是图标放在实际的页面中进行测试。

需要注意的是,尽管采用无背景的图标测试,受测用户也必须目标用户,熟悉产品行业并有相关背景知识或概念。

发现性测试方法

为了评估图标的发现性,需要将图标放在页面中实际位置,基于背景的图标测试可以用于判断:多个相似的图标放在一起是否会导致用户找到目标图标会比较困难,或者放在太隐蔽的位置或周边有很多广告导致图标被用户忽视。

查找时间测试是用于判断用户能不能容易地发现图标的最好方法,在测试过程中,受测用户需要按任务点击图标,计算受测用户成功找到目标图标的操作时间、首次点击准确率。

理解性测试方法

理解性测试最好进行无背景的图标测试:只向受测用户呈现单独的图标(而没有页面内容),让受测用户猜测图标所代表的意义,在某种意义上来说,这种测试也是洛夏墨迹测验的一种方式。这个测试的目的是保证图标能够被用户容易地理解。

从用户的描述或词语中来获得用户对图标的理解,如果用户的理解与图标想要表达的意义/内容不相符合,那就意味着需要重新构思图标,重新设计图标。

我们知道图标都伴随着文字标题,你可以会认为:先向用户呈现图标的名称,再让用户从多个图标方案中选择一个与名称最匹配的一个图标,这种测试方式更为合理。但是我们不建议使用这样的方法测试,因为在真实使用场景中,用户很可能只看图标,而是不看图标名称。因此,在测试时使用以下方式更加合理:以某种方式让用户知道需要在这个页面上查找某个功能,从而找到对应的图标。

预测性测试方法

不仅需要用户理解图标的意义,而且还需要预测图标代表是是什么功能。实际上,即使用户不知道这个图标是什么/叫什么,只要用户知道图标所代表的功能就够了。

用于评价理解性的无背景图标测试方式同样可以用于评价图标的预测性。然而,预测性测试不是简单地问用户图标代表了什么功能,而是当图标点击后,用户期望发生什么。不像理解性测试一样,在理解性测试中,需要向用户简单(但尽量少)描述一下图标所在系统/页面。例如:告诉用户手提箱是电商网站的一部分,请用户找出能够代表的图标。在预测性测试中,不能告诉受测用户网站的任何具体信息,也不能告诉用户任何产品相关的功能。通过这种测试方式,可以了解图标的用户心智模型。

另外,如果有多个图标方案,A/B测试也可用于判断出哪个图标的预测性最好。对于A/B测试,需要分析不同图标下的用户行为差异,同时需要分析用户是否存在这种现象:点击了图标然后又马上返回到前一页。这个现象是一种探索行为,通常说明图标的预测性比较差,表明用户点击图标后,对看到的内容不满意,从而返回原来的页面。在测试不同的图标图形方案时,不同图标需要放在页面相同的位置和使用相同的图标名称,保证没有其它因素影响了用户行为。

吸引力测试方法

图标需要进行吸引力测试,因为最普遍目标是使用图标来增加用户的吸引力,但不能保证所有图标的吸引力都很好。在图标吸引力测试中,既要进行单图标测试,也要进行图标组测试(一个产品或页面会有多个图标,一个产品或页面的所有图标称之为图标组)。

吸引力测试的最简单方法就是用户对图标吸引力进行1-7分的主观评分。如果有多个图标方案,叫用户选择一个最喜欢的图标,并解释对某个图标喜欢/不喜欢的原因。最后从多套图标组选择中,选择一套最喜欢和最不喜欢的图标组。图标组测试主要是为了避免整套图标大多数图标是好的,只要修改少数几个图标,整套图标就可能是最适合产品/页面的图标组。

标准的可用性测试与图标测试

标准的可用性测试可以发现一些图标问题,但不能准确地发现图标的所有问题。例如:在测试过程中,用户被其它一些页面元素搞得不耐烦,甚至不能完成操作任务。即使图标存在问题,但不准确地发现图标的具体问题在哪里:是用户没有识别出图标,还是用户不能理解图标的意义,还是用户没有发现图标?

由于存在多种可能的原因,所以不能单靠标准的可用性测试来评价图标的可用性。

产品开发周期

与用户体验研究方法一样,选择测试方法时需要考虑产品所处的项目生命周期。

1. 规划期:在早期的概念阶段,主要使用有利于形成概念、探索多种设计想法的测试方法。在这个适合进行无背景的理解性、预测性的图标测试,用于判断图标使用的可行性和确定合适的图标心智模型。

2. 执行期:在设计和实现阶段,主要使用有利于持续地帮助系统设计出最好的图标方案。一旦图标方案是可理解的,主要持续地进行无背景的图标吸引力测试,直至得到吸引力优秀的图标为止。接着进行有背景的图标测试,将图标放在真实页面中,让用户去查找目标图标,图标查找时间测试用于量化评价图标的发现性。可用性测试(开始使用纸面原型,后面使用高保真原型进行测试)可以在图标意义理解性与可发现性方面给我们更多的发现。

3. 评估期:产品一旦发布,图标测试主要用于评价图标上线效果、帮助图标持续优化。基于可用性测试的基准测试、图标查找时间测试可以定期开展来跟踪效果。在图标持续优化的过程中,A/B测试是衡量和选择图标方案的最好方法。


更多内容请关注微信公众号:EasyUX

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,491评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,856评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,745评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,196评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,073评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,112评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,531评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,215评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,485评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,578评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,356评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,215评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,583评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,898评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,174评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,497评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,697评论 2 335

推荐阅读更多精彩内容