# Co\.Design 采访 Facebook Timeline 设计师：设计有灵魂的界面

- 作者：积木
- 发布时间：2011-12-21 12:00
- 分类：特稿
- 原文：https://www.ifanr.com/65302

[![Jane-Smith](https://s3.ifanr.com/wp-content/uploads/2011/12/Jane-Smith_thumb.jpg)](https://s3.ifanr.com/wp-content/uploads/2011/12/Jane-Smith.jpg)

在接下来的几周内，Facebook 要推出一个新版的帐户界面——“Timeline“（时间线）。在新的界面内，用户的信息不再是简历般的自我介绍，而是对生活中重要时刻的绘声绘色的展示。如果你是忠实的 Facebook 用户，Timeline 将是你一生的记录。Facebook Timeline 想要承载两种感觉：

> 它想要传递一种感觉。更准确的说是两种感觉：一种感觉是与别人分享你生命中的故事，另一种感觉是记忆——对你自己生命的记忆。

Timeline 的界面设计将是一项具有挑战性的工作。Nick Felton 今年早些时候加入 Facebook，他和 Facebook 产品设计师 Joey Flynn 一起负责了这项工作。在 [Co.Design](http://www.fastcodesign.com/1665414/designers-behind-facebook-timeline-5-lessons-for-creating-a-ui-with-soul) 网站访谈中，他们讲述了在设计有灵魂的界面的过程中学到的 5 件事情：

**时间是不同文化之间最通用的结构**

Facebook 最初的想法是放弃时间线的结构，而关注于人生的重要时刻。这看起来似乎很合理，因为人们的记忆并非严格按照年份组织。当人们回忆往事的时候，他们想到的是生命中的重要时刻。设计团队尝试了以人生重要时刻为基点的结构，但是他们很快发现这不可行。

设计团队希望用户能够很快理解他人的帐户页面，但 Facebook 的用户分散在各国，文化各有不同，对人生的重要时刻的理解也是千差万别，以此为基点创造一种通用的语言非常困难。最终，他们决定以时间作为组织结构，用户可以对重要的时刻进行强调。

**生命就像一个信息流；生命的界面也应如此**

一个人的生命中需要经历太多的时刻。最初的时候，设计团队试图以特别的时间段来区分这些时刻，但这并不能达到 Facebook 需要的效果。Felton 认为，这不是人们记忆生命的方式。我们对生命的记忆不是分块的，而是一条信息流。“我强烈的感觉到，生命应该以一个长长的延续来表现。”因此，在最后的设计阶段，Timeline 成为了一个单页，你可以不断向前回溯。当你回溯的时候，有一个滑动条告诉你年份，给你一种时间飞逝的感觉。

**自我表达应关注内容，而不是虚饰**

Facebook 希望 Timeline 成为用户自我表达的场所。最初的时候，设计团队试图为用户提供大量页面控制，比如选择不同的相框。 这再次证明是难以实现的。原因是 Facebook 希望用户立刻理解其它人帐户界面的视觉语言，而给予用户更多控制将破坏可用性。因此，Facebook 将控制视觉语言，但是给予用户强调的权力。用户无法决定使用什么边框，但可以决定强调那张照片，使它变大或变小。Flynn 说“这是通过内容展示个性，而不是通过虚饰展示个性。”

**我们对新旧经验的感觉不同**

Timeline 不应该记录用户在 Facebook 上的所有时刻。它应该记录那些特别的时刻，问题是随着时间的推移，某个特定时刻会逐渐丧失其意义。长久看来，真正使你感兴趣的是模式。因此 Facebook 创造了一系列的集合和报告，让你“找到决定自己个性的个人模式”。当你看到生命中某个时刻所听歌曲的集合报告，你能够看到自己“生命的原声带”。

**食狗粮的重要性（员工内部测试）**

Felton 说他在设计 Timeline 中最重要的一课是“Photoshop 会撒谎”。你可以做出非常好的组合图，但是“在你加入真实数据，并且与它生活几天或几周之前，你永远无法这是否可行”。因此，Facebook 在开发过程中将 Timeline 交给自己的雇员尝试，以确保开发中的结构可以适应所有用户。“做为一个设计师，你想要将自己的作品推销出去。为了使它可以售出，你可能挑出一些在帐户中放了漂亮的照片的用户，然后用在你的设计模型上”，Felton 说，“但如果你认为所有人的页面都会是那个样子，那最终只是在对自己和团队的其它成员撒谎。”

本文素材来自 [Co.Design](http://www.fastcodesign.com/1665414/designers-behind-facebook-timeline-5-lessons-for-creating-a-ui-with-soul)