UX设计必备的23项审核清单
小编:UX设计指以用户体验为中心的设计。每个产品都需要用户的支持,随着以用户为中心的设计理念不断加强,我们更要站在用户的立场来思考,做用户想看到的产品。所以我们要注意也要避免一些产品中的小缺陷,它可能会极大的影响用户的使用体验,接下来我们就一起来看下这些要注意的要点吧!
在设计过程中,产品中的一些缺陷常常被忽视。表明这些小缺陷极大的影响用户的使用体验。我们把这些要点做成一个列表供设计师将要交付设计工作的时候参考。
请注意,并非所有这些要点都适用于所有产品,但通常这些都是最相关的,谨供参考。
A:交互设计
01.让人感觉不费力的重复操作或频繁操作
为什么重要?重复的操作为了相同的输出(例如,用相同的信息填不同的表格)是一个费劲的任务,并不能帮助用户更好更快地实现用户的目标任务。用户很可能也试图找到变通的办法:例如,寻找其他可以帮助用户更好更快实现目标竞品,这意味着你的产品用户量会逐渐下降。
如何测试:首先应该从分析产品所有的交互逻辑流程和观察用户的行为开始。要确保,如果重复操作存在,产品需要提供给用户使重复动作变得容易的操作方式。例如,提供一个可以使用以前输入的信息的选择。
02.用户可以很容易地从错误中恢复
为什么重要?用户时常地进行一些无意识的误操作或者其操作不能得到期待的结果,此种情况下,产品如果允许用户返回(上一级页面)或者再次操作,用户就不会有挫败感,同时,这保证了用户能够很容易的从错误中恢复正常操作并继续当前的操作流程。
如何测试:首先,确保产品的导航系统允许返回操作,并且操作可以被撤销。然后,当进行可用性测试时,在用户最容易发生误操作创的地方设计场景测试方案并检查用户是否能够很容易的从错误操作中恢复正常。
03.产品需要根据用户的水平给用户提供足够的支持
为什么重要?重要的是要确保你的产品初级用户(新手)有一个平滑的学习和体验。一旦用户熟悉了产品,便可以把设计重点转向功能的使用上来帮助用户更快的完成操作流程。这两种场景方案都可以提高产品的可用性和用户留存率。例如,为专业用户而设计的快捷键,对于新手用户的功能使用提示。
如何测试:首先,检查你是否有这两种不同的功能给新老用户使用。然后,对初学者和专家用户进行产品可用性测试,看看这些功能是否被他们恰当的使用。
04.访问帮助并不妨碍用户操作进度
为什么重要?当用户被卡在产品操作流程中的某个地方时,他们会请求帮助。附加的线上或线下的帮助都很重要,使用户从被卡住暂停操作的地方重新开始并继续操作流程。
如何测试:在用户将要寻求帮助的地方创建测试场景方案,并且看他们的操作流程和进度是否被中断。
B:视觉设计
05.不超过三种基色(基本色)
为什么重要?这不是一个固定的原则。有时,对于特殊情况下,可以使用三个以上的基本色。但是,结合三种颜色已经很困难了,所以在大多数情况下要避免使用三种以上的基本色。
如何测试:确保设计产品时使用的调色板没有超过三个基色。
06.颜色不能单独用来传达层次,内容或功能
为什么重要?易用性对一个产品来说不是加分点而是最基本的要求。对于视障人士,如色盲,单靠颜色传达层次,内容或功能意味着他们将无法使用你的产品并将从产品的用户群中被排除。
如何测试: colorfilter.wickline.org会让你把一个彩色滤光片在您的网页上方,并测试各种不同类别的色盲。你也可以对你的产品进行截屏,用图像编辑器把截屏转换成灰度图并看一看是否能轻易地,您也可以屏幕捕获您的产品,将其转换成灰度的图像编辑器,看看是否可以分开很容易地分辨颜色。
07.视觉层次引导用户完成他们所需要的操作
为什么重要?用户依赖于产品的层次和提示知道自己需要做什么和去哪里,了解这一点非常必要,从而通过使用视觉层级来恰当地引导用户。
如何测试:了解你产品内部的流程逻辑,关键操作是否通过界面的视觉层次来很好地引导激励用户完成操作。
08.处于视觉层级最顶端的内容是最重要的
为什么重要?视觉层次帮助用户快速浏览信息,根据用户的当前需求对内容进行优先级排序。靠近视觉层级最顶端的内容不论对你的业务还是用户都是相当重要的内容并且与用户的需求密切相关。
如何测试:截屏你的产品,并以5像素为半径值高斯模糊那些截图。然后来看结果,你将会立刻看到产品的视觉层次并注意哪些元素脱颖而出。最后反问自己,这些跳出来的元素是不是产品最重要的功能业务板块,是不是对用户最重要的内容。
09.主要操作要在视觉上区别于次要操作
为什么重要?主次操作的视觉区分意味着用户不会感到迷惑当他们与产品产生互动时,同时也将减少误操作的倾向。例如,“提交”和“取消”必须是明显不同的。
如何对其进行测试:当进行可用性测试时,观察那些常见普遍的误操作,主要观察那些由于糟糕的主次操作为明显区分而导致的错误操作。此外,审查设计时,应确保运用颜色,大小尺寸,位置等其他视觉元素很好地区分了不同的操作。
10交互元素不能是抽象的,要直观
为什么重要?当使用新产品时,用户带着一系列的预期和期待,这些期待往往形成于用户以往使用的其他产品的。例如,按钮应该长什么样子,它应该怎样工作。满足用户的这些期望意味着你没有创建不必要的冲突摩擦。
如何测试:首先,查看您的产品寻找其中普通模式(即用户普遍认可的模式)不被使用的区域。例如,链接,看上去并不像链接。
11.要用视觉上明显区分的方式来确认表格的提交(信息的提交)
为什么重要?给用户一个确认或反馈关于他们的操作是否成功执行是至关重要的。例如,提交表单后,一个清晰地确认信息以彩色banner的形式呈现给用户,意味着他们可以继续移动去完成其他任务。
如何测试:检查产品所有需要用户信息输入的地方,用户输入操作完成后,是否触发了有关该操作是否成功与否的确认。确保关于结束状态的反馈是非常清楚的。
12.警报(提示)信息是一致的
它是什么?警报提示消息应具有统一的视觉风格,并以统一方式出现在统一的位置。
为什么重要?有一致的警报提示消息意味着用户将始终永远明白什么是立即值得的。提示信息的不一致不统一对于户来说意味着额外的心理负担每当有新的提示弹出来时。
如何测试:确保警报提示消息具有相同的视觉风格并且出现的位置类似或相同。
13.警报提示消息在视觉上要与界面其他元素有明显的区别
为什么重要?通过确保警报提示信息可以清晰地与其他屏幕元素明显区分,用户可以真正看到这些提示信息对这些提示进行操作处理。
如何测试:你自己检查完视觉差异化之后,要仔细察查看用户在可用性测试中对提示消息的反应。
C:信息架构
14.导航是一致的
为什么重要?导航是用户定向和浏览产品的方式,它直接影响用户是否可以完成他们的目标任务,无论他们当前处于哪个页面。
如何测试:检查产品的信息架构文档,并确保每个页面上的导航都可以被访问,并且它不会改变或消失。在进行视觉设计之前,请尝试卡片分类或树形测试,以确保产品的信息架构的途径是尽可能直观。
Tree testing 拓展阅读
https://en.wikipedia.org/wiki/Tree_testing
树形测试是一种可用性技术,用于评估网站中主题的可查找性。它也称为反向卡分类或基于卡片的分类。大型网站通常被组织成主题和子主题的层次结构(“树”)。树形测试提供了一种测量用户在此层次结构中查找项目的方式。与传统的可用性测试不同,树木测试不是在网站本身进行;而是使用站点结构的简化文本版本。这确保结构被孤立地评估,抵消导航辅助,视觉设计和其他因素的影响。
15.产品的架构要为产品提供增长空间
为什么重要?产品不能在每一个新的功能或内容出现时,就重新设计产品的导航和信息系统。导航菜单和整体布局需要支持多个类别/主题而不会被中断,具有增长空间的设计意味着产品的主要设计和开发工作通过接口界面轻松扩展。
如何测试:询问所有利益相关者关于产品内容如何随着时间不断增长?你会支持更多的静态内容吗?架构需要支持的视频吗?等等一系列问题
D:界面信息排版
16.使用不超过两个不同类型排版组合
为什么重要?这不是一个固定的规律,有时可以使用两种以上的排版组合。但一般来说,匹配两个以上的排版方式不是一件容易的事。鉴于可用性和视觉层次的目的,坚持使用两种排版组合来简化内容的排版层级可以提高用户对产品的理解。
如何测试:只要确保产品的设计没有混合两种以上排版类型的组合。同时,也应该确保你选择的排版组合能够恰当地搭配在一起。
17.用于文本内容的字体大小至少12像素
为什么重要?同样,它不是一个固定的规律,理论上为了满足非常特定的需求和目的你可以使用更小的字体,但是一般俩说,文字尺寸小于12像素,内容的可读性性会严重降低。
如何测试:检查所有内容,并确保所使用的字体大小至少为12个像素。
18.保留大写字用于标签,标题,或首字母缩略词
为什么重要?众所周知,限制使用大写字或单词有助于理解,,限制大写字的结果是让界面文本看起来没那么沉重方便用户消化理解。总之,大写的字体应该被专门用于强调或者在非常有限的情况下使用大写字体,比如首字母缩略词。
如何测试:运行一个彻底的内容检查,确保大写单词被限制到或者只标题,标签,或首字母缩写词。
19.不同的字体样式或系列组合被用于区分内容和控件
为什么重要?在这一点上需要有明确的指标,关于什么是内容,什么是控件。也就是,什么是用户可以与之交互的。这些指标可以是大小,颜色,位置,字体等。其中,字体是一个非常重要的指标:使用不同的样式或系列组合意味着用户不会被迷惑,很容易就能确定哪些元素是可以与之交互的。
如何测试:确定找出产品中的所有控件,并确保他们是从内容中脱颖而出。当进行可用性测试时,注意观察用户是否在与控件交互时遇到困难。
20.字体大小/权重用于区分不同的内容类别
为什么重要?字体的大小以及权重严重影响可读性和用户的理解。在标题,副标题和段落之间做出明确区分可以减少理解消化内容时的心理负荷。同时,这样做也可以视觉上的良好效果,让内容界面看起来更舒适更好。
如何测试:在审查你的产品里面的内容时,确保标题,副标题和段落使用不同的字体大小和权重。
E:用户界面
21.相似的功能或内容要接近和对齐
为什么重要?用户倾向于把功能或内容上相互靠近的元素归为一组。导航栏是一个很好的例子可以说明这一点。根据这一模式和把相连元素分组的倾向意味着用户可以很快了解产品的界面。
如何测试:寻找那些在功能上类似的项目或元素,看他们是否可以被组合到一起。
22.进度指示器(进度条)用于产品中多步骤的操作流程
为什么重要?特别对于多步骤的操作流程,用户很容易感到不知所措或不知道多久可以完成整个操作流程。进度指示器便可以帮助用户定位自己的操作,但更重要的是它给用户创造了操作的成就感,并降低跳出率掉线率。
如何测试:检查产品中的所有的操作流程,那找出那些为了完成某项任务而需要进行一系列不同的操作界面,然后确保设计指示器(进度条)来告诉用户操作流程的进度。
23.前景元素(像内容和控件)很容易与背景区分开
为什么重要?这一点对有视觉障碍的人非常重要。它也提高了用户的学习曲线和理解。明确区分有利于导航,方便用户注意到按钮等控件并提高产品的一般可用性。
如何测试:截屏你的产品界面,然后以3-5像素为半径值高斯模糊那些截图,这时再来看结果,看是否可以轻松地辨识出哪些东西处于界面背景中,而哪些东西处于前景之中。
最后,恭喜你有足够的耐心浏览完该列表!
…但是,这一切并未结束。
你的产品现在更加稳固了吗?你可能已经在几个方面取得很大改进?也许现在更容易被访问, 例如… … 但请记住时刻保持测试,收集用户反馈,并继续迭代。
speckyboy
原文作者:Fabio Muniz
译文作者:学UI网翻译社-haha;校对:学UI网翻译社-鼹鼠