社交互动创新 | 从点赞到击掌

但是这样的动势表达仍然具有局限性，动态线条的表达方式并不具备普适性，无法保证用户可以理解其中的含义。因此我们在第二个阶段的设计迭代中使用更加直观的动画来帮助用户理解，使其与现实生活中的动作产生呼应。

Step 3 | 3D表现

在解决了语义表达的问题后，我们遇到了一个新的挑战，由于整个动画的展示视范围较小，在视觉表现力上并不理想。因此在第三个设计阶段中，我们通过放大动画、尝试3D表现形式的方法解决上述问题。同时，3D的表现手法还可以通过光影和质感来传达更多信息，更加直观易懂，具有极强的代入感。

符合空间用户群体的基本调性

空间的主流用户以年轻人居多，为了匹配用户群体的基本调性需要打造一个"年轻"、"有趣"的3D击掌动画。为此，我们以"3D"、"young"、"fun"作为关键词收集参考素材，以此建立情绪版。

1 趣味和轻量的质感

如前文所述，对于击掌反馈行为是一个轻量化的互动，为避免3D表现手法过于写实而带来不必要的厚重感，同时也为了增加动画的趣味性，我们选择卡通的手掌造型进行建模；在材质的选择上我们偏向黏土材质，弱化高光，让视觉上体验更加轻量。

2 弹性曲线让动画更生动

现实生活中的击掌动作是一个减速运动，但是为突出击掌的动势和加强趣味性，我们采用了非写实的弹性曲线来打造这个动画，以此加强动画的趣味性。

3 礼花烘托氛围

在后续的产品迭代优化过程中，我们引入了无限击掌的玩法，用户之间可以无限回赞。这就导致动画被重复播放，会加速用户对动画的审美疲劳。所以为配合产品玩法的升级对动画的设计也进行了迭代，基于击掌次数设计了不同的展示彩蛋——在击掌达到特定次数后，会有彩带礼花蹦出，在烘托多次击掌的热情氛围的同时，给用户带来更多趣味和惊喜。

在击掌功能的设计过程中，我们不断在发现问题、解决问题的循环中不断寻求更优解，逐步把一个不到100像素范围内的击掌icon做到更好，以此来唤起用户的对现实击掌的记忆，建立起与用户情感上的连接。

另外，通过趣味性的视觉表现手法不断推敲动画设计，让Qzone的年轻用户不仅从心理上建立连接，在表现层也能感知到符合自身标签的趣味调性。

5 趣味性的玩法升级

除上文提到的彩带礼花以外，在击掌玩法升级过程中，我们也拓展了更多内容：

给用户制造惊喜

随着用户间反复击掌次数变多，粒子效果会不断升级，并加入富有层次的入场效果；而且达到关键击掌次数的时候，会展示击掌的次数，通过用户的成就感来刺激其产生更多的击掌行为。

个性化的延展

为了丰富手掌样式的选择，给用户提供更多样的体验，我们和增值团队一起设计了更多的手掌形式，同时引入一些IP形象，让击掌更能唤起用户的共鸣，也更加有趣。

6 写在最后

击掌这个功能从前期探索到上线和二次迭代经历了很长一段时间，整个项目对设计师来说也是一次收获满满的过程。

创新也可以是从1到N的过程

创新并不都是从0到1从无到有的创新，尤其对于功能和框架体系成熟的产品，盲目的追求创新去改变用户的认知和习惯是不妥的，从小的问题点着手去深挖和思考，找到合适的解决方案并打磨细节给用户创造惊喜，以小博大去做创新也能达到四两拨千斤的效果。

打磨细节创造惊喜

探索和挖掘到一个不错的想法之后，打磨细节也是同样重要的，我们出了各种不同的击掌效果方案，去找到给用户惊喜和操作轻量的平衡，这个功能上线以后我们也一直在关注用户的反馈，从用户反馈中发现还可以做惊喜升级，从一个点出发，把这个点不断的扩充做的更细致和更加闭环。

从生活中来，到生活中去

击掌这个功能之所以有这个好的数据和用户认可度，有一个很重要的原因是因为本身这个行为和现实生活中的场景是相对应的，所以让用户能很快的理解和操作，符合用户真实场景的认知所以学习成本比较低，我们在做设计的时候用生活场景挖掘产品，能达到事倍功半的效果。

感谢阅读，以上内容均由腾讯ISUX团队原创设计，以及腾讯ISUX版权所有，转载请注明出处，违者必究，谢谢您的合作。

原文链接： http://isux.tencent.com/articles/highfive.html

FEVTE编注：更多平面设计理论学习请访问飞特网平面设计理论知识栏目，地址：https://www.fevte.com/plan/shejililun/