来学吧—CCTV《超越》栏目教育培训行业合作伙伴, 专注于产品经理人才的培养9年. 乐产功场®培养产品经理的黄埔军校. 联系我们 优势解读 课程设置 关于我们

思考:如何在体验设计中营造「惊喜感」

http://laixueba.com 2017/3/15 16:17 作者:鸿影 来源:来学吧
在平时的设计工作中,我们有时候会陷入一种「千篇一律的平淡」式苦恼,觉得类似的产品基本都是差不多的信息架构、布局风格、界面元素。
文章来自于【来学吧】http://laixueba.com/ixd/view.asp?ArticleID=2105

  在平时的设计工作中,我们有时候会陷入一种「千篇一律的平淡」式苦恼,觉得类似的产品基本都是差不多的信息架构、布局风格、界面元素……自己按照各种方法推导下来的结果也难逃窠臼;而如果想要做一点不一样的创新突破,又容易走进「为设计而设计」的误区,非但不能讨得合作方和用户的欢心,还会招来类似「为啥不按 xx 产品那样做」的质疑。

  过去几个月来,我一直在试图驱动自己多思考怎么赋予自己的设计以更多的「惊喜感」。首先要明确的是,「打破常规」只是「创造惊喜」的充分非必要条件,相比盲目追求「为了不一样而不一样」,尝试有逻辑多维度的联想发散,带给了我更多有意思又具备一定说服力的灵感启发,下文中就我就举近期几个思考的例子来说明。

1. 谐音联想

  在背单词、想文案、译商标时,「谐音联想法」经常被有意无意地用到,很多流行一时的网络用语也源于一些内涵的谐音词汇。而在设计工作中,谐音联想则可以帮助我们把一些抽象或无味的词汇,可视化成生动有趣的形象。

  前段时间组队参加部门的 Hackathon 活动,需要设计一个类似「压力指标」的数据图表,最开始的时候我想到的是可视化成气压计、仪表盘之类的形象,比较直观和常见,但也偏于平庸、没什么惊喜感。

  转机发生在一次用拼音输入「压力值」的时候,无意间瞥到输入法的建议列表中给出了「鸭梨」一词,瞬间想到几年前的流行网络用语「鸭梨山大」,于是我想:为什么不直接把压力值可视化成一个梨子的形象呢?还可以进一步拓展:压力值越高梨子个头越大,给梨子加上各种微表情,可以像「切水果」一样切碎梨子来「释放压力」等……这下可比气压计仪表盘之类有趣多了,方案也得到了小组内伙伴的一致肯定(虽然还是遗憾地没能获奖哈哈~)。

2. 行为联想

  动效设计研究是我这半年来一个主要的专业沉淀方向,也没少搜集体验各种界面动效设计案例,但感觉大部分的动效设计还是停留在诸如「让体验衔接更流畅」、「吸引你的注意力」之类的阶段,对于深层次一点的有温度、有情感的动态行为挖掘并不太深入。

  之前听公司里一位资深设计专家的分享时,他举了一个设计案例,为了在产品中体现出「主动积极」的商务礼仪设计语言,为左右切换 Banner 的箭头入口做了一个小动效,当鼠标 Hover 到箭头附近时,后者会主动向鼠标靠近,就像商务场景中对方主动来向你握手一样。虽然只是一个很小的细节,但却能给人以触动。

  最近在做对话式交互产品的案例搜集工作,在 Dribbble 上看到了一个 Google 用来招聘实习生的作品,是一个类似 Google Allo 的对话界面,效果如下:
  

  图片来源:https://dribbble.com/shots/3252414-Be-a-2017-Google-intern

  虽然对话气泡出现的动效用在实际产品设计中,会显得略于浮夸,但这却给了我一个启发,是不是可以考虑给对话气泡赋予一些有情感的动效呢?比如当我给这个气泡的内容点了赞,气泡会感到「高兴」而蹦蹦跳跳一下;当我觉得气泡里的回答没有任何帮助,气泡会因为「沮丧」而瘫软成一团烂泥;当我表达了愤怒生气的情绪时,气泡会因为「害怕」而瑟瑟发抖……把设计的对象看成一个有血有肉的人,再去思考怎么赋予它的行为以意义,也许可以更好地帮我们做出「触动人心」的动效设计。

3. 通感联想

  「通感」是我们在中学时就学过的一种修辞手法,「将人的听觉、视觉、嗅觉、味觉、触觉等不同感觉互相沟通、交错,彼此挪移转换,将本来表示甲感觉的词语移用来表示乙感觉,使意象更为活泼、新奇」。

  在体验设计中我们同样可以运用「通感」,不过受限于平台,嗅、味、触觉的施展空间不大,大部分情况下主要都依赖视觉与听觉元素的转换。比如说给用户操作以反馈的场景,大部分设计可能只考虑了视觉一个维度,可能做出水波扩散、烟花绽放、漫天彩纸片飞舞一类的特效,如果再加上符合感觉的对应趣味音效,也许就能把氛围渲染得更上一层楼了;而对于FM、音乐播放器一类的应用,则可以反过来把声音具象为视觉元素,比如把声波具象为一轮轮扩散的涟漪,挖掘声音中的情感等……

  当然,可以在体验设计中营造「惊喜感」的方式千千万万,以上几点不过是冰山一角罢了,只是因为最近恰好有用到一些,所以归纳记录下来,也欢迎大家一起来分享你们用过的有意思的联想案例哦~

新浪微博