图形
另一个棘手的问题是,Reactions该使用怎样的图形。我们想创造一种独一无二、简单通用的图形,并且能优雅的融入整个生态系统。下面是最初的设计方向:
最初的图形设计,在小尺寸下不能起到很好的沟通作用,看起来更像是系统的占位符,不过到了该迭代的时候了。
在互相独立且能够传递意欲表情的前提下,什么样的风格才是最合适的呢?这时候也遇到了重叠的问题,因为最小的设计改动可能就会让某个Reaction与另一个无法区别,甚至完全无法体现所要表达的情感。“Wow”可能忽然就变成“Yay”,“Yay”调整一下微笑的弧度或眼睛的角度又会变成“Haha”。
我们还尝试了是否使用标签。标签有助于定义“Reactions”,而且方便国际化。它们能被普遍理解,如果一位日本朋友对你的Po文做出“React”,你们都得知道那是什么意思。要理解这一点,我们与国际化团队以及非语言交流的专家密切合作,做了各种研究,并在不同的国家进行早期版本的测试。
早期版本的Reactions是静态的,我们也确信动画能让它们更丰富。动画设计师让它们动了起来,同时设计师与工程师都在考虑如何高性能的实现。设计师用伪代码描述每个“Reaction”,然后工程师通过伪代码高精度的还原了设计师想要的效果,并且如黄油般顺滑。
当加上动画效果后,我们觉得每个“Reaction”同时运动会让用户的眼睛过载。所以最初,当手指划过某个“Reaction”时该“Reaction”开始播放动画,其余则保持静止。在某次评审时(大项目通常给Zuck汇报进度),Zuck说如果快速划过“Reaction”时,它们也会同时运动。他建议,当面板出现时让每个“Reaction”同时运动。最后我们采用了这种方式,谢谢Zuck。
整体方案
如果没有大家一致坚守的原则,Reactions将是一个无法扩展的复杂系统。看看这些原则是什么:
Reactions是点赞按钮的扩展。点赞、评论与分享在脸书上如此普及,再添加一个选择将会变得复杂。
不能让已有的操作增加难度。在增加这项特性的后,不能干扰已有的用户。或者说,要让这项功能像点赞一样简单,点一下代表你喜欢这个Po文。
使用Reactions
最初设计输入机制的时候我们并不知道将会有多少个Reaction,一些早期的研究只给了大概的数字,可能在5~10之间。作为压力测试,我们设计了一个最多可以支持15个Reaction的方案,毕竟删减可比扩展容易。