美文网首页UI/交互设计规范
《设计规划|用户体验设计技能(二)》

《设计规划|用户体验设计技能(二)》

作者: 冒险愉快 | 来源:发表于2017-02-21 10:22 被阅读69次

接上一篇《需求分析|用户体验设计技能(一)》

在上一篇文章中梳理了如何做需求分析,那么接下来说说如何进行设计规划。

在确定需求之后,设计师并不是马上打开软件开始画图,任何优秀的设计都要经历充足的规划过程。

我们根据需求来确定提供哪些必要的信息给用户,然后将信息分类、组织起来,并以导航的形式展现在界面上,让用户可以快速找到想要的信息。

设计师根据需求设计相关的信息和任务,通过组织信息架构、引导用户完成任务得到一系列关联的界面草图,再细化草图为具体界面。也即:需求→信息/任务→草图→界面

一、信息组织与任务设定

我们在拿到需求以后就开始试着用软件画界面,但这往往会在设计过程中发现某个界面细节逻辑不通,到最后页面逻辑一塌糊涂。

症结就在于对信息的组织和任务的设定,只有搞好信息分类、导航设计、任务设计,才能快速绘制出草图。

1.信息分类

1-1亚马逊官网

今天暂且拿亚马逊来分析。比如要买件女装T恤,我们平时在商场往往是先进入女装区域,再在摆放上衣的货架上挑选T恤。那么在电商网站上也是同理,按照“女装>上衣>T恤”的逻辑,换成“上装>女装>T恤”是不是有些奇怪?这就涉及到逻辑归类。我们可以使用人们在生活中熟悉的分类逻辑对内容进行组织。

2.导航设计

设计师认为导航逻辑清晰,就是搞不懂为什么用户很难找到自己想要的内容。很大程度上是因为导航设计出了问题。这也就是设计师为什么经常会面临一个问题:用户习惯和产品逻辑,到底哪个更重要?

首先是导航能否做到自我解释,为用户解释“我从哪里来”,“我现在哪里”,“我能去哪里”。就像前面的[图1-1],网站左上方的Logo告诉用户正在访问亚马逊官网,Logo下面的标题“全部商品分类”告诉用户整个页面属于这个分类下,“全部商品分类”下面的导航栏里标亮了“服装/鞋靴/箱包”,表明了用户现在的准确位置,用户可以选择与“服装/鞋靴/箱包”平级的类目,也可以寻找更细分类目下的女装。

另外就是导航的深度和广度。导航的信息组织中层级的数目就是导航的深度,每一层级中包含的菜单项数就是导航的广度。如果导航深度过深,用户就需要耗费多次点击才能找到所需的信息,而每多一次点击操作就会流失掉一批用户。如果一些细小的信息隐藏得过于深入,用户可能很难找到。所以导航的深度广度需要再三斟酌。

1-2淘宝的分类导航

为重要功能和常用功能设置快捷入口也很重要。以淘宝为例,“购物车”从逻辑上应是包含在“我的淘宝”中,但是淘宝却把“购物车”拉出来列为与“我的淘宝”平级的项目。因为无论是对用户购物来说,或是从网站销售目标来说,“购物车”显然都起着至关重要的作用。用户在使用时只希望能够立刻找到自己想要的功能,并不会考虑到产品逻辑。但要注意的是,若是设置的快捷入口过多,反而会降低用户的使用效率。

3.任务设计

1-3某网站界面

不要担心浪费空间,过于“贪心”导致出现如[图1-3]的情况。要解决这个问题就需要我们确定主要任务和次要任务。那具体怎么设计任务流程呢?

首先设计主线(主行为流),即把杂乱无章功能点根据用户的期望即目标正确的次序组织起来的过程,来告诉用户需要先做什么,再做什么。至于支线(次要行为流),得看此行为流能否对主行为流有所帮助。

在任务流程确定以后,就可以通过草图表现出来,就得到了任务流和页面流设计,然后再慢慢细化具体的界面。


二、界面的设计与规划

下面说一些技巧,用以设计出更易用的界面,减少用户理解和操作的成本。

1.简化操作

由于人们处理信息和记忆细节的能力是有限的,如果想要减少用户所耗费的注意力和理解力,我们就要试着减少多余步骤和干扰项。

1-4两款闹钟

比如上图的两款闹钟,你会更倾向哪一款?很显然第二款更简单明了,大大较少了用户的操作成本。

再比如下图[图1-5],我们经常出现视频看到一半掉线的现象,然后白白浪费了流量。所以适时提供合适的首选项、适时帮助、及时反馈、提供合理的默认值等等,都可以帮助用户降低出错几率,使用户有更顺畅的使用体验。

1-5某视频软件播放界面

在页面设置上我们要页面层次不言而喻,在视觉呈现上,突出信息模块之间的逻辑关系。逻辑相关的在视觉上分为一组,利用“接近原则”,因为物体之间的相对距离会影响我们对组织方式的感知。

内容或重要程度不同的在视觉上体现出差异。利用“差异原则”,强化差异对比。

逻辑上有包含关系的在视觉上进行嵌套。逻辑相关的内容,在视觉上也要呈现出相关性,使用户一目了然。


三、快速表达:纸面原型

纸面原型其实更具有可塑性,能够快速修改重建,也不需要什么高级的工具,使用马克笔等等的线条粗细表现出界面的层次关系即可。如果是团队合作也可以在白板上绘制,如下图。

纸面原型最需要关注的是框架、流程、基本功能和内容,设计细节可以忽略。对于界面的逻辑关系,可以用绘制的深浅和颜色来表现。如下图。

今天就写这么多啦,好像每天晚上都是越写越困,明天继续更新~晚安。

相关文章

网友评论

    本文标题:《设计规划|用户体验设计技能(二)》

    本文链接:https://www.haomeiwen.com/subject/oamywttx.html