说说Facebook Mentions和实时直播背后的故事

编者按： 这是一篇译文，原文作者Frankie Gaw，是实时直播应用Facebook Mentions的团队成员。文章讲述了在Facebook中，从一个需求被发现、分析，到方案的考量、原型的模拟压测，再到功能发布与持续迭代的整个过程。在这个过程中，有哪些最为重要的因素？如何在具有约束的环境中让成员们走出舒适区，接受挑战并且自我成长？本文来自狐狸的糖果罐（微信公众号：Foxcandycan）的投稿，作者狐狸。

译者注：

Facebook mentions 是一款Facebook推出的App，专为演员、歌手、运动员以及其他有影响力的人所设计的应用程序，先前仍限制需粉丝专页通过验证、获得蓝色徽章的公众人物才能使用，现在已开放给通过验证的 Facebook 个人帐号。未来，记者、编辑等媒体从业人员将有机会透过 Live 功能，将最新消息传达给追踪其个人帐号的粉丝们。

    

Designing Live for Facebook Mentions

原文作者：Frankie Gaw

为了增强公众人物们与粉丝的互动，我们准备在facebook上开启沉浸式体验，这是一种“身临其境”的方式。就在上个月，我们推出了实时直播（live）的功能。

我们是如何开始的？——实时直播和Facebook mentions背后的故事

实时直播（live）是Facebook mentions的一种新的内容形式。它是一款出自创新实验室的应用程序，公众人物们首次使用可以通过facebook移动端简单的直接访问。Mentions作为一款为公众人物提供服务的工具，让他们用真实直接的方式更方便的与自己的粉丝产生连接、并分享自己的生活片段。几年前，我们思考这个场景关于facebook的用户体验，并且意识到现在我们使用的facebook并不能很好的扩展延伸：为那些每天处理数以千计信息的公众人物服务。在推出Mentions之前的一段时间里，公众人物们在页面上没有消息提示，没有什么途径知道哪些人群在谈论他们（除了他们自己发布的帖子下方的评论以外），无法过滤信息。最重要的是没有专门为他们的需求设计的移动端应用程序。

在2014年推出Facebook Mentions时，我们尝试首先着手处理从公众人物方面得到的重点需求：它们期望得到更简单易用的移动端使用体验，想更简单直接的和粉丝们进行互动。Mentions是连接公众人物和粉丝之间的纽带，我们意识到通过评论与回复，公众人物发布帖子和粉丝互动可以产生巨大的增长。这点对于视频尤其如此。节奏如此之快的今天，我们可以看到公众人物正在使用Mentions分享的海量视频，并享受着人们每天在facebook上的关注。

Facebook Mentions上的视频样例（其实我是动态图）

视频分享击中了公众人物的痛点，因为视频可以让他们表达自己，并且用身临其境的故事形式分享他们的生活。同时也给予粉丝们一个空间去回复、互动和分享这些生活片段。即便推出了Mentions，公众人物们仍然想要更多和粉丝之间创建实时的分享和沟通的亲密体验。我们也看到人们喜欢围观他们爱的运动员、音乐家、政治明星等公众人物所发布的视频内容。所以，我们接下来会继续加强公众人物和粉丝之间更亲密的连接感，比如在Mentions中创建实时直播。

实时直播的设计——在Facebook的规范内工作

在规范内设计总是有巨大挑战的，伴随着设计、研发以及facebook规范的基本准则，整个过程有大量互相影响并且复杂的边界问题。作为一个想要搞定“大工程”的小团队，我们要拿出确保Facebook上超过十亿用户可以访问的，实时直播功能的可行性策略计划书。

    

在平台中工作

我们首先处理的事情就是视频本身。我们认为要解决的这个看似简单的设计问题，会是最终最为核心的问题。接下来我们确定出三种方案选项：3:4的半幅式视频长宽比，全屏模式以及正方形的视频，每个不同的方案都有它们各自的内在含义。

实时直播布局的3种选择

半幅式（上图：左）似乎是开始的不二之选，它充分利用了屏幕的空间并且在手机上看起来很棒，然而，选择半幅式让我们很快意识到，它无法很好的横跨Facebook的界面（译者注：在web端无法与facebook保持一致的体验），特别是网页端的新闻推送场景。Landscape（上图：中）的形式减轻了大量的（与facebook）的嵌入式问题，但会造成屏幕空间的浪费和视频&评论的层次不成比例。最后，我们决定正方形（上图：右）的视频直播，它是最优的选择，因为它满足了跨平台的一致性问题同时让公众人物和浏览者更简单的查阅评论和互动。

这个很小的设计问题，是我们设计进程中剩余部分的重要前提。它实实在在的解决了框架布局，不仅仅是特别为移动端设计产品，更像是在一个庞大系统的拼图中，把移动端作为拼图的一部分。

不同终端的实时直播以及在Facebook上界面展示

      

浏览者的体验

实时直播由两个主要的部分组成，直播发布者的体验和浏览者的体验。在设计这些体验的时候，我们要确立总体的设计准则，以便在两种环境中互相跳转时都总是可以很好的返回到原来的模式。

最终的设计：直播发布者（左）-浏览者（右）

我们设置的主要原则之一，是直播发布者和浏览者需要拥有一致的分享体验感。尤其当我们为浏览者进行体验设计的时候。这有助于我们问这样的问题：当浏览者做了某件事X的时候，直播发布者会看到什么？如果一个浏览者在手机端可以做某项操作X，那么这个浏览者可以使用鼠标在桌面端的feed story上以相同的方式进行操作吗？

视频发布者和浏览者应该拥有一致的分享体验。

    

最初的探索

我们围绕浏览者的反馈做了广泛的探索，范围从短暂且聚合的交互方式到社会名流的评论加权排名。

实时直播中评论的迭代设计

实时直播的评论

在实时直播体验中「评论」的设计是至关重要的，它可以帮助我们让实时直播感觉是即时、生动的产品。

（左）实时直播的评论，（右）向上滚动回顾之前的评论内容

我们意识到为了整理出在真实环境中「实时直播」中「评论」的表现方式，需要快速制作出原型。「评论」不仅仅是静态信息的层级和布局展现，更宁可说是，代表了更加复杂和有序的系统，大量的内容数据流 通过一个接一个的过滤器，被众多的信号标记和交互行为所触发。

迭代时一个最大的阻碍是需要预估出我们是否在正确的方向上。在小组内部我们可以对自己构建的模型做小型测试，或对其他人的直播视频作讨论，但是公众人物即将使用这个产品时，几乎是不可能复制此种方式。这时Origami出现了，一个用在facebook原型设计中，非常现代化的用户界面设计工具。它成为了我们最常用的工具之一，通过它让整个过程中沟通和完善想法直到一切都恰到好处。它不仅仅是一个展示工具，更是一个收集反馈的工具，我们可以通过它对视频直播和可点击的按钮进行模拟评论的压力测试。在感觉什么地方有问题的时候，我们可以很快的作出及时调整和对问题部分进行重新设计，而不必重做整个原型。

它并不像看起来这么吓人，只是有点凌乱，我们开始为「评论」设计的原型之一，使用了switch和timer做评论部分的Y轴动画

       

视频发布者的体验

设计实时直播的体验是巨大的协同努力，为了完善设计与研发，它涉及大量跨学科的内容策略以及与媒体的伙伴关系。

当为公众人物们设计时，我们为自己设定的另一个原则是界定清晰。在实时直播时需要遵从某种程度的舒适度去建立每一个操作步骤。这包含了两件事，首先它应该创建一个流程：感觉上很容易开始录制视频。其次，它要求我们通过情景教育和比较接近的退出点创建足够的缓冲，以便公众人物们在使用实时直播时可以轻松退出或中断的操作以便于重新录制视频。

这是在设计实时直播时我们最喜欢的部分之一，因为它涉及围绕着庞大复杂结构的思考，也有精巧的细节策略。宏观层面：比如脚本方面，取决于编程者在视频直播结束时，要增添多少的变量；微观层面的细节：我们如何使用声音和微妙的动态效果增加娱乐感（用户熟悉的承上启下感），比如使用胶片电影中的倒计时方式，可以在开始录制视频之前提升用户的期待感。

    

对事情清晰的定义，

并且基于舒适感创建场景中的每一个步骤。

   

贯穿实时直播流程的新用户引导界面

    

我们学到了什么

这个过程从不是简单的，我们在前进的过程中经历的跌宕起伏的每一件事情 都教給我们有价值的经验

1. 尽可能早的进入背景环境

作为一个设计者，很容易趋向于一种设计心态：最好的方案和最大程度偏向审美的解决方案。我们很快意识到不是每一个用户录制的视频直播都有最好的网络连接、理想的拍摄背景和环境、很好的灯光、天衣无缝的缩略截图，和完美的令人飘飘然的评论。我们从这个过程中学到最好的一课就是，让极其追求完美的工艺设计逐渐适应现实世界。它教会我们在设计过程中进行不断的反馈循环的迭代，并在真实环境中测试，以保持我们的假定是被验证正确的。尽管真实的环境与设计者如何设计和执行有关，以及真实环境不得不受到的限制，但尽可能早的进入背景环境是设计出人性化的可持续的产品是关键。

1. 拥抱约束

无论一个功能是否在技术上难以实施，或者并没有足够的时间创建完整的设计方案，总是有阻碍理想状态的约束。当我们开始工作的时候，约束看起来无处不在。无论是视频标准和空间大小的约束，还是技术的限制，我们需要创建多少时间的变量。它们都是让我们专注行事的恒定的状态。约束是可怕的并且有时让一些问题看起来无解，但是只要拥抱它们就好，用积极的看法和全新的视角去拥抱它们，约束永远创造挑战，挑战会激发潜在的创造力。

1. 投入的尝试

有时候完全没有目标的明确路径或共同愿景。团队的经验就是第一手资料，其中不断涌现出围绕着产品决策关键点的开放式问题。像是这样一些问题：浏览者的反馈信息怎么做？我们应该对视频下方的评论进行加权排名还是只做实时更新？视频直播的操作入口应该是什么样的？当视频结束时的引导应该如何去设计？似乎总是将要更轻松的依赖假设和让我们自己保持在舒适区。但是当你投入在这些开放的问题中，接受不确定是否有正确的答案，对于学习来说就创造了巨大的机会。寻找并吸收其他人的经验，在新的项目中冒险与试验，为了找出那些答案大胆的走出你的舒适区。不知道自己做的事情是否是正确的是有些令人恐惧，但是它在不断的推动你迭代和挑战自己，并且引导你对正在试图解决的问题有了新的认识，然后，成长。

      

接下来会发生什么，Facebook实时直播的未来

距离我们在facebook推出实时直播已经有一段令人激动的时间了，它在那个时候产生了一个爆点。我们为自己做出的产品感到骄傲和兴奋，我们会继续跟踪从公众人物们和实时视频的浏览者们的反馈信息。我们会随着干得漂亮或做的糟糕的里程碑、持续的学习和迭代，并且继续提升实时直播的体验。

     

团队

如果说这是团队的力量总感觉比较没有新意。这次的新功能发布离不开每一个人的贡献以及每个人的渴望的推动，挑战并激发着彼此。它是实实在在的设计、研发、产品，内容策略，合作伙伴关系，公共关系和市场营销的通力合作，这一切让共同的愿景变为现实。

Vadim Lavrusik | 产品经理

Dave Capra | 研发经理

Robyn Morris | 产品设计经理

Abhishek Mathur | 技术项目经理

Sameer Madan, John Fremlin, Bhavana Radhakrishnan, Kevin Lin,Kunal Modi, Cloud Xu, Ryan Lin, John Detloff, Kirill Pugin, | 工程师

Sabayashi Roy, Keyun Tong, Federico Larumbe, Peter Knowles| Infras工程师

Abel Chan, Xiangpeng Zhao, Nithya Manickam | 数据科学家

Patrick Strange, Jane Francis | 内容策略

Shirley Ip | 产品专家

Zanique Albert, Bree Nguyen |合作伙伴关系

Peter Yang | 市场营销

Carolyn Thomas | 公共关系

       

原文作者：Frankie Gaw

原文传送门：https://medium.com/facebook-design/live-for-mentions-cb91b8a59a27#.q097wv8fj