Facebook副总裁:为什么我们把汉堡菜单换成了标签栏?

如果你希望某个重要的东西被用户看到、用到,那么很简单 – 把它放在用户一定看得到的地方,别让他们去找。

文章目录[隐藏]


如果你希望某个重要的东西被用户看到、用到,那么很简单 – 把它放在用户一定看得到的地方,别让他们去找。

Facebook副总裁:为什么我们把汉堡菜单换成了标签栏?

几年前的一个夏天,我和伙伴们在旧金山的一幢loft里住了一阵子。

我们一共住过两个房间,房型大体相似,面积都在1000平方英尺左右,落地窗,光照充足;自带厨房,工业风格的楼梯直通开放式的卧室,门是中空的,开开关关的动静有些恼人。

区别在于,其中一个房间的楼层较高,而另一间位于底层。两个房间都有各自的室外活动区域:底层的房间自带庭院,而楼层较高的房间离楼顶的天台很近。

我们一开始住在楼层较高的那间房,天台的样子大致可以参考下面这张照片。我们第一次上来的时候有些小激动,桌椅一应俱全,景观很棒,大家可以喝喝香槟,玩玩桌游或是看看书。

Facebook副总裁:为什么我们把汉堡菜单换成了标签栏?

接下来,我们换到了底层的房间。下面的照片依然只是用来参考,你可以了解到庭院大致的样子,不过我们的那个没有草坪;面积到是不小,足够摆放沙发和遮阳伞,周围有一些盆栽,还有一个烤肉架。

Facebook副总裁:为什么我们把汉堡菜单换成了标签栏?

看到这里你或许会想,这两套房使用起来的感觉应该差不多,毕竟一间离天台很近,而另一间则直通庭院,都还不错的样子。

实际上,体验过两者之后,我去屋顶天台的次数,用一只手就能数的出来。

在同样长的时间里,我们去花园就相当频繁,每个(晴朗)午后都会去。

我一直在想这个问题。

事实是,没有任何一个天台的使用率能够比得上花园或院子,无论它多讨人喜欢、设施多完备。

我们住在公寓一楼时,我们每次看向窗外,都能瞥见花园。每天能看到20次、50次、100次,我们的眼睛看见了舒适的沙发和遮阳伞。它就在那里。都不必下意识去想,我们发现自己总是想找理由去外面,享受美好的天气。无论是在笔记本上办公,与朋友闲逛,或是正在烧烤。

住在公寓顶楼时,我们每天都看不见天台。它并不是难以到达——上楼大概只要30秒。但它不在视野内。我们得记住它的存在,并且要下决心到上面去。上去所需的意愿,和逛周边商店与公园是同等水平。当然,如果我们邀请了客人来,想让他们大开眼界,就会带他们上天台。但是,我们从不会偶然想起那些桌椅和绝妙的景观。我们很容易忘了有这样一个天台。所以,哎,几乎没怎么用过它。

设计用户界面时,我常常想起花园与天台。

我们设计师喜欢极简主义,喜欢留白,喜欢史塔克家族。我们喜欢把大量功能和选项,藏在精致的角落与缝隙中。在菜单里、在抽屉里、在长按或滑动之后。

我们的理由是,“人们学会一次后,就会一直记得。”我们会说,“无论我们把它们放在界面的何处,人们都会做出相同的选择。”

真是太容易低估可见性和默认项的力量了。

很久以前,Facebook曾经一度在移动应用左上角使用了三横图标(或者说“汉堡图标”),用来展开应用的导航面板。用这种方式来访问我们网站的各种功能,简洁而优美。(作为奖励,我们的移动应用和桌面网站都统一使用了这种导航菜单。)我们把侧滑抽屉导航发扬光大了,如今许多应用中仍然能看到这种设计模式。

Facebook副总裁:为什么我们把汉堡菜单换成了标签栏?

汉堡菜单图标的导航面板

不幸的是,汉堡菜单就是一个天台。你只有想着“我要进入XXX”的时候才会去点它。这就是典型的眼不见心不烦。

我们采用了标准的标签栏,由天台变成了花园。虽然它在屏幕上增加了元素,但这是一种熟悉的模式,高效得多,帮助人们发现和进入我们的顶级功能。

我发现还有许多其他例子,关于天台与花园在UI设计中的讨论:

入口:

设计新功能时,第一步往往是直接开始设计原型,展示这部分功能如何运转。这就像是在设计户外空间的格局与陈设,却没有问过“它在房子后面还是在屋顶?”首先应该要问“如何让人们发现这个功能?”要使你的作品成功,确定入口更加困难也更加重要,胜过反复讨论这项功能如何使用的具体细节。

菜单:

把一大堆选项藏在菜单或手势操作中,非常有诱惑力,我们总会假定人们想找就能找得到。但多数人都不会,除非你积极地推荐这些功能。即使你成功地让人了解到了这些隐藏功能,也需要很长时间使它成为一种常识。如果一定要让用户知晓这些功能,就该明确地展示出来。如果不重要,考虑干脆把它去掉,降低认知负荷。

提供选择:

面对没有明显答案的问题,要做出艰难的产品决策,有时候团队会勉强接受“干脆让用户自己选择”。这么做时,要知道绝大多数(80%或90%)会选择你提供的默认项,无论是什么,所以你其实并不能避开这个艰难的产品决策。(不提供默认项则更加糟糕:你会流失一大批根本不愿意做选择的用户。)

环境操作:

人们正在使用或浏览时,可以推荐一些类似的事情让他们做或看。正在阅读奥运的文章?你可能还对这个发布者的其他奥运报导感兴趣。这张中世纪浴室的照片让你深受启发?请看其他浴室照片,为家庭装修项目提供灵感。正在对星标邮件分类?这里还有些你标记了稍后处理的东西,或许你现在有时间处理。这是体验设计中最有效的模式之一。

利用现有渠道:

现有的分发渠道的力量在于,已经有很多人在用了。写文章发布到个人网站,这相当于天台。写文章分享到Medium、Facebook、Twitter、<此处填写你的选择>,相当于花园,能够捕获更多流量。这点适用于任何独立空间、页面、App、标签页或书签。问问自己:我需要创造自己的渠道吗,还是用其他渠道能更快帮助我达成目标?

如果想要什么被看见,被使用,不要让人去寻找它。把它放在看得见的地方。

#专栏作家#

可乐橙,微信公众号:可乐橙(colachangreen)。人人都是产品经理专栏作家,UI/UX设计师,关注互联网,关注科技。现居杭州,与小伙伴们正在创业途中。或许不是一名优秀的设计师,至少是个快乐的设计师。

本文原创发布于人人都是产品经理,未经许可,不得转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/27909/

(0)
CatherineCatherine
上一篇 2017-05-19 16:58
下一篇 2017-05-19 18:21

相关推荐

  • 交互设计师的60日计划第十九天

    昨天M+头痛,8点下班回来做分享PPT做到11点半倒头就睡了,忘记了写每日…拖延症真是害人,周日拖了一天只写了大纲,周一做了白PPT,今天又加班到10点把完整的PPT做了,明天晚上演练一下。因为一天的拖延,整个一周都…

    交互专题 2015-08-20
  • 如何应对交互设计中的技术实现问题

    数十万互联网从业者的共同关注!作者: 山晓,作者授权早读课转载。公众号:LEX设计生(ID:Lex-design)编辑:Dva技术实现是交互设计的last but not the least环节,甚至有时应该是设计优先考虑的问题,毕竟…

    2017-08-02
  • 网易资深高手:交互设计师必备的9种能力(上篇)

    网易UEDC – 杨杰 : 有好多交互新人或尚未跨进交互设计大门的同学,会经常问的一个问题:交互设计师需要具备怎样的技能和能力?

    2017-12-03
  • 【设计竞赛】2018UIA-霍普杯竞赛开题!扎哈事务所新任掌门人帕特里克 · 舒马赫担任主席

    编者按 :期待已久的2018UIA-霍普杯国际大学生建筑设计竞赛题目新鲜出炉啦!扎哈 · 哈迪德建筑师事务所(ZHA)负责人帕特里克 · 舒马赫担任本次竞赛主席并拟定题目。帕特里克 · 舒马赫Patrik Schumacher扎哈·哈迪德建筑师事务所负责人竞赛主题演变中的建筑Architecture in Transformation竞赛题目城市共生:定制化社区模块Urban Co-living: Customizing Modules...

    2018-02-02
  • 新手转向资深的必经之路——交互文件命名的最详细规范(下)

    接着上一篇文章《新手转向资深的必经之路——交互文件命名的最详细规范(上)》继续整理文件命名的规范继续,今天来讲讲Sketch的Artboard(画板)命名和Layer(图层)命名、Symbol(组件)的命名、导出图片的处理方式。Sophia的tips:真正的高手,细节都做的很好!

    2017-05-01
  • 交互设计和我-一个大四学生的探索交互设计之路

    我不敢说交互设计是什么,因为我没有真正的项目经验,我现在所理解所定义的一切,都是根据交互前辈们的经验以及相关的经典书籍和部分项目讲解。所以用一句不好听的话来说,就是纸上谈兵,对于这个十分刺激我的事实…

    2015-07-27
  • 如果你即将面试交互设计,可以参考一下这篇

    交互设计也是设计类,设计类的面试只要看作品说话而已。但是,偶尔有也会有些面试官完全都不理你的作品,然后会问一些比较宽泛的问题,今天的汇总就是主要针对这部分题目。题目大多都能回答,但是偶尔一个题目打过来还是会有点懵,所以事先做好准备会相对比较好。最最重要的当然是介绍你的作品!介绍你的作品!介绍你的作品!(重要事情说三遍)讲的思路就是你从什么地方找到设计的依据,然后做了什么设计。下面就是面试的其他问题:1、自我介绍。答:(自我介绍算是面试的...

    微信热点 2018-03-25
  • 深入业务和用户中做设计:58APP二手车大类页改版

    今年我们发起了一轮关于58APP各业务线大类页的改版优化,二手车便是其中一个。旧版二手车大类页已连续被用户使用一年多,然而业务属性与用户需求早已发生改变。作为交互设计师,需要在稳定提升大类页功能数据的前提下,重新对页面进行体验升级。

    2017-05-14
  • 交互设计-要避免使用汉堡包菜单

    小编阅读提示,图片是动态哦,需要单击才能看到动态图。 近来,越来越多的研究及测试表明,侧边栏菜单,也就是我们俗称的汉堡包菜单,很可能是一种弊大于利的设计模式。 不过我们也要知道,这个问题实际上是很微妙…

    2014-11-07
  • Medium评选的年度最佳设计文章2016

    译者:陈晶,审校:刘洁 该文章为UXRen翻译组的陈晶和刘洁同学基于Medium的文章《Medium’s Best Design Writing of 2016》整理、翻译和审校完成,为我们呈现了北美科技圈在2016年的最佳设计文章。 注明: 1、以下文…

    交互专题 2017-08-07