本文讲的是你的设计应该「所见即所得」,

几年前的一个夏天,我有机会住在旧金山里同一栋楼不同单元的两个 Loft 公寓中。

由于这是同一栋楼,所以你可能会想这两个单元应该是相似的。的确,它们都有1000平方英尺的面积,墙壁上全是巨大的格子窗户,使得阳光和温度能倾泻到屋子里(住在屋子里就像我的故乡德克萨斯州一样,正午阳光与地面的角度有90度)。它们的屋子一角都有厨房,还有金属楼梯延伸到二楼的开放式卧室,以及那个烦人的中空门。

最大的不同就是我们待的第一个公寓是在高层,而第二个公寓是在底层。为何这会差别这么大呢?高层的公寓有更棒的视野。而两个公寓都有户外空间,底层公寓的户外空间是后院,而高层公寓的户外空间更为隐私,是楼顶的天台。

我们待的第一个公寓有一个露天的天台。可能并没有下图那么奢华,但是当我们第一次看到露台的时候大家都兴奋不已。露台上几张椅子围着一张小桌子,而且可以看到很棒的城市的景色,最棒的就是下午四点跟朋友小酌一杯,来一盘卡坦岛拓荒者,或者在浓雾中读一本很棒的书。

这真是一个超棒的露台。

当我们要搬走的时候,我们告别了天顶露台,迎接我们的是一个小巧的后院。下面的效果图只是为了简单示意,实际上我们的后院并没有草地,但有足够大的长沙发和遮阳伞,一些盆栽还有一个烤架。

这真是一个超棒的后院。

你可能会想到,这两个公共空间是各有优缺点的。我的意思是,一个拥有极佳的视野,而另一个又很方便进出。有得必有所失。

事实上,在两个不同的公寓生活后,我们在露台上享受的时光屈指可数。

在同样长的时间内,_每一个阳光午后_我们都会待在露台上。

我很怀念当时的时光。

而事实上,无论天台多么可爱、装潢得多么漂亮,它的使用次数也不会跟后院的使用次数差不多。

当我们搬到了底层的公寓,我们可以时刻透过窗户看到外面的院子。一天20次、50次,甚至上百次,我们会看到院子里舒服的躺椅还有阴凉的遮阳伞,就在我们眼前。我们会在天气很棒的时候不自觉地走进后院,在院子里办公,与朋友闲谈或者串着烧烤。

当我们住在顶层公寓的时候,我们并不会天天看到露天天台。但实际上走上天台只需要大概30秒的时间,这并不困难。但天台并不在我们的视野内,我们必须想到天台的时候才会走上去。这样的想法就跟决定出发去楼下小卖部或者公园一样。同样的,如果我们有访客,我们才会想到带他上楼,让他赞叹一下我们的天台。我们并不会在屋里闲逛的时候被窗外的景色吸引而跑上天台。我们很容易忘记它的存在,所以我们很少使用露天天台。

我在设计界面的时候,常常会想到天台和后院的例子。

我们设计师很喜欢极简的界面,留白及静谧。我们钟情于将大量的功能和操作以优雅地方式隐藏于视野之外。藏在菜单之后、抽屉列表之内,亦或长按或者轻扫之后。

我们的理由就是,“人们学过一次的操作,他们下次就会知道怎么使用了。”还会说,“无论我们把操作放在界面的哪里,用户都会有相同的选择。”

我们可以很容易地证明可见性和初始状态的重要性。

很久以前,Facebook 在移动客户端的左上角使用面包屑导航来组织信息。这是一个很简洁很优雅、用于区分不同功能模块的方式。(而且这个导航菜单可以保证手机客户端的信息跟网站相一致)这个滑动展开的侧导航也渐渐成为主流,目前市面上依旧有很多应用使用这样的导航。

汉堡包图标导航窗格

但很可惜,汉堡包导航菜单就像露天天台。当你想到“我想前往 X”的时候才会点击。这是典型的_看不到就想不到_。

我们改回了标准的底部标签导航方式,就像从天台到了后院。屏幕上多了更多的元素,但这是个十分常见而且很高效的方式,帮助我们的用户更好地看到我们主要的功能模块,并方便其点击跳转前往。

我找到了一些界面设计中关于_天台_和_后院_的讨论观点:

  • 入口处:当我们设计一个新功能的时候,通常第一步就是直接展示一个理想的原型给用户,同时将新功能的特性以及该如何使用都告诉用户。这个设计思路就跟你在思考你家户外空间的布局和构造一样,首先需要问自己“这公共空间是在房子后面还是在楼顶?”设计界面的时候应该问自己“用户是如何发现这些功能的?”合理规划入口的位置是一件十分困难而且对于你产品的成功与否至关重要的事情,相较而言,争论用户点击之后呈现的功能则没这么重要。

  • 菜单栏:我们试图将大量的功能藏在菜单和手势之后,并且假想用户每次的操作都有明确的点击目标。可是大部分用户却不是这样的,除非设计的时候把某些功能特殊提及。即使你成功地通过隐喻等手法让用户知道如何操作,但是让用户养成操作习惯也需要很长的时间。如果这个功能对于大部分用户而言是十分重要的,那么你就需要强调它。如果这个功能并不重要,则需要考虑要不要去掉这个功能以便减少用户的认知负担。

  • 让用户做选择:当设计时遇到如何安排并组织功能的时候,有时候没有明确的答案,设计团队常常会说,“我们把选择权交给用户吧。”当你这样做的时候,大部分的用户(80%到90%)都会选择有初始内容的方案,所以合理地规划功能内容是设计团队无法避免的工作。(完全不展示初始内容的思路是十分错误的,你很有可能丧失很大一部分不愿意做操作选择的用户)

  • 相关的操作:当用户已经在做某件事或看某物的时候,向他推荐相似的内容,他更容易受之吸引。正在看关于奥运会的文章?那么你可能会对这个作者的其他奥运文章感兴趣。被这张中世纪风格的卧室所吸引?那么为了你的重新装潢计划来看看其他令人惊艳的卧室照片吧。正在给你的邮件事件进行标星分类?那么还有这些事件也是你现在应该需要考虑的。这些都是在体验设计中十分高效的典型例子。

  • 使用具有号召力的平台:有号召力的平台的优势就是他们已经拥有大量的用户。写一篇文章并且放在我的个人网站上就像“天台”一样。写一篇文章并且分享到 Medium, Facebook, Twitter 上,就好像“后院”一样,可以获得更多的流量。这个策略可以应用于所有其他独立的设计中,比如网站空间、网页、App、页签导航或者书签。问问自己,我是否真的需要创建我自己的平台?是否有更方便的平台帮助我完成我的目标?

如果你想要产品的功能被用户发现并使用,把它放在用户看得见的地方吧。





原文发布时间为:2016年09月10日

本文来自云栖社区合作伙伴掘金,了解相关信息可以关注掘金网站。

你的设计应该「所见即所得」相关推荐

  1. keil5图标变成白色_设计师必看的图标设计指南「下」

    书接前文,图标设计指南下篇. 我们了解了 icon 的基本知识,那么如何设计一个好的 icon 呢?怎样评判我们的 icon 是否合适,是否贴合整个产品呢?我们需要了解什么才是一个好的 icon . ...

  2. 腾讯案例实战!聊聊设计中「需求」的正确打开方式

    吹斯坦 · 粥:入行早期是带交互设计团队,近两年负责产品团队,对于"需求"的接受方和给予方角色都有过扮演,今天想和大家探讨一下"需求的正确打开方式". 每次探讨 ...

  3. 一本书学会可视化设计 pdf_「读书」数据之美-一本书学会可视化设计

    [导读]本文约2200字,阅读时间约为15分钟. 每周,零一与您分享一本书,共同探索数据世界的浩瀚.若您喜欢,可转发与更多的人交流,共同成长. 一.数据 大多数人对于数据,仍然停留到较为表面的含义上, ...

  4. 【ASP.NET】家乡网站设计作业「历史」「人文」「自然」「美食」「高中」

    文章目录 作业描述 结果展示 代码 MasterPage.master(母版页) 首页 历史页 人文页 美食页 景观页 高中页 完整资源链接 上学期其中ASP.NET网站设计老师布置的作业,在此记录一 ...

  5. 排序字段设计_「原创」第四章、模型设计

    java进阶架构师",选择右上角"置顶公众号" 20大进阶架构专题每日送达 模型设计 回顾 前三章我们可以算是一脚迈进了Django的大门(也称入坑),因为程序员入坑第一 ...

  6. 阿里云设计团队为我们带来了「数字」+「设计」的可能……

    Q: 阿里云设计?设什么计? 作为设计师,我们的日常就是解决问题,披荆斩棘不在话下:而其中几乎最棘手的一个竟然是: "如何在过年回家时,给七姑八婶解释我做什么工作." 虽然大可以从 ...

  7. 真正的中台价值,「炒作」之后才被看见

    金磊 发自 凹非寺 量子位 报道 | 公众号 QbitAI 中台,不再「火」了. 如果你是从2015年直接穿越而来的人,很难想象过去5年里,围绕着「中台」.「要不要建」.「适不适合」,「怎么建」,曾有 ...

  8. 「AutoML」强化学习如何用于自动模型设计(NAS)与优化?

    作者&编辑 | 言有三 一直以来,网络结构的设计是一个非常需要经验且具有挑战性的工作,研究人员从设计功能更加强大和更加高效的模型两个方向进行研究,随着各类经典网络设计思想的完善,如今要手工设计 ...

  9. 电子科大64年来首提Nature封面,邓旭团队为超疏水表面披上「铠甲」

    白交 发自 凹非寺  量子位 报道 | 公众号 QbitAI 荷叶为何能「出淤泥而不染」?鸭子怎么能浮在水面上?水黾(mǐn)是怎么实现「水上漂」的? 自然界中实现这些,都有一个科学奥秘--超疏水表面 ...

最新文章

  1. java为啥要捕捉异常_java – 为什么在捕获时使用IOexception而不是Exception?
  2. FIS前端集成解决方案
  3. 控制程序仅执行一次 php,PHP流程控制(1)
  4. Python之PIL之绘图:基于Python的PIL库绘制各种图形、添加文字等
  5. 软件项目管理0728:项目经理的修养-干系人管理
  6. 带研发团队后的日常思考1 初级管理者的困惑
  7. dev 中 gridcontrol1 滚动条重绘_浏览器的重绘和回流(Repaint amp; Reflow)
  8. [转载] scala
  9. win7映射网络驱动器消失了_win7怎么映射网络驱动器|win7设置网络驱动器的方法...
  10. Java常用类StringBuffer详解
  11. (11)FPGA跨时钟域问题导致数据偶尔异常(学无止境)
  12. 如何彻底删除adobe?adobe官方清理工具怎么用?
  13. tcp粘包 java_详说tcp粘包和半包
  14. 用C语言编程复数计算器,简单实现C++复数计算器
  15. VUE 组件 有数据不渲染 v-for
  16. JAVA设计模式1 ---- 简单工厂模式 (以汽车工厂为例)
  17. 函数对称性常见公式_高中函数对称性总结
  18. 外刊逐句精读|《经济学人》:戒酒、吃素,禁食都有啥讲究?
  19. Word-embeding 【paper】
  20. 数据库(什么是脏读、不可重复读、幻读)

热门文章

  1. 如何将多个工作表合并
  2. matlab tikz,TeX系列: matlab2tikz--matlab图形数据转化为tikz命令
  3. Matlab错误使用 eval
  4. 人工智能面临的主要威胁是对最终失去实际控制人工智能能力的恐惧
  5. 如何使用Google Voice接收验证码?
  6. word目录如何取消某级标题的页码
  7. 夏普电视显示网络无法连接到服务器,彻底解决SQL SERVER 2005无法远程连接的问题...
  8. 真相的监控依赖 让监控规制更加凸显
  9. tizen android模拟器,Tizen模拟器与代码崩溃c0000005
  10. 【perl】正则匹配中的括号套括号的套娃抓取规则