如何有效地设计出与用户“流”相匹配的交互-about face读书笔记

当人们全身心地投入在某个活动中时,会对周边干扰视而不见,这种状态被称为"流"。人们进行游戏或其它创造性活动(编程,绘画)时更容易进入“流”,而日常生活中这种状态却很少。about face这章所讨论的“流”并不完全是游戏等娱乐或创造性工具中用户进入的那种“心流”状态。因为比起游戏可以让人通过创造性成就和能力的提高带来的满足感和愉快感,绝大部分交互产品是希望用户使用产品时能高效顺利的完成任务。所以本文讨论的是,如何有效地设计出与用户“流”相匹配的交互,对于用户想要完成的任务或者产品希望用户去完成的任务,提高其效率,完成率和流畅度。

策略一:在用户执行任务前-避免空状态

对于大多数人来说,从空白开始很困难,而在别人做好的基础上开始则会更简单

在PC端的PPT或者word上,用户创建新文档时,产品会默认创建一个空白文档,而不是首先打开一个对话框,让用户去设置每一个细节。大部分用户都希望产品能迈出“足够好的”第一步,然后按照自己的需要调配,提供模板也是这个道理。同样,产品可以用这种方式将用户逐渐导向目标。

策略二:提供非模态反馈,尽量避免模态的弹出框

产品有多种方式向用户呈现或反馈信息。对于模态反馈,比如弹出框,它让程序处于一种特定状态,用户必须进行相应操作后才能返回以前的状态,这就打断了用户当前的操作流。而非模态反馈则不会干扰或打断用户当前的操作,它把用户需要的信息构建在界面中,不需要用户去操作。

这里以在网易云音乐里发布动态这个任务为例来说明设计原则

网易云音乐定位移动音乐社区,产品希望所有人能在这里找到音乐的归属和情感的共鸣。对于UGC社区而言,如何让用户自发的去创造内容是产品的关键。那么这里的设计目标就应该是提高发布动态这个任务的完成率和流畅度。

网易云音乐iOS3.5.2

从第一张图可以看到,在用户输入文字前的空状态,产品就有文案提示,“一起聊聊音乐吧”,引导用户发布关于音乐的感想。这里有个细节是,当用户进入这个页面时,产品可以自动在文本框获取焦点,既减少了用户的点击次数,又去引导用户输入内容。然而,产品此处却没这样做,也许是考虑到输入栏的高度问题吧。

第二张是用户没有给动态配上音乐就点击发送的情况,显然,出现这种错误是因为产品的限制。产品希望用户发布动态必须配上音乐,把音乐作为一种情感的载体,符合整个社区音乐分享的氛围,同时也是把相关动态推荐给其他人的基础。这是产品的目标。当用户没按产品目标行事时,“给动态陪上音乐”这栏会短暂地以红色闪烁一下(安卓版本是以振动的形式),提示用户这里出现了问题,而不是跳出一个弹出框,让用户确认自己的错误。产品采用的非模态反馈没有打断用户的操作流,并且清晰的告知用户问题所在,让发布流程更流畅进行。

策略三:少即是多,减少不必要的页面跳转

必须以更少的元素做更多的事

书里举得一个例子是,在很久以前的window应用程序的一个“保存”对话框中,用户不能重命名或者删除看到的文件,用户必须去其他页面才能完成这类操作。不过现在的window已经开始基于用户的使用场景来提供合适的功能,用户不需要经常切换不同界面来完成简单常见的任务了。其实这就要求单一界面并不只是满足一项需求,而要根据场景,满足其衍生的需求。

策略四:尽量将用户操作所需信息储存在界面中

准确所需要的知识并没有完全储存在头脑中,而是一部分在头脑中,有一部分来自外部世界的提示,还有一部分存在外界限制因素之中。——设计心理学

输入和选择    wps中修改字体,用户不需要记忆特定字体,只需要在下拉列表中选择即可。然而,当字体类型过多并且用户完全知道字体名称的时候,用户在众多的选项中找寻字体是很难的,这时候用户直接输入反而更方便。总之,输入会让用户付出成本,一方面是用户的记忆成本,另一方面输入也有操作成本,同时无法避免用户犯错的情形。而选择虽然通过将一部分信息构建在界面中来减少用户的记忆成本,避免用户犯错,但是当选项过多时,会产生新的筛选成本。

WPS演示

配置和调用    很多程序中,如果你要求打印一份文档,它们会开启一个复杂的对话框,要求你说明要打印多少份,纸张大小,黑白打印还是彩印等等。但是更合理的设计是使用一个命令进行打印,而使用另一个命令设置打印。打印命令使用上一次的设置或者(默认)标准设置直接打印;打印设置功能提供所有关于打印的选项。word中就存在快速打印的命令,不需要对话框。通常,如果一个命令调用了10次,才设置1次,那么最好让用户10次中只有1次明确地请求设置,而不是10次中用户9次拒绝设置的对话框。这里提到的调用,就是让产品根据实际用户的需求,默认一些选项或者记住用户的操作(上一次或高频),将这些信息储存在界面中,提高的用户完成任务的效率。

策略五:隐藏弹射座椅的操作杆-合理的组织界面元素

在喷气机的驾驶舱中存在一个弹射座椅的操作杆,飞行员拉动操作杆就会同其座椅一起弹射出去。弹射座椅是飞行员应对紧急情况所必须的,但是正常情况是不需要的,并且如果被放在明显的位置,就会让飞行员不经意间拉动,造成很大的麻烦。界面中的元素组织也存在类似的情况。

界面元素组织的三个原则:

使用频率:高频功能应该放在触手可及的地方,低频功能确保一俩次点击就能实现,如果很少使用,放置的层级可以更深些。抽屉导航模式是这里明显的例子。

转化程度:某些功能或命令会引起正在处理的界面或者文档,信息突然发生变化。一般来说,最好将这一类型的功能隐藏起来或放在难以触及的地方。PPT或者word文档中,视图变化的button被放在下方很不起眼的位置,且视觉面积很小。另一个不典型的例子是iOS系统的返回,很多用户向苹果用户体验设计师反馈返回键放在左上角操作不方便,苹果设计师给出的理由中就有,对于这种极易引起界面信息变化的命令,应该设置点击难度。当然,这里的情况是该考虑高频操作应该注重效率还是该考虑转化程度带来的后果,哪个问题的优先级更高些,还需最后一个原则。

风险承担程度:某些功能或命令会带来不可更改的功能或者更改后会产生危险后果。对于上面的问题,返回引起的界面跳转,带来的后果是否严重了?不同场景不同对待,如果用户在阅读一篇长文章时误触返回键,导致用户必须再次点击进入找到上次浏览的位置,这样的体验是糟糕的。但是如果是普通的下一层级返回上一层级,比如聊天界面返回信息列表,误操作的后果并不严重。所以,我们要结合以上三个原则来判断界面元素的组织,因为突然的界面跳转而引起严重后果的返回操作频率较低,而多数情况是不会引起严重后果的,所以这里我认为依然是效率优先。关于操作带来的风险问题,另外一种解决方案是模态的弹出框,让用户仔细确认后再执行。

策略六:为响应优化,但容许延迟

在互联网产品中,用户对响应时间是及其敏感的,研究表明,0.1秒以内,用户才认为系统的响应是即刻的。但是如果无法避免响应时间过长的情况,可以让任务在后台执行,从而允许用户继续做其它工作。无论如何,要有明确的状态反馈(进度条,时间等),而取消机制这时很关键。

策略七:合适的动画

交互中的动画,首要目标应该是支持和增强用户的流状态,帮助用户创造一个强烈的心理模型,把当前信息与上一个视图的信息联系起来。

创建一个成功的产品需要的不只是实现实用的功能,也必须考虑如何编配不同的功能元素,让用户执行任务像流水一样感觉不到障碍。最好的界面通常不会让用户惊叹它有多漂亮,而是因为能够几乎不会被人注意,毫不费力地使用。

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

推荐阅读更多精彩内容