如何在产功上做更多的创来体现设计值一直是设计师注的话题,尤是在体系成熟的产里,如何对善的基本框架和功进行突破,如何挖掘户的互诉求并拓展更多的互行为等对于设计师来说都是很大的挑战。我们从前期互行为的挖掘、情感的视觉体验打磨及趣味的玩法升级个方面,剖析 Qzone 击掌功的整个设计历程,或许为大供一些参考性的思路和设计方法。
我们先从真实生场景中的互说起。
人与人之间的互动无处不在,它是我们生活中必要的组成部分,也是整个人类的基石。从质上来讲,产品要决的问题就是人们之间互动的问题。么何定义互动呢,我们以从常的生活场中窥得一二。
1. 反馈链
首先,让我们来看一看常生活中的互动案例:
是一个很常见的熟人互动案例,我们以看到,熟人间很容易产生题,并持续互动下去。但是果同样的题生在不是很熟悉的人之间,能就是另一番场:
在例二中,因为 A 与 B 互相不熟悉,所以 A 没有对 B 的回复产生进一步互动,对因此结束。我们以进一步推理,其在个案例中,不管原因变成什么,只要 A 没有响应 B 的反馈,么 A 与 B 的互动就大概率终止。
是因为良的互动行为一定是双方(或方)的互相行为,一旦因为某原因导致其中的反馈中断,互动将无法持续。
由此可以总结出:互动在本质上是由一系列的反馈(互动)组成的一条反馈链。
2. 反馈质量
但是光有反馈链还远远不够,在场下,我们往往希望反馈链够长,样才能让互动双方产生感情升温。在例二中,其是存在着一条很短的反馈链的,A 与 B 只互动一个回合。A 没有继续响应 B 的反馈,是因为 B 的反馈质量低。试想,当 A 向 B 问时,若 B 的回复是「早上,你今天穿的精神!」么 A 不响应 B 的反馈呢?我想大概是的。
由此可见:反馈链的长短取决于每次反馈(互动)的质量。
高质量反馈具备很多特,其有三个尤为要:
反馈链中的指向性
日常生活中的互动行为,一都会以一个「握机制」作为开端。这个握机制可以是显性的(直喊出对方的称呼,可以是名字、外号,也可以是关系称谓),有也可以是隐性的(眼光的对视、话题的流转等)。这个握机制帮助互动双方建立了互动的景,让双方达成「开始交流」的共识,以便息的收者做好倾听并回复的准备,这就是互动中的指向性。
任何互动为都是发生在两个或者多个明确象,此在良好互动为,指性显尤为要──没有会去响应自言自语。在互动过程,指性不明确互动为是低质量,不容易获进步反馈,例如评论区统回复、群发新年问候、领导在台上讲话等。反指性明确互动是高质量,比较容易获反馈,例如群聊@某个、收件为某个而邮件组邮件、多聊天时眼视等。
适度的互动行为
互动行为的适度包含个方面:息适度及行为适度。
,由于互动为本质上是信息传递过程,此反馈信息质量会接影响到反馈体质量。好反馈应该传适度信息,让接收者可以传递信息进轻松地接收及处理,最大程度降低接收者反馈槛。
另一方面,传递信息的行也应该度的。活中,不同的场合下,我们会选择不同的行表达同样的意思,比如比较式的场合会选择握手作问好,与家人久别后的见面则可能一的拥抱。
反馈的即时性
互动行依赖于一语境的,当语境消失,互动也将停止。社交产品的互动场景中,互动语境一般会随时间流逝逐渐减弱直到消失,所以反馈的质也随时间的流逝逐渐衰减,若让反馈链可以得到延续,尽保证语境消失产反馈行,因此即时性的反馈就显得十分重。
了以的理论基础,接下分析一下 Qzone 中的互动行。
Qzone 中的互方式可归为类:评论、转发、点。中,评论和转发都可产生整的反馈链。针对评论,户还可继续通过评论、点等方式进行反馈;针对转发容,户可进行进一步的评论、转发、点。而对于点行为,反馈链到此戛然而止,户无法对点行为进行直接的反馈。
因此,为了户的点可形成整的反馈链,我们的设计目标就呼之欲──为 Qzone 中的点行为寻一个具有指向性的、适的、具有即时性的反馈行为。
1. 互场景的择
既然要设计的是一个具有指向性的互行为,我们就必须在可接收到的场景里做这件事。我们首先遍历了人态,有可看到别人给自己点的场景。
但是上的场景中,并是都适合承载点的反馈行为。根据户的行为目的,我们可把上场景分为两类:围绕点行为的键行为路径(图c.消息列表、图d.点列表)、点为核心目标的他场景(图a.好友态、图b.个人页)。显然,我们应该把围绕点行为的键行为路径作为要互场景。并且有对于点的反馈都是直接依附于点行为本身的,使反馈行为具有明确的指向性。
2. 适的语义及交互
前到,适的互包含「信息适」和「行为适」两个方面,落地到产里,就是定义互行为的「语义」和「交互行为」。
关点赞反馈行为的语义表达,我们列举很来自现场中的备选方案,以动的情感程度和成熟程度划分 4 个象,对系列动进行归类。
由点赞行为身所传达的情感是比轻量化的,我们更倾向选择一个轻量化的情感表达方式为点赞的反馈;同时由 Qzone 的用户群以年轻用户为主,我们还需要选择一个尽量贴合年轻用户感官的语义。因此我们在象图中初步选中位左下角的「击掌」和「剪刀手」两个概念。考虑到「击掌」比「剪刀手」具有更为明显的指向,所以确定「击掌」为最终的落地方案。
同时,因为点赞行为身是一个极其轻量化的行为,所以我们也用最轻量的互操为它的反馈,只需要一次点击即。
3. 反馈的及时触达
用户每次收到针对点赞的反馈,收到一条与点赞相同的消息提醒,通 push、首页新消息提醒、红点等让用户一时间晓。在消息箱列表中,每一条点赞和回赞成为单独的一条消息,以让用户最直观的查看并进行反馈。
综上所述,确定了整个反馈链的交互框架:
击掌的视设计是一个现问题到决问不断循的程。在个程中,推动决方案逐步升级的核心方法是情感化设计。
击掌动作本身就带有丰的情绪,而情化的计方法可以让情绪的释放更大化,所以在视觉计阶段,以情化计作为方法去推进方案逐步完善,最终建立起用户产品、用户用户间的情,加深用户对功能的认可和共鸣,带来更加有趣的体验。
情感化设计具象到击掌这个功能,需要解决两个问题:
- 如何唤起用户在现实景中的击掌记忆;
- 如何符合空用户群体基本调性。
1. 唤起用户在现实场景中的击掌记忆
设计之初,我们用平面 icon 的形式来表现击掌,虽以满基的功能诉求,但是在视验上乏善陈,我们又尝试更富的各种视表现以此引用户对击掌个动的共鸣。
在计推敲的过程中共经历了三个阶段,在不断发现问题和解决问题的循环中寻找更优的计方案:
Step 1 | 静态展示到动势塑造
我们用两个手掌叠加的样式构造击掌 icon 的基造型。为增强用户对「击掌」的语义感使用漫画中常用的动态条,让用户从视上直观感受到是一个动态的互动行为,而非简单的单方面点亮 icon,以此加强用户对击掌个互动行为的认。
Step 2 | 2D画演绎
但是这样的势表达仍然具有限性,态线条的表达方式并具备普适性,无法保证户可解中的含义。因此我们在第二个阶的设计迭代中使更直观的画来帮助户解,使与现实生中的作产生呼应。
Step 3 | 3D表
解决了语义表达的问题后,我们遇到了一新的挑战,由于整动画的展示范围较小,视觉表力并不理。因此第三设阶段中,我们通过动画、试 3D 表形式的方法解决述问题。同时,3D 的表手法还可以通过光影质感传达多信息,加直观易懂,具极强的入感。
2. 符合空间用户群体的基本调性
空主流用户以年轻居多,为了匹配用户群体基本调性需要打造个「年轻」、「有趣」 3D 击掌动画。为此,我们以「3D」、「young」、「fun」作为关键词收参考素材,以此立情绪板。
趣味和轻量的质
如前文所述,对于击掌反馈行为是一个轻量化的互动,为避免 3D 表现法过于写实而带来不必要的厚重,同也为了增加动画的趣味性,选择卡通的掌造型进行建模。在材质的选择上偏向黏土材质,弱化高光,让视觉上的体验更加轻量。
弹曲让动画更生动
现生活中的击掌动是一个减速运动,但是为突出击掌的动势和加强趣味,我们采用非写的弹曲来打造个动画,以此加强动画的趣味。
礼烘托氛围
在后续的产迭代优过程中,我们引入了无限击掌的玩法,户之间可无限。这就导致画被重复播放,会速户对画的审美疲劳。为配合产玩法的升级对画的设计进行了迭代,基于击掌次数设计了同的展示彩蛋──在击掌达到特定次数后,会有彩带礼蹦,在烘托多次击掌的热情氛围的同时,给户带来更多趣味和惊。
在击掌功的设计过程中,我们断在发现问题、解决问题的循环中断寻求更优解,逐步把一个到 100 像素范围的击掌 icon 做到更好,此来唤起户对现实击掌的记忆,建立起与户情感上的连接。
另外,通趣味的视表现手法不断推敲动画设计,让 Qzone 的年轻用户不仅从心理上建立连接,在表现也能感到符合自身标签的趣味。
除上文提到的彩带礼花以外,在击掌玩法升级程中,我们也拓展更内容。
1. 给用户造惊喜
随着用户间反复击掌次数变,粒子效果不断升级,并加富有次的场效果。而且达到关键击掌次数的时,展示击掌的次数,通用户的成就感来刺激其产生更的击掌行为。
2. 个性的延展
为了丰富手掌样式的择,给户供更多样的体验,我们和增值团队一起设计了更多的手掌形式,同时引入一些 IP 形象,击掌更唤起户的共鸣,更有趣。
击掌这功能从探索到线二次迭历了很一段时间,整项目对设师也一次收获满满的过程。
1. 创新也可以从1到N的过程
创新并不都从 0 到 1,从无到的创新,尤其对于功能框架体系熟的产品,盲目的追求创新去改变用户的认知习惯不妥的,从小的问题点手去深挖思考,找到合的解决方案并打磨细节给用户创造惊喜,以小博去创新也能达到四两拨千斤的效果。
2. 打磨细节创造惊喜
探索挖掘到一不错的法之后,打磨细节也同样重的,我们出了各种不同的击掌效果方案,去找到给用户惊喜操作轻的平衡,这功能线以后我们也一直关注用户的反馈,从用户反馈中发还可以惊喜升级,从一点出发,把这点不断的扩充得细致加闭环。
3. 从活中,到活中去
击掌这功能之所以这好的数据用户认可度,一很重的原因因本身这行实活中的场景相对应的,所以让用户能很理解操作,符合用户真实场景的认知,所以学习本比较低。我们设的时候用活场景挖掘产品,能达到事半功倍的效果。
注「腾讯ISUX」的公众: