想知道现在大多数应用和网站有多不人性化?
把那些网站和应用想象成一个人,你试着和它来一场对话,你就知道大多数网站和应用都是多么……不靠谱了!
下面是我最近在一个会议网站上申请一个工作坊所进行的“对话”:
网站:“期望的参展人数。”
我:“额……‘大概二十多’?”(填充区域大概有20个半角空格)
网站:“错误!人数必须是一个数字!”
我:“好吧……那‘20-30’。”
网站:”错误!人数必须是一个数字!“
我:“唔,我填的是数字啊……我想可能不能填写一个范围吧,那填个‘24?’“
网站:”错误!人数必须是一个数字!“
我:”24“。
以上只是一处填充格!
这会是两个人之间的真实对话吗?那样的话”设备“应该会更包容一些,能够接受我第一次的回应内容。或者,他或者她本可以提前澄清所需要的回应内容。如果我填一个空都要如此费尽,那结果应该需要很多安慰或者奖励啊!
在真实的世界中,我们大多数都是很好的交流者。我们也应该如此,毕竟已经练习了至少十年呀!
而网络上和机器的对话呢?
我所知道的优秀的交互设计师,他们至少都会在他们的脑海里”排练“他们所设计的界面对话。
这就使我想到了……为什么我们不把这个练习明确下来呢?用个漂亮的道具(比如一个形象化的浏览器)和一个已经存在的页面当做”剧本“。
看看这个视频吧:https://www.youtube.com/watch?v=hkAFdIrTR00
这是这个视频的对话:http://uxmastery.com/wp-content/uploads/2012/12/stephen-anderson-transcript.txt
这是一个简单的练习,但是他真的很有启发性。
整个步骤如下:
用一个投影仪,把需要评估的界面投影到墙上给所有人看到。两个人”角色扮演“这个交互,第三个人记录。
第一个人—用户—将自己和这个页面的交流想法都大声说出来。表格页面是最适合这个练习了,当然其他页面也不错。
-
第二个人扮演这个页面。他们的对话只能局限于投影出来的这个界面。当然,他们可以任意修饰一下剧本上的台词。别忘了弄一个漂亮的道具来帮助人们进入角色。
这可能看起来有点傻,但这的确很管用,我之前用它来和客户交流,把现存的痛点表演给他们看到。当然,也有很多页面不像这个页面那么适合这种评估方法。但里面总有一部分细节可以拿出来,适用于这个练习。
对话细节
好的交互设计一定是贯穿人与机器交互的每个步骤的。这些交互可以是直截了当的,比如点击一处按钮,或者完成一个表格。也有一些交互是难以表述的,比如试着理解问题和如何回答所产生的停顿,就像开头我写出来的那个对话一样。
事实上,设计师很容易集中在界面元素本身。要求表现出来的信息啊,页面里展现的内容啊。我们经常忽略掉人与机器对话停顿的这一面。
比如下面这个例子:
第一眼看上去,这个页面没什么问题。有些漂亮的图标,有个标题,有个很显目的按钮,但是……
为什么我会在这?我是在期待什么?我到这是为了注册吗?或者是填充我的账号?如果我不注册,那我为什么会有”设置“和”我的书籍“这两个选项?而且,第一句话是什么意思,”我们现在正在搜寻你的书本……“
最终证实,”完成的你账号“按钮会引领用户到”注册“页面,那个页面上有用户熟悉的用户名/密码这两个内容。以这个例子来说,侧边栏就完全不需要了。(既然我不能进去那还给我看干嘛?)
另外,”我们现在正在搜索书籍……“这一行字只是用来分心的,就好像你正在填表的时候有个人在对你说话一样。你可以试着和这个页面来一场对话,你会发现有很多吐槽的地方。
所以,我们怎么重新设置这个页面来解决这些问题呢?嗯,一个简单的登录界面,和一句欢迎词(既然这是用户第一次访问页面)可能更适合一些。
设计微动画
这个概念如今已经被广泛应用了,那么为什么要用它?
想象一下两个人第一次见面,得多小心翼翼的组织一场对话?而且,一场好的对话可不止是语言上的,一些小的细节也是至关重要——语气语调,尴尬时候的暖场等等!
为什么不把这些用在设计一个界面呢?
这就是我们现在流行的:微动画了。我们可以在交互中任何有可能尴尬的场合使用微动画。
就像魔术师需要参与到每个细节中,否则他们想要创造的幻觉就很可能失败。同样的,导演,律师,政治家和其他职业都需要细节来确保他们的努力最终是有效果的,那我们设计师何尝也不是呢?想象这场交互是一场对话吧!是你和系统的对话!
不管你是否是和线上的数据还是和页面后的其他人在对话,都需要把这场对话设计的更合适些。试着用这种方法来排练对话吧!你会有所收获的!
原作:Stephen P. Anderson
译者:林影落
这是一篇5年前的文章,由于上一篇文《五步提高交互设计》有提到,此处单独列一篇作进一步说明。根据自己的经验和现在的趋势,有适当修改。