交互设计

[译]交互设计的5大支柱

0
登录或者登记去做吧。
1464103735-3021-B9yibobL5vyjpfUVBNfRwucvLRTQ

正如同我在《交互设计最佳实践:卷1》中描述的那样,要做好交互设计,需要对多个学科有着深入的了解和熟练的掌控,因为要使一个由一系列对象组成的系统让人用起来感觉良好、易于学习并且有用,是很不容易的一件事。

首先让我们从交互设计最基本的概念说起,分解其核心设计原则,然后通过五个步骤来更好地进行交互设计。

优秀的交互设计是由人类的连接驱动的。但是到底是什么驱动着人类连接,并且它又是如何转化为数字化界面的呢?这些问题的答案不是非黑即白的。在我们的经验中,优秀的交互设计依赖于基础用户体验设计的完美执行。

一、目标驱动的设计

即使你不亲自参与进行用户研究,但你还是需要知道对设计的构建有成熟的认知。

1464103736-5388-KdMn8PicUlq7kUJiajEmXd6oHBNg

我们找到了以下的用户体验设计过程,可以帮助你与那些有血有肉的用户保持同理心:

1)创建角色——角色是根据你的目标用户的行为和心理虚构出来的人物。当你在做至关重要的设计决策时,角色往往能作为参考派上用场,例如,“作为季节性购物者,莎莉会喜欢什么样的结帐过程?”

2)用户场景——与我们创建的角色相呼应,用户场景解释了角色在使用网站时将如何采取行动。例如,“黑色星期五,莎莉会在工作之前就准备好一长串的要网购的礼物清单。“用户场景迫使你去探索角色与你的产品交互的情境。

3)体验地图——从用户场景更进一步,体验地图记录了围绕单个交互的所有条件,包括情感和外部环境。“由于在滑雪旅行的时候莎莉的腿部骨折了,这让她很生气,作为季节性购物者,她一定会尽快地进行她的圣诞购物。”

这三个技巧帮助我们构建出了一幅完整的体验画面:用户、场景,整个情感旅程。

二、可用性

确保可用性是最低限度的设计。如果你的产品无法让用户正常地使用,还谈什么吸引用户。系统的可用性必须保证让用户觉得毫不费力。用户在探索系统上耗费的时间越短,就越能更快地完成操作。

三、功能可见性和表意符号

功能可见性的概念是指,一个功能必须为自己说话,并表明自己的用途(比如道路用来提供给用户行走)。而表意符号则象征或者暗示了功能可见性(比如平坦道路暗示你可以用脚在上面行走)。

没有表意符号,用户可能无法感知到功能的可见性。

1464103735-9445-ASePW61ic0ng4kf9ZNJODmkMtFjA

在上面的示例中,您可以看到按钮设计的进化。第一阶段它没有任何表意,看起来就像标准的文本,而第三阶段则类似于真实的按钮,具有圆形边缘和渐变。

1464103746-1342-2ZOvOLAykSXXQ1icPJiciakpFn3w

表意符号也可以比喻或者暗喻的形式存在,因为人们还需要知道为什么要与界面交互,而不仅仅是能不能交互。在上面的iPhone Dock示例中,隐喻的图像(手机、信封、音符)达到了沟通的目的,你会知道点击按钮可以达到什么样的目的。

四、易学性

在理想情况下,每个用户只要进行过一次操作后就能记住所有功能。然而现实情况并非如此。熟悉感和直觉性必须被设计到每一个界面中去。

成功的交互设计是通过创建一致性和可预测性的设计来降低整体的复杂度的。例如,有的页面应该保留,链接尽量在新页面中打开;而有的页面涉及到特定的操作和流程,不能在新页面中打开,防止用户重定向。

一致的设计确保了设计的可预测性,进而提高了易学性。

提高易学性的一个常见的策略是使用成熟的UI设计模式。许多网站和应用程序都已经在使用这些模式,用户对它们很熟悉,而你仍然有足够的创作空间来定制你站点中的设计元素。

1464103745-4829-CsuzoPNXOKwwhADmRp9HGFOGjqpQ

例如,面包屑导航就是一种常见的网页设计模式,用来帮助用户浏览网站。不管在什么网站,如果你看到面包屑导航,你就知道怎么使用。这种熟悉感有助于提高产品的易学性。当产品是易学的,就能鼓励人们去使用它们,自然而然地提高了可用性。

五、反馈和响应时间

反馈是交互的核心。因为每次交互都是用户和产品之间的对话,所以你的产品最好保持着友好、有趣且有用的特性。

无论是精心设计的动效、有趣而生动的微交互,还是一个简单的哔哔声,你的产品必须同用户进行沟通,给予反馈,不论这个操作是否完成。

在下面这个是来自于Hootsuite的例子,如果用户较长一段时间没有操作的话,这只猫头鹰就会“睡觉”,这样的反馈是聪明而有趣的,并且实际上把一个可能算是负面的体验(停止更新数据)转变成了一个积极的体验。

1464103750-8517-F15TubOvWCc1KrWgMXlrB7U4kE4g

反馈的另一个关键因素是响应时间。最好的状态当然是立即响应。想象一下,如果你在弹吉他,每个音调都在弹奏后好几秒才出来会多么让人烦躁。

改进交互的5个步骤

现在你已经知道了那些基础原则,接下来我们来介绍改进交互设计的方法。

著名的交互设计师斯蒂芬·安德森建议过,当你作为用户使用你的界面时,如果有个真人扮演你的界面与你交互,将会令你大开眼界。任何一个尴尬的反馈都会被放大,你会在这个过程中学会规避反人类的交互设计,一旦你完成了这些角色扮演,就可以开始编写交互的脚本,并重新组织你的交互了。

过程是这样的:

1)角色扮演和互动:随便抓两个人过来,一个作为界面,另一个做笔记。做一个浏览器窗口的牌子由扮演界面的人举着,再把界面用投影仪展示出来。然后,你扮演用户,同“界面”进行对话,其中你作为用户解释你的目标,而“界面”只能通过标签,菜单以及UI中的其他元素与你进行反馈。好好地观察并记录,看看结果会怎样。

1464103758-3453-B9yibobL5vyjpfUVBNfRwucvLRTQ

2)勾勒出故事线索:把体验的每一步都记录成文档,包括每一步的任务和用户情感。就像在《用户体验设计文档指南》中所讨论过的,这可能简单到只是几个用户场景,也可能复杂到是一个四层级体验地图。

1464103763-8266-BPtUSthjxykBWKEVyibCTWar29cw

3)简化步骤:有时候用户要达成目标需要经历许多步骤(比如在网上订机票)。在制作原型的时候,就应该将一个复杂的目标分解成为一系列简单的步骤(比如询问目的地,然后设定出发/到达日期,等等)。例如,维珍航空的阶梯型设计,就是为了让预订过程更简单易行。

1464103765-1494-ZMlSD0xK6gFVVfLCxhAXIq9dw5qg

4)限制用户的选择:这可能是最困难的一步,但是你必须尽量减少用户的操作。时刻提醒自己,这个步骤当中的每一个选项是不是非要不可的,如果不是,将它分离到其他的非关键位置。

5)注意微时刻:Micromoment,这是一个新的合成词,指的是用户在与界面进行交互的时候可能会犹豫,前进,或者突然停止。回想角色扮演的环节,你会记得那些犹豫、忐忑的时刻。为了让交互更清晰,你应该充分考虑每一个细节上的文案,结合可靠的UI模式,引导用户在这些微时刻作出对的选择。

不注意细节魔术师的魔术会失败,同样的道理,糟糕的交互会毁掉整个用户体验。上面的流程可以帮你让交互设计成为界面和用户沟通的桥梁,而非单纯地让界面“动起来”。

结语:

交互设计并不单单是关于界面的行为,它是一项基于用户行为的适应性技术,你必须知道你的目标用户在功能和情感上的喜好和期望。然后在技术限制的情况下,设计出令人满意的产品。

最好的交互设计大概就是这样的:你的产品要能及时响应,不要让人有太多的思考,并且操作起来很顺手。

-END-


作者:Jerry Cao,一位就职于UXPin的内容策略专家

原文地址:http://thenextweb.com/dd/2015/03/03/the-5-pillars-of-interaction-design/

令人惊叹的移动交互设计欣赏
交互设计的实质是行为塑造