新浪博客

微软人立方大揭密——“六度搜索”界面设计的来龙去脉

2009-03-26 09:37阅读：

http://blog.sina.cn/dpool/blog/u/1286528122

文：刘力科
人立方六度搜索，目的是向您展示互联网上任意两个人名的关系路径。这个项目有许多挑战性的问题，比如后台的搜索算法，前端六度关系图的展示，界面的易用性等。这里主要聊聊六度搜索前端界面设计的由来。

微软人立方大揭密——“六度搜索”界面设计的来龙去脉
六度搜索的界面

界面设计的挑战

六度搜索是一个特殊的项目。首先，它是一个升级版。因为人立方1.0版已经上线了几个月，六度搜索是作为1.1版的功能推出的。既然1.0版好评如潮，那么1.1版必须是锦上添花。1.1版的界面风格需要向1.0版兼容，风格要一致，带给用户良好的体验。其次，没有界面设计人员参与1.1版本的开发。项目的需求可以用一句话概括：使得用户可以搜索人立方中两个人之间的关系。这是个既明确又模糊的需求。问题在于，用户搜索的界面什么样子？用户能得到怎样的搜索结果？用户能在界面上做哪些操作？面对这些挑战，我们唯一可以借鉴的地方是1.0版的关系搜索。如下图：

微软人立方大揭密——“六度搜索”界面设计的来龙去脉

原始的界面

既然要和以前的版本风格一致，“大圆饼”人名是少不了的。那么我们是否就可以在界面上连接出不多于七个圆饼，来展示两个人物之间的关系链？首先分析这条关系链的展示方法。这个问题看起来容易，不就七个人么。那就排队站好：

微软人立方大揭密——“六度搜索”界面设计的来龙去脉

界面上这样的排队是很死板和空洞的。于是我们修改了1.0版关系搜索的大饼布局算法，把这条关系链摆放的弯弯曲曲，显得生动一些：

微软人立方大揭密——“六度搜索”界面设计的来龙去脉

讨论会上，看了这个简易版本的六度搜索后，大家的意见是：这样算出来的六度关系不准确啊。是的，人立方的人物关系来源于海量数据，多少会得到一些不靠谱的人物关系。现在是由多个人物关系来构成人物关系链，根据乘法原理，人物关系链的靠谱程度就可能是：不靠谱*不靠谱*..*不靠谱，任何一两个关系的不靠谱就会导致结果很糟。界面上只显示关系链的一个结果，而用户没法筛选结果是这个版本的最大问题。就像搜索引擎一样，如果每次搜索只返回一个结果，那最多1%的人满意，而剩下99%的人都很难满意。为了显示更多的搜索结果，我们需要在界面上画个一二十条大饼链，然后再加上“翻页”功能吗？我们期待的是更有创意的方法来帮助用户筛选搜索结果。于是就有了剔除和添加（kick和select）两种用户交互方法之争。

Kick和Select之争

经过多次会议和邮件沟通，大家关于六度搜索的用户交互方法有了两种意见。一种是剔除方式：如果用户对于系统给出的关系链上任何一个人不满意，直接在对应的大饼上，点下鼠标，踢飞之。系统会重新给出一条新的关系链供用户选择。这种方法的好处是用户使用简单，直观。缺点正如“添加派”所指出的，系统可能一时半会推荐不出用户认为靠谱的关系链。用户一直如此踢下去，何时是一个尽头呢？可能用户踢了几次，觉得结果不满意的话，就直接关掉浏览器……那么另外一种方式——添加是怎么样的呢？添加的想法是从关系链两端搭桥，步步为营。其场景是这样的（如下图所示）：

微软人立方大揭密——“六度搜索”界面设计的来龙去脉

比如我们寻找从米卢到刘翔的关系，系统就给出一条候选关系链：米卢->姚明->刘翔。同时给出起始人物的候选关系，也就是米卢的朋友和刘翔的朋友。如果用户不满意推荐的关系链，就可以从这些候选的朋友中选取一个觉得最靠谱的人，加入关系链中。比如用户选择了米卢的朋友——朱广沪，那么现在的起始点就变为朱广沪和刘翔。左边的候选关系也成了朱广沪的朋友（如下图所示）。

微软人立方大揭密——“六度搜索”界面设计的来龙去脉

如此反复下去，直到找到用户满意的关系链为止。这个方式的优点在于能尽最大可能的满足用户的意愿，用户的选择余地最大。而缺点也正如“添加派”所说，使用起来有些复杂，不足够简单J
两种方式的支持者谁也说服不了谁。那就只能拿事实说话——让用户自己来选择。

扎实调研与灵感突现

因为我们项目组还没有做过类似的用户调查，于是这次调查就是一次全新的尝试了。调查的结果出来后，两种方式的支持人数非常接近。看来我们项目组的成员的争论也会发生在实际用户身上。用户调查结果使得争论还在继续，但是项目的期限越来越近了。怎么办？最好能想一个很好的用户场景，能兼顾两者，当然同时要使得使用简单。经过权衡，我们先实现添加方式。麻烦问题又来了：怎么对两端的人物候选布局。因为我们每次对于两端提供多达20个人的候选，那么40多个人一起出现，会使得界面非常拥挤。于是我们尝试实现了每次提示五个候选人名，并加上“翻页”的功能。项目组对这个版本的意见是用户体验不够好。这五个候选人名刚好形成一个半圆弧，由于和中心人物有线相连，非常像大扇子，于是“大扇子布局”由此得名。“大扇子”失败后，我继续思考并实现其他布局，始终得不到大家的肯定。

突然有一天，一个成员灵感一来：为什么不采用关系搜索的布局呢？只显示一个人的候选关系，这样的布局不会拥挤，而且是和前一版本最一致的。用户的使用也更加简单，只能从左到右依次确认关系链上的人物。系统每次只给出当前人物的候选人，比较简洁。这个设计版本很快被实现了出来，其效果终于得到大家的肯定。这也是目前大家所能看到的版本的雏形。

关系接龙

用户的交互行为终于定义好了，接下来的问题是如何吸引更多的人来使用呢？我们采用关系搜索类似的方法，加入分享功能，让使用过六度搜索的人能够分享这个应用给朋友。我们的分享功能的特殊之处在于，用户可以分享搜索的中间结果。使得如果用户不确定和某个人物相关的候选人时，可以把这时的选择状态对应的链接发给朋友，朋友完成选择后，将新的链接发送给用户，使得关系链的搜索能继续进行。这个特色功能被大家取名为：关系接龙。有点成语接龙的味道。如果你能坚持看到这里，就一定要去看看这来之不易的人立方六度搜索。

相关链接：
人立方六度搜索
微软人立方：六度连连看

我的更多文章

下载客户端阅读体验更佳

APP专享