2012年里，我(英文原文作者)在TH_NK 里大约花费了50个小时用于可用性测试，其余的时间则主要用来进行实际的设计工作，或是与客户、开发者、分析人员等进行沟通。在这些可用性测试当中，经过对被测者行为的观察以及与他们面对面的交流，我对一些一直以来虽有所了解、但在实际工作中却时常会忽视掉的设计原则有了更加贴近实践的认知，另外也发现了一些从前没有想到过的问题。时值岁末，我将这些经过实践验证的设计要点作以小结并分享给各位，希望能够为大伙来年的工作带来一定参考和借鉴的价值。

1.你不是你的用户

扪心自问，我们真的很容易忘记一件重要的事情：用户并不会按照我们设想的方式去行事。作为产品和设计方面的从业者，我们对自己的产品和服务太了如指掌了，对产品的功能逻辑及设计方案太心知肚明了；即使是作为第三方咨询顾问一类的角色，你也很容易把事情考虑的过于理所当然，认为“外界”的人能非常清楚的理解你所要表达的东西。

而事实上，多数用户在实际上手使用之前，并没有和产品产生长久的关联；对于我们来说很显而易见的东西在用户看来很可能需要一定的辅助才能理解并正确操作。交互模式是否符合直觉，是否能够保持足够的一致性以符合用户逐渐建立起来的心智模型，用户界面是否会在必要的环节提供足够有效的辅助引导，这些都是我们在为核心功能打造设计方案的同时必须考虑到的问题。

2.导航至首页

在很多场可用性测试当中，我们都观察到，其实会通过点击页头logo回到首页的被测者很少；多数人都试图通过点击浏览器上的后退按钮来实现这个目标。虽然对于设计师来说，将logo链接至网站首页的做法是一种早已被普遍接受的规范，但事实上普通用户对这一点的认知似乎并不是那么的根深蒂固。

3.通过下拉列表选择国家

我们曾经对一个面向全球的在线零售网站的支付环节进行过可用性测试，从中我们发现，在选择国家的时候，很少有用户懂得通过首字母快捷键来快速定位国家选项在下拉列表当中的位置，然后通过上下箭头按键进行调整并敲击回车或空格键来完成选择。绝大多数的用户仍然是使用鼠标将列表点开，上下寻找并点击选取。

其实下拉列表易用性的问题(特别是那些所包含的选项超过了7个的列表)早就引发过广泛的争论，使用快捷键进行操作的方案也是为了解决这方面的问题而孕育而生的，但在现实当中我们仍然发现有那么多的用户实际上并不了解这种重要的导航操作。

Christian Holst在重新设计国家列表 一文中介绍过一种蛮有意思的解决方案，虽然我们还没有对这种方案进行过量化的测试，不过至少它看上去确实比传统的下拉列表方式要好用。

Flickr为用户准备了很多有意思的登录欢迎语，这其实是一个容易被忽略的细节，但Flickr的整体设计风格与产品气质也正是由许许多多这样的细节构成的。也许，只有当这些细节从产品中消失的时候，我们才会发现并开始怀念它们。

我(英文原文作者)会特别在意这些细节，因为它们可以触发用户的情感响应。如果运用方式得当，这些细节当中的小魔鬼可以帮助我们打造出更具人格的产品，并使用户在与之进行互动的过程中产生积极的情感响应；而这种积极的态度会有效的促使用户主动传播和拥护你的产品。这种在人格层面与用户建立关联的设计思路也被称作“情感化设计”。

一点小理论

“情感化设计(Emotional Design)”一词由Donald Norman在其同名著作 当中提出。而在Designing for Emotion 一书中，作者Aarron Walter将情感化设计与马斯洛的人类需求层次理论联系了起来。正如人类的生理、安全、爱与归属、自尊和自我实现这五个层次的需求，产品特质也可以被划分为功能性、可依赖性、可用性和愉悦性这四个从低到高的层面，而情感化设计则处于其中最上层的“愉悦性”层面当中。

一个有效的情感化设计策略通常包括两个方面：

1. 你创造出了独特并且优秀的风格理念，令用户产生了积极响应。
2. 你持续的使用该理念打造出一整套具有人格层面的设计方案。

接下来，我们将一起了解一下情感化设计的组成要素及相关策略，看一看有哪些产品在这些方面做的比较有代表性；另外，我们还会通过几个案例分析来感受一下从整体角度持续使用情感化设计理念所带给产品的“人格魅力”。

亲密是爱情关系中的温暖体验，是一种朋友般的亲近。由于真正喜欢和对方在一起，渴望同对方一道建立更有凝聚力的和谐关系，希望把自己的生活以坦诚、不设防的方式与对方分享。伴侣间会发展出属于两个人的沟通风格，熟悉彼此不完美的个性。亲密令恋人互相关心，善待对方，满足彼此的需要和欲望。亲密没有激情强 烈，但能促进恋人相互亲近，让人感受到人际温暖。

根据DailyTech的统计，到2015年，移动互联网的用户数量将会超过桌面用户。除了智能手机之外，使用平板电脑甚至是电视机进行上网的用户也在持续增加。在这种形势下，怎样让我们的网站尽量兼容各种类型的设备，并确保优良的用户体验，这将是越来越重要的问题。

通过响应式的设计开发方式，我们可以使网站页面随浏览设备的不同而自行响应，动态的调整布局结构、元素规格样式，将相同的内容以不同的格式呈现给不同设备的用户。

如果你对响应式Web设计还不大了解，可以先参考阅读我们之前的关于响应式设计的概念、组成要素及基本实现思路 方面的文章，全方位预热一下。

什么情况下适宜采用响应式Web设计的方式

当客户提出产品功能移动化的需求时，有一些解决方案可供我们选择，包括原生客户端应用、Web应用等；究竟怎样的方式更合适，还是取决于具体的需求情况。另外也要考虑网站本身是否需要实施移动化。虽然响应式站点并不能算是一种纯粹的移动化解决方案，但是，在某些情况下，这种方式是非常值得考虑的。

你心里没谱

设计开发一个全新的移动版本站点或是客户端应用，整个过程是有很大挑战性的。除非产品正式上线，否则你无法真正了解它是否会成功。与其单纯的为了移动化而花费资源打造移动版本站点或是开发客户端应用，不如先花些心思将原本的网站打造的更具弹性，使其在各种主流移动设备中都拥有尽量优秀的用户体验。

你想节约成本

要打造响应式站点，自然离不开有经验的交互、视觉设计及前端开发人员。所需的资源，尤其是时间方面，比起普通网站来说大约增加20%到30%的样子；但比起单独打造移动版本的网站，或是设计开发客户端应用的成本来说，却要低很多。从维护的角度来说，也会轻松很多。

你希望网站可以兼容未来的新设备

所谓的移动版本站点，通常是针对某类具体规格的设备进行单独打造的，弹性比较差。新的移动设备层出不穷，传统的移动版本站点需要不断的进行更新维护，才能尽量保证在新设备中工作良好。响应式设计可以根据设备浏览环境的具体规格进行判断，使用不同的呈现方式来展示内容，无需针对某种特定的规格进行维护，适应性更好。

无论是用于注册、支付还是联络，我们总是需要通过表单来获取用户的信息。不幸的是，在现实当中，总会有很多访问者一见到表单就会立刻点击浏览器上的后退按钮。这里面原因有很多，例如表单篇幅太长、不大友好、不那么值得信任，或是用户还没真正准备好进行交易等等。

这种情况每发生一次，我们就失掉了一个潜在用户。怎样将表单设计的让尽量多的访问者更愿意完成填写，这是设计师们必须面对的挑战。站在用户的角度，我们可以将问题分为四个方面。

我能得到什么？

一提到“转化”，设计师们首先想到的往往是一些相关操作的细节问题，包括按钮的颜色、标题的字号、对比度、对其方式等等。当然，这些是必须考虑的，但最最首要的问题是：作为网站的访问者，我为什么要填写表单？我能得到什么？

访问者不会简单的因为你提出了相关要求而把自己的个人信息透露给你；你要让他们看到这样做的好处在哪里。不妨把这件事看作一种交易，你的访问者提供他们的名字与邮箱地址，从而换取到一些他们需要的东西，例如享受服务、免费试用软件、下载PDF文档等等。

除了让浏览者知道他们能得到什么东西以外，你最好还能告诉他们这东西为什么是他们所需要的。要聚焦在产品的价值上，如果你能用最简单的介绍文字描述出你的产品能帮用户解决怎样的问题，唤起他们的共鸣，那么即使表单本身稍微复杂些，他们也会愿意完成填写；否则，字段最少的表单也不会引起他们的兴趣。

为什么要改版？

随着科技的发展，时代的进步，微博用户的上网设备也在快速更新。研究一下微博用户的屏幕分辨率使用数据我发现，屏幕分辨率越来越高的同时，伴随的一个数值，也就是显示器显示网页外的空白面积也越来越大，如何利用好这部分空间是一个值得研究的课题。

前期看了一些同类产品

Clear的出现引起了大家对手势操作的热忱, Google新专利采用“连续手势”也让我们看到了个性化手势的前景。确实，手势操作能够减少界面元素，提升效率；但其不可见性，抽象性，需记忆性等特点也决定了它的弊端。如何扬长避短，根据现有手势的特点在合适的情境中使用，同时根据文化约定、实物隐喻、表音、表意等发想创新手势，而非一味地追逐跟风，值得我们思考。本文结合了珊璞之前对客户端手势应用的分享以及网上的相关资料，从手势的空间感带来的心理感受，手势赋予的功能，引导方式，与动画的配合，创新几个角度进行了总结。许多是大家已知的想法，在这里仅做简单的梳理；而引导方式、与动画的配合等，希望大家能有更多的思考，因为通过动画、转场、拟物等方式，可以使注意力与流程更加流畅，同时贴合现实世界，从而有助于手势的抽象性、需记忆性的克服。阅读全文

一、空间感带来的心理感受