今年春节回来,还是一如既往的在看奇葩大会和奇葩说,在这一季听到很多次的一个词叫“刻板印象”。从字面来理解,似乎很容易解释,也可以举出很多生活中的例子,比如我们可能会普遍的认为狗狗就是对主人忠诚的,韩剧都是狗血的等等。在奇葩说中,“刻板印象”往往成为选手们另辟蹊径,或从另一个角度来看待某种话题的方式,似乎逐渐成为了一个负面的词语。而随着自己逐渐开始接触设计管理类的工作,往往需要跳出设计方案来看待问题,随即,也开始思考交互设计过程中的“刻板印象”,希望通过对它的这些思考,能够在工作和设计中带来更多的帮助。
什么是“刻板印象”及其作用
刚刚举了简单的例子来解释“刻板印象”,笔者在查阅桌面资料时,发现,它其实是一个心理学词汇,又叫“定型作用”,而人类之所以有“刻板印象”,是因为人类有categorical thinking(类别型思维),这种类别型思维往往使我们产生对事物的固有看法和理解,这些看法和理解可能相对比较根深蒂固,是在看到某些特定人、事、物时第一时间想到的,这些就形成了我们的“刻板印象”。它能够在一定程度上帮助我们快速对事物进行分析和决策,但也有可能让我们无法做出更为理性且准确的判断。
因此,我们也就不能片面地看待它,认为它是负面的东西。那么,正式进入正题,我们就先来看一看“刻板印象”在交互设计中的积极作用。
交互设计中“刻板印象”的积极作用
当我们要去分析“刻板印象”在交互设计中的积极作用时,我们就需要了解,交互设计中的“刻板印象”到底会是什么,来自哪里。而其实也是相对比较明确的,如图1所示,笔者简单举例了交互设计师的“刻板印象”的来源可能会有哪些,比如竞品,自己的经验,其他项目角色,甚至用户等。
图1 交互设计师的“刻板印象”的来源从上图中,可以发现“刻板印象”可能来自于我们工作和设计中的方方面面,因此,它的积极作用也是渗透到工作和设计中的,笔者总结了以下三个方面:
一、针对“自己”的积极作用——用更少的时间做出设计,帮助提升效率,特别适用于紧急需求。
二、针对“团队”的积极作用——团队合作会更为默契,因为可能是“似曾相识”的方案,往往还能减少成本,包含沟通成本和开发测试成本。
三、针对“用户”的积极作用——更容易传递信息,不会太多的打破用户习惯,用户用的会更顺手。
虽然,“刻板印象”会有一些积极的作用,但也会产生负面的影响,从而让我们对真实世界失去客观的判断。而在设计中,也同样会有负面影响,比如,可能会导致设计的趋同性,因为这种趋同性,可能也就看起来并不是特别有创新,如图2所示,旅行类产品的首页趋同性。
图2 旅行类产品首页的趋同性那我们到底该如何避免“刻板印象”的消极作用呢?笔者查阅资料的时候,发现知乎上某位回答者,给了一个答案,很是喜欢,他这样说:方法其实很简单,多去发现类别中的个体的不同就可以了。
因此,笔者基于自己最近几个月的工作和一些其他产品设计上有趣的小案例,来尝试找到一些避免“刻板印象”消极作用的方法,如下。
从案例中学习如何避免负面“刻板印象”
一、来自竞品的结果:先立—再破—再立
从去年下半年到今年年初,我们团队做了一款新产品,叫“小团圆”,定位是:用相片和视频记录家庭美好的瞬间。最初的目标群体是年轻的妈妈来记录宝宝的成长。最终,这款产品并没有成功。抛开产品层面的问题,曲折的设计过程也是值得反思的,其中,在设计层面有一个重要的问题,就是来自于竞品的“刻板印象”。市面上这样类型的产品非常多,比如小时光,亲宝宝等。我们做了大量的竞品的研究和用户访谈,得到产品的关键点:使用照片的拍摄时间和地点来进行记录,方便年轻妈妈们进行回溯。“竞品们也是这么做的”,确实也是这么做的。而这句话,也导致我们最终的设计和竞品并没有特别大的区别。我们只做到了“先立”。
4月份的时候,去了一趟泰国。然后开始用蚂蜂窝的“嗡嗡”功能,发现同样是以照片的拍摄时间和地点进行记录,“嗡嗡”的设计完全不一样,且个人认为比“小时光”“亲宝宝”的体验更好。当时,我们的目标是比它们做的更好,但是,因为“刻板印象”,最终结果是和它们做的很类似。我们就来看一看“小时光”和“嗡嗡”的对比吧,如图3、图4所示。
图3 “嗡嗡”和“小时光”发布内容对比 图4 “嗡嗡”和“小时光”动态流及时间轴的对比上图中的一些体验对比点,我简单举几个例子,比如发布页面,“嗡嗡”的拍摄时间和拍摄地点用户很容易理解,也很明确;“小时光”的照片记录的时间显示,用户完全不知道是什么时间,也就可能导致用户不明白为什么分成了两条动态显示。而动态流和时间轴,嗡嗡更适合回溯;而“小时光”则太像正常的以发布时间排序的动态流,更适合浏览。
从上面例子中发现,我们到底该如何跳出竞品带给我们的“刻板印象”呢?我们不单单要“立”,还要“破”,然后再要“立”。也就是,先做竞品研究;然后抛开竞品、基于我们自己的需求去做设计;最后再回归竞品,看看我们是否更好。这说起来容易,其实做起来很难,因此,我们不单单要看竞品,还要看更多不一样的产品,比如类似场景的产品。但在做设计的过程中,还是要抛掉我们从竞品而来的“刻板印象”。
二、用户的操作效率:能不能再快一点
当几乎所有的产品的消息提醒可能都是一级一级的红点,然后一级一级点击进去的时候,“网易云音乐”没有这样做——点击底部账号tab直达要提醒的消息,如图5所示。
图5 “网易云音乐”的消息提醒姑且不说这个案例的体验是否真的有提升(因为可能需要从多方面评估),但是,就像这个案例带给我们的信息一样,到底能不能让用户再快一点,也许再快一点,就是一个微小的创新,比如当手机推送了一条消息来,能不能马上回复语音或文字(当然这个已经实现);能不能更快找到刚刚听到的歌曲——听歌识曲;能不能更快的发起群聊;能不能更快的发布动态;能不能更快的随手记录(锤子坚果的胶囊)等等。
当我们去思考能不能更快的时候,其实已经开始打破我们的“刻板印象”,再寻求比别的产品更快的体验了。
三、用户的角度和用户的说法:需要正确辨别
从去年六七月份到现在,我一直在做一款TV和手机视频通话的应用。其中碰到一个难题,就是一个用户可能有一个手机端和一个TV端。我最初的方案:尝试站在用户的角度去思考,当我们去联系某一个人时,先找到这个人,然后再去想该用什么样的联系方式;于是,我的方案也就自然而然的出来了,选人—选TV端或手机端—呼叫。
然而,这种看似合理的方式却在实际过程中暴露出越来越多的问题,比如用户每次都得选、手机端还面临非激活状态等等。因此,第一个版本手机助手,我们为了解决这些问题,做了不支持拨打手机端好友,然而,这个需求却是存在的;而第一个版本的TV端,我们为了解决这些问题,尝试用动效和全屏显示来缓和用户每次都需要选的烦躁,结果最终因为盒子开发问题,动效并没有很好的实现。
而当我们抛弃了站在用户角度来去思考的“刻板印象”,为什么一定要先选人?如果不先选人,会有什么问题。后来发现,并不会有太多问题,还在TV助手中更为强调了TV端的概念,使用户理解起来更为顺畅。而TV端,我们保留了先选人的方式(因为修改成本太大),但是还是使用模态窗口来优化选择时的体验,如图6所示。
图6 “天翼视频通话”(手机端好友、电话端好友及TV端呼叫手机、电视)四、来自各方的成本:牢记目标,综合平衡
前两个月时,我接到一个需求:进入某一个模块时,需要有个广告或运营活动的弹窗,我想大家应该在使用滴滴打车的时候有遇到过,打开app,会有一个活动弹窗;而当用户点击“叉”或者除弹窗外的区域时,弹窗消失了;那该如何再次找到弹窗呢?很多产品都会让其直接消失,在页面的某个位置还会放置这个广告或活动,如图7中“网易支付”首页所示。
图7 "网易支付"的弹窗活动当时在和产品讨论的时候,也比较担心,用户关闭了这个弹窗后,再也无法找到它了。于是,PM提出了将弹窗收起成一个小图标悬浮在某个位置(我记着“网易支付”之前会收起显示在bar的左侧/右侧,现在版本好像去掉了);当时被我以各种成本给怼回去了,比如动效成本、开发成本,顶部黄条够不够用等原由,最终,我们选择使用顶部黄条配置同样文案的链接来解决找不到的问题。
因为最近在反思,感觉自己被太多产品思路,成本,项目的思想束缚了,而忽略了更多体验的细节问题。而这些成本早已成了我的“刻板印象”,比如易信“联系人”选择器已经两年没有优化了,但还在各种新模块中不停的复用着。这种关于成本的“刻板印象”无形中束缚了设计师追求更极致的用户体验的意识。当然这种成本“刻板印象”在工作中是必不可少的,但偶尔松动松动,想想初心,去综合平衡。
五、普遍与特殊:我就是我,不一样的烟火
当所有的产品的新手引导普遍都是几个页面翻一翻,有些产品会选择用视频传达感受;当有些产品使用视频传达感受时,“网易有钱”做了对话式的新手引导,如图8所示。而当所有的产品内的功能引导都是“画条线,指一指,它是什么”时,“网易邮箱大师”做了直接在功能中做功能学习,“蚂蜂窝”则将产品目标和情感都融入引导中,如图9所示。
图8 "网易有钱"的新手引导 图9 "网易邮箱大师"和“蚂蜂窝”的功能引导好的设计方案绝对不是普遍的东西,而是:我就是我,不一样的烟火。请抛开我们的“刻板偏见”,去做一些不一样的设计。
六、变化和想象:"这个"能不能变成"那个"
淘宝在上次的大改版更新中,将首页tab变化为“淘标志”,点击后再次变化为“小火箭”的设计,如图9所示,从此,底部tab变化为一个“个性化推荐”功能的快捷入口。当所有产品的底部tab都是静止不变的时候,我们就不禁要思考,它能不能变化?能不能成为其他的东西?
图10 "淘宝"的“淘标志”和“小火箭”上一期“易信”的需求中,有一个需求是“易信晒一晒”的大图查看页需要新增效果广告,来提升商业收入。但这个页面如果要加效果广告,就面临着很多问题:加在哪里,长什么样子等。需求方也给出了相应的意见,加在评论的第一条,但需要保证首屏一定要露出(提升曝光)。然而原页面的排版方式,如图10左图所示,首屏根本显示不出评论,也就意味着根本显示不出广告。于是,我们的交互和视觉设计师也在讨论该如何优化这个页面,来使第一屏显示更多信息。后来,我们看到了图10右图蚂蜂窝“嗡嗡”的大图浏览页面,我们才发现,我们早已被顶部bar的“刻板印象”束缚了,大多数的顶部bar的中间都会显示着该页面的“标题”,有些可能会打通,没有顶部bar;而顶部bar上到底可以显示什么呢?就像“嗡嗡”的“变化和想象”一样,它可以显示更多信息:头像,名字,等级,发布时间。
图11“易信晒一晒”的大图浏览和“蚂蜂窝嗡嗡”的大图浏览所以,我们只要打破“刻板印象”的束缚,放飞我们的想象,这个就可能变成那个!
七、表象和根源:寻求躲在背后的原因
最近,我们在尝试一些新的产品方向的设计。其中就遇到了一个问题,就是比如皇室战争、三国杀、王者荣耀、狼人杀这些游戏的“快速开始”按钮,表象就是一个按钮,但是背后的匹配规则和匹配机制到底是怎样的呢?就像笔者之前有在玩“三国杀”,那时候它的模式是:进入一个房间—每个人准备—游戏开始;如今,它已经变成图11所示的流程了(前一个版本还有的返回按钮,这个版本也没了)。
图12 “三国杀”的快速匹配-开始游戏如果我们只看到表象的“开战”或者“快速开始”,不挖掘这个按钮背后的根源,我们也更容易被“刻板印象”所束缚,我们也无法持续优化产品的体验,就像“三国杀”为什么去掉了“房间准备”,为什么去掉了匹配中的“返回”?其实是在追求更快速的开始游戏的方式,从而能够尽量使用户较少的等待。
最近也在研究实时随机视频模式的应用,有两款产品,“tiki”和“monkey”。我们的设计师发现类似的功能,但在设计上又完全不一样,比如tiki是你要主动去找人,而monkey是等别人找上门来,你选择接受或不接受,如图12所示,这背后的根源是中西方人群的差异,还是两种模式带给用户的心理感受的差异?
图13 “tiki”和“monkey”的模式不同如果我们只是看待表象,我们就更容易被“刻板印象”束缚,所以,当找到了躲在背后的原因,“tiki”还是“monkey”都不重要,我们自己该怎么做,才最重要。
八、情感和贴心:最独特的温暖
情感化设计是每一个设计师应该对自己的高要求,也是设计师往往可以被称为设计师独特的武器,但是往往我们都因为各种原因,缺失着这个武器,所以我们要无时无刻都应该在寻找这个武器。而这个独特的武器,往往能带来独特的温暖,也就无形之中打破了自己的“刻板印象”,使用户对产品的“刻板印象”也消失了,如图13“蚂蜂窝”的空白页和“网易严选”的边边角角。当然,这个很难,笔者也在尝试寻求方法,所以只能举例,无从谈起。希望以后自己能探索到合适的方法。
图14 “蚂蜂窝”的空白页和“网易严选”的边边角角九、寻找空白空间:还有哪里可以利用
就像“能不能再快一点”一样,能不能再有更多的展示空间呢?
“易信聊呗”的第一个版本的“消息”tab就像现在的大多数产品的消息页一样,包含官方消息、评论、赞、通知;当时进行设计时,根本没有考虑太多,就这么做了,如图14左图所示;然而,早在很早前晒一晒早已优化成:将官方消息露出,来占用这空白的区域,来进行导流,如图14右图所示。“刻板印象”让我忘记了“这一片空白”,这片可以利用的区域。
图15 “易信聊呗”和“易信晒一晒”的消息页面还有很多这样的例子,比如我们可能都没有看过“qq”的新注册时进入的新手页面,如图15左图所示;而正常的“我”tab,也不会像“片刻”一样,给我们看一些内容,如图15右图所示。
图16 “qq”的新手页面和“片刻”的我tab因此,世界(界面)本来就是一张空白纸,就看我们如何挥洒最独特的笔墨。
十、探索多样方案:到底可以有多少种布局
之前在做“易信聊呗”话题主页的探索时,当然,根据我的“刻板印象”,我用最快的效率完成了方案,就像图16左图所示的话题主页一样的布局一样,和贴吧,陌陌等产品的话题或兴趣主页都长的一样,也就没那么独特。但是,其实有很多产品有更多的布局和信息展示,比如“same”、“黄油相机”和“in”。本身方案可能是很多样化的,我们根据最刻板的印象来设计的方案可能不会出特别多问题,但是也就不足够创新,只有探索足够多样化的方案,才会在无形中打破我们的“刻板印象”,形成新的经验和印象。
图17 “易信聊呗”“same”和“黄油相机”的话题主页
结语
“刻板印象”有好有坏。在合适的场景、合适的时间、合适的项目中,去最大化它的积极作用,尽量避免它的消极作用,才能真正的平衡我们的设计、工作,甚至生活。当然,到底该如何避免交互设计中“刻板印象”的消极作用,除了上面笔者总结的10条,其他可能会有更多的内容,还是值得持续探索的,希望自己也能在后面的工作中,吸取经验和教训,并打破经验,创造新的经验,再打破经验。
PS:第一次在简书上发文章,之前都在lofter上发,可点击http://alvinzsc.lofter.com/查看,共同交流。
网友评论