本期我们请到了 Facebook 设计师 何如佳。她曾任 Facebook 视频、照片创作和编辑领域的主设计师、Facebook 前沿科技研究团队 Building 8 早期成员,主导交互设计,设计了拥有全球数千万活跃用户的 Facebook 独立照片分享应用 Moments,现在为 Facebook Messenger 设计。
我们聊了聊:
- Facebook 的设计文化和设计团队
- Facebook 内部是怎么做「设计批评」的
- 如何维持跨团队间的设计一致性
- 设计 Facebook 主 app 中的功能,和设计一个 Moments 这样的独立 app 有何不同?
- Facebook Moments 的设计开发流程
- 如何做好安卓平台上的 app 设计
- 当扎克伯格是你的产品经理……
- Facebook 的声音设计团队
- 用 Origami 做动态原型
- 在腾讯、知乎和在 Facebook 工作有什么不同体会?
Riceman: 欢迎 @Ruthia 何如佳 来到 UX Coffee。能和我们介绍一下自己吗?
何如佳:大家好,我叫何如佳,现在在 Facebook 做产品设计师。我是 14 年加入,已经在 Facebook 工作了两年多。
Facebook 的设计团队结构
Riceman:能和大家介绍一下 Facebook 大致的产品线和团队构成吗?
何如佳:Facebook 的主要产品比较集中,最重要的几个产品是:Facebook、Instagram、WhatsApp,还有 Oculus。Facebook 的设计团队分成三个部分:Core app(核心应用),Growth(增长)和 Business(商业)。我刚加入的时候,公司大约有不到 200 个设计师,两年多我们的设计团队翻了一番。
Facebook 是一家产品驱动的公司,所以我们的设计团队和产品团队处于一种「你中有我,我中有你」的关系中。每个设计师属于自己所在的产品团队,方便和自己产品的团队成员交流,但我们也属于自己的设计团队,和别的产品的设计师做沟通,进行 design critique(设计互评)等等。
Facebook 设计团队是怎么做 design critique 的?
何如佳:我刚到公司的时候,每个月都有一次设计师全员大会。每次有一个小组展示他们最近的设计,这样有助于全公司设计师互相了解大家都在做什么。公司鼓励大家在设计还在早期的时候就向大家展示,获得一些早期设计大方向上的建议。根据展示的设计所处的产品周期不同,大家也会针对性地给不同的建议。一些设计细节上的建议,大家一般会在自己所在的小组的会议中去提出。
张挠挠:你觉得要做好一个 design critique,设计师应该要做好什么准备?
何如佳:我觉得最重要的一点是设计师要带着明确的目的走进一次 design critique 的会议。比如,是想要视觉设计上的、交互流程上的、还是产品方向上的,或者是针对界面中的某个按钮文字的建议?做展示的设计师需要主动明确地说清楚你的目的,这样有利于获得有针对性、建设性的反馈。
Facebook 的设计师 Tanner Christensen 在 Medium 上写过一篇文章《Peek Inside a Facebook Design Critique》,还原了真实发生在 Facebook 的一次 design critique,很有意思,我觉得很值得大家参考。
Facebook 的设计分享文化
Hoka:Facebook 设计团队非常乐于分享,经常把产品的设计过程、反思、总结、设计素材和源文件都分享到网上。你们应该是最早一批做这件事的硅谷大公司,现在看来应该是带起了一股潮流,很多公司的设计团队也慢慢开始对外做分享。你怎么看 Facebook 的这种开放的设计文化呢?
何如佳:我们是社交公司嘛,天生自带分享社交属性。我们公司非常鼓励员工做分享,内部我们甚至还有写作讨论组叫 Writing for Facebook Design,由 Julie Zhuo 发起,在里面大家分享、互评怎么写出好文章。这种分享有利于整个设计社群的发展,也能扩大我们公司的影响力,有利于我们招募优秀的人才。
△ ?Facebook 设计官方网站(facebook.design)
Riceman:你们有 400 多人的设计团队,你们是如何管理设计规范,保持产品间的设计一致性的呢?
何如佳:我之前提到了几个大设计团队,他们各自都有专门的设计师来制定和管理设计样式的规范。如果你设计的产品需要用到新的样式,就要和这些组的设计师打交道,审核通过后才能在产品中使用。
但也不是所有产品组都有设计规范,像我现在在 Facebook Messenger,我们组设计团队的规模还比较小,就不需要有专门的团队来做设计规范,设计的一致性主要依赖设计师之间的沟通。
在不同产品团队的经历让我快速成长
Riceman:在加入 Facebook Messenger 之前,你做过哪些项目呢?
何如佳:我一开始做的是 Facebook Moments,国内的听众可能没有听过这个 app,我简单介绍一下吧。Moments 这个产品的出发点在于,我们发现用户拍的照片中的绝大部分,他们其实都不一定想要发到 Facebook 上,但是他们会想要分享给某一个小的朋友圈子,或者是他们的家人,或者是一个私密的小群体,Moments 就是抓住这个需求,把这种分享变得非常简单。
△ ?Facebook Moments 安卓应用会在每次拍照后识别用户照片里的好友,建议用户把照片分享给他们
Moments 之后,我还做过 Facebook 主 app 中的相机和视频功能。之后去到了 Facebook Building 8(一个研究导向的前沿创新团队),然后现在到了 Messenger。
Hoka:做 Facebook 主 app 中的相机或者某个视频的功能,和设计 Moments 这样的独立 app,你有什么不同的体会吗?
何如佳:我觉得很不一样。Moments 整个团队算上产品、工程师、测试等等才不到 20 个人,我们的开发速度很快。但我在做 Facebook 主 app 的一些功能的时候进展就会慢很多,因为那些设计往往需要跨团队、跨工种、甚至是跨公司的合作。
经历这样不同的团队对我来说也是不断成长的过程。我一开始进公司的时候更像是一个「支持型」的设计师,一个人埋头苦干,通过把自己负责的部分做好为产品做贡献。慢慢地就会希望自己的设计对产品产生更大的影响,这样就需要和更多人沟通,而不只是自己一个人埋头做。
Moments 的设计开发过程
何如佳:我在 Moments 团队中主要负责的是安卓平台的设计。当时比较有意思的是,整个公司其实做安卓平台的设计师非常少,大概只有 3 个。
我加入的时候这个产品已经开始做了一段时间了,但正在经历一个比较大的产品方向上的转型,基本上把之前的设计推倒重来,所以我参与到了很多产品的讨论当中。整个设计过程是一个团队合作的过程,并不是流水作业。每周我要和产品经理做很多沟通,列出所有的功能需求,然后商量制定优先级。
另外一个有意思的地方就是,当时我们的产品还没有发布,所以我们会请一些用户来公司,把他们关到「小黑屋」里面来做用户测试和访谈(和犯人审问一样,屋子里的墙其实从另一个房间看是玻璃)。一个比较棘手的问题是,因为我们公司在硅谷,在公司周围找的用户可能都从事互联网行业,和这个世界上绝大部分地方的用户都不一样,所以我们要很小心地排除掉硅谷的工程师和设计师,来获取比较有代表性的样本。我们甚至还跑到美国德州,去找当地的大学生来做测试,去得到更全面的结果。
什么时候应该打破平台的设计规范
Hoka:安卓的设计规范很强势,iOS 的设计语言相对更开放,你们为安卓进行设计时,是遵从安卓的设计规范,还是保留 iOS 上的一些风格,这一点你们是怎么权衡的呢?
何如佳:这是设计界一直在讨论的问题。其实现在两个平台有逐渐融合的趋势,可能逐渐地大家总结出了一些好用的、通用的元素和组件。但我觉得还是有必要去读一下两个平台的设计文档。现在美国本土比较注重 iOS 设计,因为占有率相对有优势,但在全球范围内,尤其在国内,可能还是安卓比较占优势。比如 Moments 安卓版本的用户数是 iOS 版的很多倍,所以安卓也是一个比较重要的平台。
Riceman:像 Facebook 这样的公司,会不会有时候不遵守安卓或 iOS 的规范,可能会有更好的结果,或者是出于自己品牌、形象的考虑,想去创造一些东西,打破平台规范?
何如佳:有可能,比如 Reactions,现在在 Facebook 上,你不止可以点赞,还可以发爱心、发各种表情,这是一个新的交互元素。我对他们的设计过程有一些了解,他们也有很多迭代版本,有一些其实是传统的、符合规范的,最后选择这个非传统的版本也是经过用户研究、各种数据验证的。其实设计师在这方面决策的权力没有那么大,因为 Facebook 是一个数据驱动的公司,有时候也不是刻意打破规范,而是要看用户更喜欢什么,要从数据看哪个版本对整个体验最有帮助。
Riceman:所以最后是数据说了算。如果数据说,打破规范会有更好的用户体验,你们会照着数据去做,而不是盲目地遵从平台的设计规范。
△ ?扎克伯格在 Facebook 上介绍 Reactions 功能,用户除了点赞,还能发爱心、笑脸、哭脸等表情
当扎克伯格是你的产品经理……
Riceman:我们都知道 Facebook 设计师正式的职称是「产品设计师」,但你们同时也有产品经理,