交互设计,不只是画出来

最近一直在思考交互设计的价值,有时会发现大家需要的只是一份交付物,是让整个流程连贯运作起来的一个环节。而较少会谈到交互这一环节本身还能发挥什么价值,对设计方案、以及交付物的质量可以有什么期待。所以沉淀了一些想法,与大家一起分享、探讨。


不知道你在工作中有没有遇到这样的场景:“这个需求很简单,类似这样画出来就行”、”这个需求很紧急,帮我快速画出主要页面就行,只要这两个页面应该很快”……

似乎对于交互设计师来说,不用完善边界场景、输出完整交互流程图时,完成设计就跟打个响指一样容易。毕竟从表现层来看,除去繁琐的流程图,交互设计的产出物也就是黑白灰线框稿了。

经过再多轮的构思、推演,大家能看到的依然也只是一份似乎两小时就能画完的线框稿。

交互设计并不关乎转瞬即逝的美学…它包括了信息架构(information architecture)的复杂性、以人类学视角理解人类的欲望、可用性工程的利他性本质,以及对话(dialogue)的创建等。

——Jon Kolko


不可忽视的行为塑造者

用户使用产品的过程,可被看作交互,交互设计其实是对用户行为的设计。

而呈现在黑白灰线框稿里的方案,都是服务于行为设计这个目标。例如 当我们把某块内容表现的面积更大、外显信息更完整时,是希望用户视线有更多的停留;在某个场景触发弹窗时,是希望这时用户走进我们预设好的分支路径,优先去处理这项任务……通过一系列的对话、互动描绘用户与产品交互的整个体验地图,确保在用户需要做出某个操作的时候,可以有恰到好处的行为指引。

恰到好处的行为指引

▲ Google Hangouts 在识别出“Where are you?”这类文字时,会自动出“Share your location” 按钮,让用户可以一键分享自己当前位置。通过恰到好处的指引,帮助用户行为更快捷地达成。

▲ Tumblr feed流,用户给某张图片点赞后,右侧会提供更多类似图片。它看似是个并没有太多样式上创新的相关推荐,但我觉得这里是个很巧妙的体验,很好地连接了用户诉求与产品目标。我们常出于社交等动机给熟人动态点赞,但对于内容本身点赞呢?例如看一篇文章或听一首歌的时候点赞,通常得到的回馈只是点赞成功,然后在之后使用时,可能可以慢慢看到更多这类内容。但为什么一定是之后呢?用户期望的如果是看到更多这类内容,当前直接呈现出来会不会回馈效果更明显,让用户更愿意去做这个点赞行为呢?


随时间流推进的对话

对用户行为的设计是通过用户与产品、服务之间的一系列对话达成的,这种对话不是预设好 “输入指令-给予反馈” 就一成不变的,它同样需要考虑到用户所处环境的变化、时间的推进,提供更有效的行为指引。


▲ Google Maps 在行驶途中,当检测到一条更快的路线,会提示用户是否需要切换路线。


塑造和影响文化

对用户行为的设计如何可以影响到文化呢?虽然是个相对漫长的过程,但是观察我们日常使用的产品就可以感受到这种关联。

例如新闻类app该不该采用信息流设计呢?是否适合按时间线来排序呢?

拿“今日头条”来举例,虽然我觉得它并不算一款新闻app,但事实是每天上亿的人用它来了解新闻。按时间维度排序会将最新发布的内容排在前面,鼓励用户不断下拉刷新,从而看到更多“刚刚”发布的内容。对于内容创作者来说,在这种对“新”的追求下,花费很多时间精力写完的高质量内容,可能很快被其它新发布的内容淹没,少而精不如多而新。所以这种信息组织方式,可以带给用户最新的信息唾手可得的满足感,但也不利于优质内容的沉淀,对互联网内容的整体质量可能是负影响。

回顾过去数年人们通过传统媒体看新闻的方式:

- 信息聚焦。和现在流行的“去中心化”相反,它是聚焦的,每天发生的重大新闻头版呈现,每篇的占比、排序是人为组织的;

- 内容有限。和现在流行的随时可刷出“刚刚”发布的相反,每天提供的新闻量是有限的。这种有限决定了创作者们需要精心采集新闻、认真组织内容来确保自己的稿件可以面世,也影响着人们看新闻的习惯、收获和需要耗费的时间。

相比之下,今日美国(USA Today)这类内容组织方式会更接近这种文化,对内容进行有序的组织和更新、创作者大部分来自USA Today自身而不是二次搬运(依赖传统媒体,而不是取代)。

▲ 今日美国(USA Today)vs 今日头条

所以对真正的新闻app来说,在定义如何组织信息如何交互时,可能也需要思考对整个社会文化的影响。是否有可能,在保证商业利益的同时,将用户从信息爆炸中解救出来,呈现出优质的真正的新闻,而不是用算法遮盖参差不齐的质量。当然这已经不单单是交互这一环节的任务了。


不只是线上交互领域

这里其实是更广义的交互,交互设计对用户行为的塑造,虽然在图形界面领域被大众所认知,但并不仅局限于界面。因为交互设计师的同理心和场景化预判思维,在实体交互、语音交互等领域,同样可以发挥着行为塑造的作用。

▲ 钢琴楼梯。通过增加走楼梯的趣味度,改善人们的行为方式。

▲ 伦敦环保组织曾经发起的烟头投票。通过观点可视化+行为引导,鼓励人们不要乱丢烟头。


有效的行为达成

不管是线上还是线下,如何更成功地促成用户的行为呢?斯坦福大学教授BJ Fogg提出了行为模型,一次有效的转化必须同时具备三要素:

- Motivation -给用户足够的动机

- Ability -用户有能力完成转化

- Trigger -需要有触发用户转化的因素

概括来说,就是在恰当的时机(关键场景),用合适的动机来引导用户(需求),做他力所能及的事情(可用性)。

通常可能产品会更聚焦在需求/动机,交互更聚焦在可用性,但是trigger这一部分就会容易被忽略掉。所以从职责范围来讲,交互设计师并不只是接到需求后,完成可用性这一环节,同样可以从体验视角去审视场景。通过找出一个个关键的touchpoint,对这些关键触点中的用户与产品交互模式进行构思,去设计和引导用户的行为。而随着时间推移,将用户辗转于各touchpoint时发生的行为序列串起来,就形成了我们在体验设计中常说的user journey map。

例如视频类产品,在用户看剧需求已经很好满足的情况下,来审视用户的使用场景会怎样呢——

连续剧看的很开心,但是网断了或信号很差怎么办?是不是可以在这时提供音频播放功能,给用户多一种选择,既能继续了解剧情又不太耗费流量。同样的,上下班地铁上离线视频看的很开心,戴着耳机错过站了怎么办?是不是可以设置到站提醒功能,当用户接近目的地但还停留在播放界面时,弹提示气泡等等……可以设想很多可能。

那么这时候,触发点是网断了/要到站了,动机是希望了解后续剧情/不坐过站,同时具备这两项外加用户有能力完成这个操作时,这个行为就达成了。

当然,从场景梳理倒推回产品功能时,需要交互与产品一起看体验与产品阶段性目标的匹配度,例如上面的例子,现阶段是更在意播放时长、还是会员购买量、或是品牌等其他目标,对设计方案能否落地都会有影响。


可用性之外的创造力

“产品必须是吸引人的,令人快乐和有趣的,有效的可理解的”。

—— Norman

前面说到的都是关于行为的达成,而需求方包括我们自己都会经常忘记,除了做到有效的、可理解的之外,还能不能更进一步,让我们的产品比竞品获得用户更多的好感。

可用性之外的创造力,有助于更成功的行为塑造和品牌记忆。

记忆点

打造产品记忆点对用户有着更多的唤醒,可以是特色功能,如b站的弹幕,也可以是小的微交互,如新浪微博刷新后的音效。

每天在众多app中切换,用户会不停接触新信息,也会从大脑中不停释放无关紧要的记忆。而记忆点的形成,有助于用户快速回忆起我们的产品,提升满意度和忠诚度,和同类产品和功能相比也会更有辨识度。

例如同样是点赞,Facebook是表情串的popup、Instagram是双击爱心、medium是鼓掌,这些和自身产品形态相匹配的差异化交互方式,让大众更好地记住了它们。


虚拟的真实

用户在软件界面中交互,虽然多了无线可能,但少了操作真实物体所带来的快乐:触摸、聆听、感受或移动真实物品带来的感觉。所以自然世界包含的情感,在虚拟世界的界面中是天生缺失的。

在行为水平之上所追求的交互方式,应该是考虑情绪体验的。它已经不限制于功能可用的范畴、也不一定对产品数据有立竿见影的影响,但因为在冰冷的界面中恢复熟悉世界里情感上的体验,而给用户带来更多愉悦感,我觉得可以概括为虚拟出来的真实。

▲ Google Maps 建筑的阴影方向根据当前日照方位实时变化。

▲ Mailchimp 如果你点击太多次(和它击掌),会看到它的手掌开始变红。

▲ The Noun Project重置密码后会收到一封邮件,可以看到钥匙icon的变化(如同真实世界中换了一把锁)。


诗意的设计

我们经常会遇到同伴说,“这个不用太纠结了,做个AB Test对比下数据就行”。这种方法也确实是有说服力的,但设计并不是排列组合,不是所有的方案都可以1+2 vs 1+3这样抉择的,因为在你决定在1+2或1+3之间去对比的时候,就已经把设计师还能创造的、可见范围之外的可能舍弃掉了。

诗意的设计更多来自设计师自身的创意、直觉和经验。

第一次听说这个词,还是在香港修设计的时候,某次和导师讨论方案时,他说设计师应该是poetic的。那时候我有一点醍醐灌顶的感觉,头一次把“诗意”这个词和交互关联起来。

再之后看《交互设计沉思录》(我个人最喜欢的专业书之一)时,又一次看到了这个词。作者认为设计师是需要关注人、情感、让世界变得更美好,他提倡创造更具有诗意和文化内涵的交互设计,而不只是停留在可用、易用的层面。

…learn how to design objects that are not just ‘useful’ but that are also intrinsically meaningful both philosophically and emotionally.(……学习如何设计出有哲学和情感内涵的方案,而不仅仅是“有用”就好)

——Chris Gaul 解释Poetic Design


▲ (很早的收藏,找不到来源了)用户按时间线翻看相册时,有光影斑驳的动效,有一种在流逝的时间中翻出回忆的画面感。

▲ Slack 招聘页面的emoji交替变换肤色,传达出平等、包容的文化。


结语

所以交互设计,并不是把产品想法可视化、也不只是解决可用性问题,它需要构建用户与产品交互流程中的完整行为路径,同时也需要拥有可用性之外的创造力。我觉得这个过程就像在盖房子,大的需要考虑房屋结构,小的需要考虑窗户如何设计,我们需要设计出经得住审视和时间考验的房子。

可能我们现实会遇到的是——先快速搭建一个房子,不用考虑和设计太多,哪怕风一吹就倒后面再慢慢修。但就像标题所述的:交互设计,不只是画出来。如果我们在时间精力允许的情况下、在拥有最不用思考的方案之后,还能更进一步地去尝试更多,相信可以发挥出这个岗位更多的价值,也会让团队其他角色对交互环节有更多的认知和期待。

感谢阅读!

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