为用户设计更好的 Facebook 信息流

原文作者:Shali Nguyen 和 Ryan Freitas
译者:Chulin Yang | 校对:DSC 北京组织者-糊糊

译者按:我们每天都在接受着不同的信息,这些信息如果不能以合理的方式汇集成流,将会造成信息冗余,很大地影响用户的阅读体验,尤其是对于Facebook等需要展示大量信息流的产品,合理的信息流设计更加必要。这篇文章便是Facebook设计师探索信息流设计的一次创新性尝试。

从去年开始,我们开始研究如何提高信息流可读性、交流性、导览性。可以想象,为一个连接着两亿人的社区设计产品有许多特殊的挑战。

我们带领两个信息流产品的设计团队,很清楚我们做的任何一个设计决定都会影响Facebook的整体使用体验。在与世界各地用户的交流过程中,我们明白了他们觉得信息流有些杂乱,不便浏览。解决这个问题等同于更新整个信息流的设计系统,这对于一个十分成熟的产品来说是一个很有意义的挑战。一些小的变化,例如增加内边距像素、改变按钮的色调,都会带来超出预期的效果。

提高信息流的可读性

我们的设计与研究团队每天都与真实用户交谈,用户也让我们了解了他们最关心的是什么:

  1. 内容,例如一张分享的照片
  2. 内容的分享者
  3. 用户给所见内容留下反馈的方式(评论或反应)

基于真实用户的反馈,我们分析了一下几种典型的帖子类型。方法是将几种典型信息流内容分解,然后重新决策,使设计可以满足用户的现有需求。
之前,信息流架构如下图所示:

初始设计的信息流版本

我们思考了以下三个重要问题:

  1. 我们如何提升信息流,从而使信息流可以更加容易阅读,并且突出内容的关键区域?
  2. 我们如何使得信息内容本身更加有娱乐性与沉浸性?
  3. 我们如何使用户更快留下反馈?

这些问题在设计冲刺的活动中带领我们探索与试验,引导我们与两组设计师、研究者和内容策划者一起,进行了一周的头脑风暴,并且完成了新想法的原型设计。

在设计冲刺中迭代更新的信息流设计

我们做了一系列的设计,从而提升每种内容的呈现形式:

  1. 调整视觉架构,使得信息流中的帖子更加易于阅读,加大字号与颜色对比;
  2. 提升图像效果,帮助人们更好地理解信息流,与信息流互动;
  3. 通过增加内容模块的宽度,减少不必要的交互元素,提供更加吸引人的内容体验

我们的设计冲刺也包含各种讨论,让我们去验证不同方法。通过这样的冲刺,我们把设计放在真实用户眼前,从而得到他们的反馈。

第一轮测试的用户反馈

通过几轮的迭代与测试,我们了解到,我们最初的一些设计方案有助于简化界面。然而一些设计决策,例如将文字放在图片上方,或者移除显眼的文字标签,也有可能引起可读性的问题。每一轮的迭代都帮助我们更加靠近我们的最终设计,这些设计的布局和排版更加易于读者消化,同时又不会牺牲可读性。

我们最后一轮的信息流设计优化

提高评论的交流性与吸引力

我们的目标是使用户可以更容易参与有意义的对话,使用户间的互动集中在对话中,为用户提供更多表达自我的途径。我们目前的设计基于信息版风格,不能完全体现表达与交流的感觉。当我们研究了其它评论的设计方案时(如下图),对话式的设计样式使人们可以更好地对话。

以前的评论 (左) 与改版的评论 (右)

提高信息流的导览性

我们希望提升的另一个领域是用户在不同帖子及整个信息流中的浏览体验。根据几种内容类型, 我们观察到实验室中的用户打开信息流,但因为体验不佳被卡住。我们也看到用户常常找不到“返回”按钮,因为我们过去几年在执行功能可见性与一致性的时候做得还不够。

以前的导航(左)与改版后的导航(右)

除了减少导航栏与标题之间的冗余,团队决定使用连贯一致的返回设计,贯穿整个沉浸式的浏览体验。我们也延伸了内容区域从而创造出一种时时刻刻都在内容中的感受,以此来提升从信息流到具体帖子的切换。我们使用户通过滑动返回信息流,提升了导航的操作手势。

我们始终在不懈地完善产品体验,在Facebook,从来没有「已完成」这个说法。作为Facebook的设计师,我们将用户放到所有决策的首要位置,采取任何有意义的方式提升用户体验。这是一次特别的设计挑战,因为我们并不想浅尝辄止,而是要让上亿人每天都用的产品变得更好。我们会持续研究并迭代产品、不断提升体验;我们坚信,这是通向Facebook更优体验的一步。

本文为 DSC 与 ONES Piece 联合翻译计划的一部分。本文原载于 Medium,作者 Niya Stoimenova 和 Luuk Roos,由 DSC 翻译成员 Chulin Yang 翻译,DSC 北京组织者 糊糊 审校。Design Sprint China (DSC) 是一个专注有趣设计思维的创新创意社群,其翻译团队定期搬运相关海外文章,微信公众号:设计冲刺。ONES Piece 是一个由 ONES Ventures 发起的非营利翻译计划,聚焦科技创新、生活方式和未来商业。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,117评论 4 362
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,328评论 1 293
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,839评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,007评论 0 206
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,384评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,629评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,880评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,593评论 0 198
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,313评论 1 243
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,575评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,066评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,392评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,052评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,082评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,844评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,662评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,575评论 2 270

推荐阅读更多精彩内容