设计原则VS实际情况

10月 4th, 2007


这是一个网络相册。是不是该有“上传照片”这个按钮？我当时的意见是：不要有。理由是：只有在某个相册中才可以上传照片，在“根目录”（XXX的照片集）下，并不能上传照片，既然不能上传，所以不要有这个“上传照片”按钮，即使提供这个按钮，点了之后同样是要引导用户去选择相册或新建相册。
现在看来这个结论显然是不对的。问题出在哪儿？当时也确实有其他的同事反对，但并没有给出足以说服我的理由（也许是我太固执）。记得当时反对的意见大概是：“你这个想法可能从专业、学术的角度上是对的，但是实际情况…”如果仅仅是根据所谓的实际情况来判定一个设计，显然是靠不住的。因为那时说的实际情况也只是那位同事那个时候对实际使用情况的猜测。
上面描述的这个错误到底是怎么产生的？作为交互设计师怎样才能避免运用所谓专业的观点做出错误的设计？

我们需要先从设计的含义说起。
“所谓设计，指的是把一种计划、规划、设想、问题解决的方法，通过视觉的方式传达出来的活动过程。”—王受之

设计是计划、规划的过程，比如我们设计一个洗衣机，要考虑把所有的操作按钮放在统一的一个区域内，在这个区域内再将操作性质相似的按钮放在一起，并且画个圈把它们圈起来。“相似信息有相似的表现。”基于电脑的软件产品的设计，也有这样的设计思路。

但是，如果要无条件的恪守这个原则，那么，下面这样一个tabs就有缺陷了：

这是一个邮箱。第一个tab是所谓的主页，第二个是收件箱列表，后面两个是分别打开的两封邮件（当然，还可以打开更多这样的tabs）。如果要保证内容的逻辑性，不同类型的tabs是不是就要区别表现了呢？分别打开的单封邮件们类型是一样的，应有一样的变现；收件箱算是个单独的类型，单独表现；主页也是特殊的，也需要单独表现；其实还会出现撰写新邮件的tab，又多了一种。这么做的结果就是tabs变成了调色板，肯定不成。要严格遵循内容逻辑的要求，不仅不会使这些tabs更容易理解，反而是混淆视听。

撤一个更远一点儿的例子。“一个由主人生成的列表需要有添加、修改、删除功能。”这也是个有价值的设计原则。那么，下图中的这个订阅列表，是不是有缺陷呢？

每个订阅的条目后面都应该跟一个删除按钮才对啊。然而在实际的使用中，添加一个新项是比较经常的操作，而删除现有的项并不常用。把删除按钮藏起来，不仅页面重点内容（订阅的标题）更突出了，同时可以避免误删除操作。考虑实际的使用情况，把删除按钮藏起来是更合理的。

那么，设计的过程中怎样考虑实际情况？实际情况到底是哪些？考虑实际情况是不是意味着设计工作是无据可依的？

设计的目的是为了弄一个易用、好用、用户喜爱的产品出来。前面说的这些原则是一些手段、工具，为的也是实现这样的设计目的。是否遵循设计原则并不是衡量设计质量的标准。那么，什么才是衡量标准？帮助用户高效的完成任务才是标准。这里说的“任务”是指通过人物角色设计、情景描述总结出的用户任务。用户任务就是实际情况。这些任务是可知的。

再次看“上传照片”按钮这个问题。设计人物角色，一定会有一位这个网络相册的注册用户，他需要的时候会来使用相册。情景描述中也一定会有这么一天，他旅游归来，想把旅游拍的照片上传到网络相册里。分解出的任务中就必然有这样一条：登录网络相册，上传照片。象前面说的，他会是在需要的时候来使用，并不是天天来。所以他对界面并不那么熟悉。那么，如果登录进来的首页（“照片集”页面）上找不到能“上传照片”的字眼儿，也许他就要犯难了。他的任务，上传照片，完成起来就比较困难了。
当然，你可能会质疑上面的种种假设，“如果他是天天来用相册呢？”“不把上传照片按钮放出来也许他也能找到呢？”……这些问题都是其实关于如何设计人物角色的，不是这里讨论的重点，就不多说了。（当然，也许是我多虑了，专业、聪明的您，也许根本不会有这样的质疑。）

“上传照片”按钮的去留问题可以很清楚的决定了。做出这个判断不是靠现有的设计原则；不是靠某人的经验；不是靠大老板的决策；不是靠与会人员的举手投票；不是靠扔鞋…

设计的衡量标准是看是否有助于完成用户任务，而不是对设计原则的遵守情况。设计原则是一些源于实际经验的总结，为的是给实际的设计提供指导。即使没有所谓的设计原则，运用人物角色这样比较科学的方法也可以设计出很好的产品来，只是可能要多费些力气。

有40 条对“设计原则VS实际情况”的评论

  1. 力 说：
    10月 5th, 2007 at 1:08 上午

    顶一下。

  2. 猪猪 说：
    10月 8th, 2007 at 9:09 上午

    用例最重要！

  3. 萋萋 说：
    10月 8th, 2007 at 10:29 上午

    读完第一段，我的判断是有必要保留“上传照片”。第二个例子，既然选定了tabs的表现方式，页面之间就已经设定成了平等关系，调色也改变不了。但实际情况下，这样的呈现方式确实更方便用户完成任务。第三个例子，删除是很少用到，只是我在第一次需要删除操作的时候，的确费了不少周折……

  4. GOGO 说：
    10月 8th, 2007 at 3:49 下午

    方法是死的,人是活的.

  5. kevin 说：
    10月 9th, 2007 at 10:38 下午

    同意楼上,http://blog.sina.com.cn/kevin197832

  6. 西贝 说：
    10月 12th, 2007 at 10:41 上午

    “上传照片”是很有必要的，同意保留

  7. 夏天 说：
    10月 12th, 2007 at 3:57 下午

    不知道是否允许照片不属于任何的相册而独立存在？把相册看作对照片的分类的话，自然可以存在上传照片。如果把上传照片看成一个快捷的操作的话，我觉得也可以存在。个人看法

  8. 久装鳖即成鳌 说：
    10月 12th, 2007 at 5:35 下午

    我认为这里是不需要出现上传照片功能的,上传照片功能应该如你最开始所说明显的放在单个相册中,直观的看到上传.

    情景描述存在错误,有两种情况一种是他从未使用过,一种是已经使用过.
    如果已经使用过,很明显他已经清楚怎么操作
    如果是第一次使用,根本不会存在任何相册,只有一个创建相册的按钮
    当整个页面就一个按钮,叫创建相册的时候,我不认为这会让使用者多迷惑.

  9. JoeCom 说：
    10月 15th, 2007 at 3:37 下午

    绝对要保留 上传照片 的功能。

    至于怎么选择相册的问题，可以在上传照片的是可以选择已有的相册，也可以创建新的相册。

    这样：
    1、对于新用户来说，可以直接进入主题：既上传了照片，又同时创建了相册。

    2、对于老用户来说，也是一个快捷的渠道。

    所以我觉得，反而是不是需要保留 “创建相册” 的按钮。
    因为：
    1、我第一次来的时候我可能还不知道上传相片一定需要先创建相册。
    2、对于老用户来说我已经知道在上传照片的时候就可以创建相册，所以没有必要再来单独创建。

    以上为个人愚见！

  10. 二房 说：
    10月 18th, 2007 at 10:15 上午

    设计的衡量标准是看是否有助于完成用户任务，而不是对设计原则的遵守情况。
    这句话经典

  11. icekernel 说：
    10月 18th, 2007 at 2:15 下午

    这里上传照片的意思是为这个相册增加照片还是 创建新相册？

    facebook里 相册为空是 add photo 相册有照片是add more photos

  12. Orient 说：
    10月 18th, 2007 at 3:37 下午

    看到第一个图，我首先想起了我们的相册管理，基本是一模一样的，“上传照片”不管对于新老用户来说，都是最常用的功能，放在左上角这个位置是很合适的，“创建相册”的使用率应该仅次于前者，而这两个放到一起，会让用户迅速的定位，相反我们的blog这个位置，还有“照片列表”“相册列表”两个链接，这样，“上传照片”的位置就需要斟酌了，或者说，“照片列表”和“相册列表”的存在意义也值得考虑了。

  13. justkiddings 说：
    10月 21st, 2007 at 3:32 下午

    同意保留上传照片按钮，请交小胡、小温执行

  14. 小皮 说：
    10月 24th, 2007 at 4:08 下午

    问题不在上传图片这个按钮。
    问题在不建立相册也要能上传图片。

  15. cindy 说：
    10月 26th, 2007 at 5:30 下午

    如果上传照片是用户进入系统的一个很重要的功能，有什么理由不提供给他一个快捷直接的入口呢。先选定目标相册再上传照片是理性的逻辑，更多是从系统设计者的思路出发，但用户的想法往往是单纯直接的，“我要传个照片”，“我要看看这相册里的东西”。。。我们应该提供更多方式去让用户达到原始目标。

  16. 风中鹰 说：
    10月 27th, 2007 at 6:18 下午

    最近看了比较多的博客，看到了很多分析的案例，在你这学到了很多的东西，谢谢！

  17. JoeCom 说：
    10月 31st, 2007 at 9:35 上午

    cindy ，赞一个！

  18. vincent.z 说：
    10月 31st, 2007 at 1:01 下午

    我们网站也有上传照片这样的服务，并且还有上传音乐
    我们的做法是在用户管理的任何页面都能看到上传服务这样的基础服务快捷按钮
    很显然这样并不会产生任何误导用户的可能，因为这是一个最直接的服务说明。
    并且通过上传数据证明这样做了以后是有利于提高用户上传作品机率的

  19. algabin 说：
    11月 2nd, 2007 at 1:01 下午

    为什么不改进一下”上传照片”按钮呢?

    我觉得这个按钮是有必要保留的,不管新手熟手,提供一个快捷的上传途经是应该的

    可以在上传后面加上一个向下的小三角.当用户点在小三角区域的时候,显示一个当前相册列表,大概如下

    上传到 新建相册..
    上传到 相册名称一
    上传到 相册名称二
    上传到 相册名称三
    上传到 相册名称四

    如果相册比较多,可以在默认显示前几个相册名称后面加个 更多..

    这样不是更好么….以现有的技术,实现起来并不难.

  20. 匿名 说：
    11月 5th, 2007 at 3:26 下午

    上传照片还是要的
    如果我肯定是要传照片上来的
    可是我未必必须创建相册 而且尤其是我未必需要先创建相册再选照片
    创建相册
    可以设计在选择了照片后选择创建一个新相册或者存入已经存在的相册里面。

  21. 开开 说：
    11月 7th, 2007 at 5:22 下午

    显然应该保留“上传照片”了，需求角度来说，也没理由不让用户把照片放在相册外面。照片和相册就如文件夹和文件的关系，应该是相同级别的。

  22. guoer 说：
    11月 7th, 2007 at 5:50 下午

    上传照片的那个按钮
    我作为用户来讲：想要上传图片的话要点击相应的专题才能够上传。
    这样对我来说太麻烦了。

  23. hi.baidu.com/crazzzzzzzy 说：
    11月 13th, 2007 at 9:00 下午

    我关心上传之后的跳转，应该有更全面的跳转目标选择

  24. GKin 说：
    11月 15th, 2007 at 3:02 下午

    “上传照片”按钮的去留问题可以很清楚的决定了。做出这个判断不是靠现有的设计原则；不是靠某人的经验；不是靠大老板的决策；不是靠与会人员的举手投票；不是靠扔鞋…

    哈哈，让我看到些内幕。不扯话题，这篇文章不错，体现了设计中的实际情况。设计不是靠抛书包就可以的，的确需要考虑更多实际情况，特别是互联网上的UI。

  25. jaryxie 说：
    11月 19th, 2007 at 12:37 下午

    还是回到一个问题，任务导向。看任务在场景中的重要性。

  26. vsky 说：
    11月 25th, 2007 at 9:54 上午

    从此文和评论中受教不少　3ks~
    我个人觉得可以保留上传图片，去掉创建相册的按钮：
    用户来到相册有两个目的：传照片和浏览，这两个跟创建相册都没有直接联系，对于多数低端的网络用户而言，上传照片的概念比相册分类的概念可能更清晰易懂。相册分类的功能可以在上传照片页面作为一个可选操作。

  27. S.J 说：
    12月 20th, 2007 at 3:58 下午

    很经典的总结！

  28. edison wang 说：
    2月 26th, 2008 at 10:53 上午

    如果是第一次用相册,显示”新建相册”的按钮,如果是第二次以后来使用相册,就显示”上传相片”按钮了,

  29. reeze.xia@gmail.com 说：
    7月 8th, 2008 at 3:43 下午

    设计的衡量标准是看是否有助于完成用户任务，而不是对设计原则的遵守情况。
    这句话经典

    恩。完全赞同。
    说个简单的例子哈。就是分类问题。
    以前下了很多的电子书。我就把它分的很细很细。。后来就发现。很痛苦。什么都找不到。。。就想自己写一个管理资料的软件。
    后来tag出现，我就觉得这是个很好的解决方案。

    感觉博主说的完全从理论的角度考虑。

    首先哈：
    我是相册的主人，我想上传照片。
    我跑到相册里。诶？发现没有上传按钮。连按钮都没有怎么上传，他慌了。找啊找啊。找。没找到，不过我是第一次来。一个相册都没有，好吧。在网站功能上先检测用户是否有相册，如果没有就慈悲给个连接，用户传上去了，终于有相册了，第二次来的时候发现，诶？？？？上传的那个上传照片的按钮呢？不见了。。真郁闷。那我看看自己的上传好的照片吧。真好看（自恋中。。。。）啊？？上么有个按钮诶。。说我可以上传照片。。上传了好多的了。（他拼命的让自己记住：要上传照片一定要先点进去相册才行，#%（@#￥%U#(记住了）。

    第二次他有有照片要上传了。记住了要先打开一个相册。他点开了他喜欢的相册，准备传上去，等啊等啊等啊。等了好久，因为网速度的问题。网页始终没打开，因为要打开相册里面的照片也会呈现出来，就得占用很大的带宽。~~哦。终于打开了。啊！！！看到上传按钮了。点击上传。好了。然后继续自恋。。。

    你有没有发现中途做了无用功？ 上传之前把以前上传的照片又看了一遍。。。

    还有个哈。就是问你一个简单的问题。你愿意这样打开QQ么
    开始-》所有程序-》腾讯-》QQ-》QQ.exe

    其实我更愿意桌面开QQ

  30. LINGYISKY 说：
    10月 9th, 2008 at 1:04 上午

    应该有而且删除的左侧是否应该也有一个饿。一点不专业的想法。讨论一下

  31. 学习 说：
    10月 10th, 2008 at 4:36 下午

    “设计的衡量标准是看是否有助于完成用户任务”，请问你又是怎么知道你的判断是有助于完成用户任务的呢？
    绕了一个圈，和你原来同事提出的疑问本质上是一样的。
    因而需要进行用户研究。
    但事实上不能所有的事情，事无巨细的进行研究，要不然设计者连话都不能说了。 于是问题就是，怎样平衡设计者自己的观点和用户调查之间的关系和矛盾。
    比如此例，“上传照片”的功能，稍加分析，就知道需要保留。

  32. shell 说：
    11月 27th, 2008 at 3:45 下午

    同意JoeCom说的

  33. 三三 说：
    1月 23rd, 2009 at 8:21 下午

    我是个普通菜鸟用户，我认为应该有个“上传”。。想上传相片时，可不是想到某个相册里去的，就是像我照像时并没有刻意想放到那个纸质都的相册里、放到哪一页里。你要在具体的相册内才设置“上传”，就相当于实际生活中先要找到了存放相片的相册，才去照相……

  34. cs900601 说：
    1月 16th, 2010 at 12:15 上午

    我觉得吧……
    “上传照片”这个设计本来就是可以改的。在改之前，总得有那么一处地方弄个上传照片的按钮，考虑到用户的方便与界面的简洁，可以用Javascript弹窗，在用户第一次使用的时候弹出来，之后再让用户自己决定是否是要弹出来，比如说，提供设置；或是设定一个默认相册，这些都可以简化操作。

    关键还是这样一点：程序的设计师设计了程序，让用户上传“相片”，而不是上传“相册”，而用户就必须这样做。
    就像一个软件设计出来是因为设计者认为用户会这样用它。所以Fireworks大多数时间就是用来设计网页UI的，PS的某些时间是用来处理Painter.net画出来的图的。并不是PS不能手绘，只是它设计出来的用途就是这样的。
    所以 - 如果真想让用户的体验提升，也可以把“上传XXX.jpg”换成“上传存储卡中的一个文件夹”，同时在服务器端就自动把创建文件夹的事情给做掉了。

    当然，这个扯得有点儿远了，我觉得如果实在是要从是否保留“上传”按钮中选一个答案的话……那还是得在上传的过程中让用户了解到这个网络相册的存储结构是什么样的。

  35. 36 说：
    8月 9th, 2010 at 3:07 上午

  36. 453 说：
    8月 9th, 2010 at 8:55 下午

  37. 368 说：
    8月 16th, 2010 at 12:14 上午

  38. 790 说：
    8月 16th, 2010 at 11:42 上午

  39. 147 说：
    8月 25th, 2010 at 8:22 下午

  40. 574 说：
    9月 5th, 2010 at 5:20 上午

发表评论

您的大名：