Designing with the Mind in Mind

Tacit 2015-01-10 1

human behavior 教科书

扣 2015-11-02 0

很生活很浅显，非常易懂，交互设计基础书

黑椒炒饭 2016-09-10 0

我这么懒的一个人都愿意花几分钟写一下豆瓣的读书简评。就知道我对这本书友多爱了。我在看来是ui设计必备的一本书，尤其是对于网页设计的usability的问题尤其有用，同类型的书中看过最好的一本。

yellow10 2013-08-11 0

心理学+布局设计

raynix 2013-03-19 0

UX必修. 包含很多人脑认知事物的规律与特点.

米亓 2016-02-02 0

极力推荐的一本界面交互设计入门书籍（当时自己读的英文版，中文版见楼下），整书通过说明一些设计原则来展开，其中每个设计原则都按照先说明一个心理学现象，再说明该原则的顺序来展开。在有对比的情况下也许会知道哪个方案更好，但不知道为什么；在没有对比的情况下知道方案不好但在讨论会议上提不出关键性的建议和其中道理。该书将界面设计与心理学结合，阐述了界面的每一处设计都事出有因。

豆他爹 2011-08-10 0

Jeff Johnson新作

viel 2012-12-25 0

受益匪浅

deerinthebox 2012-04-07 0

course reading, read the book again in two days

鱼妹 2014-12-19 0

UI设计的基本原理及心理学要点

Tacit 2015-01-10 1

human behavior 教科书

扣 2015-11-02 0

很生活很浅显，非常易懂，交互设计基础书

黑椒炒饭 2016-09-10 0

我这么懒的一个人都愿意花几分钟写一下豆瓣的读书简评。就知道我对这本书友多爱了。我在看来是ui设计必备的一本书，尤其是对于网页设计的usability的问题尤其有用，同类型的书中看过最好的一本。

yellow10 2013-08-11 0

心理学+布局设计

raynix 2013-03-19 0

UX必修. 包含很多人脑认知事物的规律与特点.

米亓 2016-02-02 0

极力推荐的一本界面交互设计入门书籍（当时自己读的英文版，中文版见楼下），整书通过说明一些设计原则来展开，其中每个设计原则都按照先说明一个心理学现象，再说明该原则的顺序来展开。在有对比的情况下也许会知道哪个方案更好，但不知道为什么；在没有对比的情况下知道方案不好但在讨论会议上提不出关键性的建议和其中道理。该书将界面设计与心理学结合，阐述了界面的每一处设计都事出有因。

豆他爹 2011-08-10 0

Jeff Johnson新作

viel 2012-12-25 0

受益匪浅

deerinthebox 2012-04-07 0

course reading, read the book again in two days

鱼妹 2014-12-19 0

UI设计的基本原理及心理学要点

我想说两句

算不错的一本书

橙子da 2011-11-29 0赞

针对人们的认知特点进而提出一系列在用户界面设计方面的启示，比较有针对性。不足的地方，各人觉得整篇的组织上有点欠缺，有些设计准则反复提过好几次。不过整书的分析模式在目前界面设计类的书里应该算是独具一格的吧。

边看边感叹！

zhaomin0574 2012-01-24 0赞

这是一本相当相当赞的书，我甚至觉得，不应该只是designer or web developer该读这本书，developer, tester, *.master也该看看这本书。UI设计，站在用户的角度去设计，这个真的很重要，尽管有时候在实际情况里偶尔会被驳回，因为要考虑的事情不仅仅是设计而已。

老外写的书，感觉和国内的就是不一样。老外写的，生动有趣，功底深厚，不知不觉吸收知识。有时候，一边看，一边频频点头，表示赞同；有时候一边看，一边恍然大悟，原来如此；有时候，一边看，一边忍俊不禁。

不过，刚开始看的时候，想着，好像不过如此嘛，看了一两章，就暂时搁在那边了，后来，再拿起来继续看，竟停不下来，越看越觉得是本好书。

里面有比较全面的UI设计准则讲解，和形象生动的比喻，和对用户心理的概括。
另外，翻译也很赞！
好书！力荐！

认知心理学与UI的完美结合

Alice 2012-05-24 0赞

做为一个刚上道或许还没上道的PM来说，看了这么有关产品的书，这个我觉得是最有用的一本。这本书比较适合已经工作了一段时间的PM，但还是要继续提升，这本书很适合这类人。书中每讲一个概念，前面会对每个规则对应的心理学原理大概经书一边，然后再应用到UI设计以及产品设计，这些细节很容易被我们忽略，但往往就是这一点点的细节，就可能造成用户的的反感。细细品读，你一定会有收获的，看了这本书我决定读一读认知心理学

认识与设计读后

九月 2012-07-12 0赞

一.我们感知自己的期望
1.经验影响感知
案例：信息和控制摆放一致（app导航上的返回按钮最后不要替换成其他）
2.环境影响感知
案例：按钮突起和凹陷的画法—光源在屏幕的左上角
3.目标影响感知
案例：注册、下载按钮

二.为观察结构优化我们的视觉
格式塔原理
1.接近性——通过拉近某些对象之间的距离，拉开与其他对象的距离使他们在视觉上成为一组
2.相似性——其他元素相同，相似的物体看起来归属于一组
3.连续性——我们的视觉倾向于感知连续的形式而不是离散的碎片（IBM）
4.封闭性——我们的视觉系统自动尝试将敞开的图形关闭起来，从而将其感知为完整的物体而不是分散的碎片。（叠加的文件图标）
5.对称性——我们倾向于分解复杂的场景来降低复杂度。（用平面来表现三维物体）
6.主体/背景——我们的大脑将视觉区域分为主体和背景
   a.二义性图形
   b.网页——印象诱导背景
   c.app引导页面——作为用户注意力焦点的内容临时性成为新信息的背景，新的信息短暂地作为新的主体。
7.共同命运(ＩＯＳ文件夹)

四.糟糕的信息设计会影响阅读
1.网页文字居中对齐——无意识的眼动模式被破坏
五.色觉是有限的
1.红绿色盲无法区分：a.深红色和黑色 b.蓝色和紫色 c.浅绿色和白色

六.我们的边界视力很糟糕
中央凹/边界视野
眼睛以大约每秒三次的速度不断快速移动，选择性地将焦点投射在周围的环境物体上。大脑则用粗旷的、印象派的方式，基于我们所知和所期待的，填充视野的其他部分。
让信息可见的常用方法：
1.放在用户所看的位置上
2.标记出错误
3.使用错误符号
4.保留红色以呈现错误信息
小心使用：
1.弹出式对话框中的信息（应用程序级别的弹出窗口）
2.使用声音（如蜂鸣声）
3.闪烁或者短暂的晃动（只能延续四分之一到二分之一秒，以吸引用户的中央凹关注到它；时间太长，会从无意识的提醒变成有意识的打扰，如广告）

九.识别容易，回忆很难
1.看到并选择要比回忆和输入更容易
2.尽可能使用图像来表达功能
3.使用缩略图来紧凑地描绘全尺寸的图像（PPT、浏览器）
4.越多人使用的功能，应该越可见
5.使用视觉提示让用户知道他们所在的位置
6.让认证信息容易回忆

十.从经验中学习与学后付诸实践容易，解决问题和计算很难
1.显著地标识系统状态和用户当前进度
2.引导用户完成他们的目标
3.不要让用户诊断系统问题
4.尽可能减小设置的数量和复杂度
5.让用户使用感觉而不是计算
6.让系统令人感到熟悉
7.让电脑去计算

十二.我们有时间要求
1.立刻告知收到用户的动作，保持用户对因果关系的感知。（0.1s）
2.让用户知道软件是否在忙
3.在等待一个功能完成的同时允许用户做别的事情
4.动画要做到平滑和清晰
5.让用户能够终止（取消）他们不想要的长时间的操作
6.让用户知道长时间的操作需要多长时间
7.尽可能让用户来掌控自己的工作节奏
0.1s 因果关系感知
1s 最长的谈话间隙
10s 单元任务时间

准备了一年才去读的书

Fea Mac 2013-01-03 0赞

这本书在我亚马逊的心愿单里躺了足足一年，11年的年末我在江北的时候决定了我未来的从业方向。交互设计，先从GUI做起。希望能够逐步过渡到UI，定了目标动作很少。今年假期我开始着手学习交互，读书就成了自学方式之一。

这本书用一天翻完的，言简意赅。一天不能把书中精髓融会贯通，回读一定是要的直到把书中精髓吃透方成。

最近看的书多有交集，有的看似无关的书籍也在互相渗透。关于大脑的研究，西方学者很是感兴趣。本书中关于眼睛的视觉成像原理很想兴趣，日后会在别的书中阅读完善相关知识。

读书笔记

天天 2013-03-19 0赞

认知心理学与设计结合的一本书。（有图版看http://blog.sina.com.cn/s/blog_7b9385b00101jykr.html）

格式塔原理：接近性

接近性：相互靠近的物体看起来属于一组。左边为成行的星，右边为成列的星。
相反距离太远人们无法感知它们是相关的。

格式塔原理：相似性
相似性：如果物体看起来相似，就感觉属于一组

格式塔原理：连续性
我们的视觉倾向于感知连续的形式而不是离散的碎片，必要时甚至会填补遗漏。

格式塔原理：封闭性
我们的视觉系统自动尝试将敞开的图形关闭起来，从而将其感知为完整的物体而不是分散的碎片。
人类视觉倾向于看到整个物体，即使它们是不完整的。

格式塔原理：对称性

我们倾向于分解复杂的场景来降低复杂度。
人类的视觉系统试图将复杂的场景解析为简单和对称形状的组合，所以我们会把上图看成两个叠加的菱形而不是两块顶部对接的隔砖

格式塔原理：主题背景
我们的大脑将视觉区域分为主题和背景。主题包括一个场景中占据我们主要注意力的所有元素，其余的则是背景。

主体/背景经常用来在主要显示内容之后防止印象诱导的背景，背景可以传递信息（用户当前位置），或者暗示一个主题、品牌或者内容所表达的情绪。

格式塔原理：共同命运
一起运动的物体被感知属于一组或者彼此相关的。

相关性和相似性是我们试图给对象分组的倾向相关。
连续性，封闭性，对称性，主题背景则是我们试图解析模糊或者填补遗漏来感知整个物体的倾向相关。
前面都是对静态物体，而共同命运是针对运动的物体。

我们寻找和使用视觉结构
信息呈现方式是结构化和精炼，人们就越能更快和容易地扫描和理解。

我们视野周边的模糊线索可以提供信息，帮助大脑计划往哪里去以及什么顺序移动眼睛。
如果我们看到一个药品的使用期限标签，边界视觉中的一个像日期的模糊影像就足以让眼球移动，使中央凹实现落在那里并查看。
边界视觉还能很好地察觉运动。我们边界视野中任何运动很可能吸引我们的注意，从而使中央凹去注视它

注意力对思考以及行动的限制
模式一：我们专注于目标而很少注意使用的工具

模式二：我们使用外部帮助来记录正在做的事情

模式三：我们跟着信息“气味”靠近目标

模式四：我们偏好熟悉的路径

模式五：我们的思考周期：目标，执行，评估

模式六：完成任务的主要目标之后，我们经常忘记做收尾工作。

响应的一些方法
显示还剩下多少工作，不是完成了多少。这么说不好：已经复制了3个文件。这么说才好：已经复制了4个文件中的3个。
显示总进度，而不是当前步骤的进度。这么说不好：此步骤还有5s。这么说才好：还剩下15s
从百分1开始显示而不是百分0.如果进度条在百分0上超过了1-2s，用户就会非常担心
类似地，在操作结束时，只要非常短暂地显示百分100。而不是百分0.。如果一个进度在百分100上过了1-2S，用户就以为出问题了
说240不好，应该说大约4min

单位任务内的延迟比单位任务间的延迟麻烦。
一个决定反应延迟是否可接受的关键因素是封闭性的高低。
一个在主要单位工作结束后的延迟并不会困扰用户或者对性能有负面影响。然而，在较大的单位任务中的小步骤之间的延迟可能就会让用户忘记计划中的下一个步骤。总的来说，有高度封闭性的动作，例如保存一个文档，对延迟较不敏感。封闭性低的操作，例如敲字，对反应时间延迟更敏感。
在一个单位任务执行的时候，用户将目标和所需信息保存在工作记忆中或者知觉区内。人们在完成一个单位任务后，移向下一个任务前，他们会放松一下。

认知与设计（笔记1）

请叫我小疯子 2013-04-16 0赞

1.我们感知自己的期望：
过去——我们的经验——保持一致；控件摆放一致，颜色字体一致
现在——当前的环境——避免歧义；避免显示有歧义的信息，依靠标准或惯例或明确告知
将来——我们的目标——理解目标；提供用户需要的信息

2.为观察结构优化我们的视觉
接近性——拉开对象的距离使得视觉上成为一组
相似性——分组时，同一组用相似的标记
连续性——滑动控件
封闭性——用叠起的形式表示对象的集合
对称性——用平面来表现三维物体
主题背景——主题用来突出显示的信息，背景慎用可以传递信息
共同命运——运动的物体会被知觉为一组
以上原则通常结合使用

3.我们寻找和使用视觉结构
（1）信息以精炼、结构化、不重复、遵从图形设计规则的方式呈现
（2）结构提高了用户浏览长数字的能力：用户界面应该明确地为不同部分提供独立字段；或者界面提供一个字段但允许用户输入时将号码用空格或其他符号分开；数据专用控件可以提供更多的结构。
（3）视觉层次让人专注于相关的信息
a：将信息分段，把大块整段的信息分割为各小段
b：显著标记每个信息段和子段
c：以一个层次结构来展示各段及其子段，上层的段应该比下层段更重点被展示
（4）在交互控制面板和表单中，可视化层次也很重要

4.阅读不是自然的
（1）糟糕的信息设计会影响阅读
a：不常见或不熟悉的词汇，例如计算机专用语言
b：难以辨认的书写和字体，例如大写字母和空心轮廓的字形
c：字体不能太小
d：文字放在有图案的背景上或者正文和背景反差太小；即使是验证码的设计，也可以用单词而不是杂乱的字母（豆瓣做的很好）
e：信息不要连续多行重复，这很难从中提取出重要的信息
f：居中对齐的文字也很难阅读
（2）软件里要求的阅读很多都是不必要的
a：指令要短小精悍且清晰明确
b：用户界面里的文字要尽量减少
（3）发布之前一定要做用户测试

认知与设计（笔记2）

请叫我小疯子 2013-04-16 0赞

5.色觉是有限的
（1）我们看到的是相对的亮度和色相，而不是绝对的。
（2）区别颜色的能力取决于颜色是如何呈现的
a：深浅度：两个颜色越浅（不饱和），越难区分
b：色块的大小：对象越小或者越细，越难区分
c：分隔的距离：两个色块之间距离越远，越难区分，尤其是当它们之间的距离大到看它们时眼球需要运动
（3）不要用色盲无法区分的颜色
例如：深红色和黑色，蓝色和紫色，浅绿和白色
解决的方法是，转换为灰度图时依然可以区分
（4）影响色彩区分能力的外部因素有很多，设计师们应该记住他们并不对用户的观看体验具有完全的控制。
（5）使用色彩的准则
a：用饱和度、亮度和色相来区分颜色HSB：在灰度模式下要能区分开
b：将强烈的对抗色分开：强烈的对抗色放在一起会发生闪烁
c：使用独特的颜色：黑白，红绿蓝黄是容易区分的颜色
d：避免使用色盲无法区分的颜色对。例如：深红和黑色，深红和深绿，蓝色和紫色，浅绿和白色。不要在任何深色背景上使用深红、蓝色或紫色；相反，在浅黄色、浅绿色背景上应该使用深红、蓝色和紫色。
e：在颜色之外使用其他提示。不要完全依赖于色彩。

6.我们的边界视力很糟糕
（1）边界视觉的作用：边界视觉提供低分辨率的线索，以引导眼球运动，使得中央凹能够看到视野里所有有趣和重要的东西；边界视觉能够很好地觉察运动，即使非常轻微也能吸引我们的注意，从而引导中央凹去注视它。

（2）让信息可见的常用方法
a：放在用户所看的位置上：不要放到关注点以外
b：标记出错误
c：使用错误符号
d：保留红色以呈现错误（信息）

（3）让用户注意到的重武器
a：弹出式对话框
b：使用声音
c：闪烁或者短暂晃动

7.我们的注意力有限，记忆力也不完美
（1）短时记忆的特点对用户界面设计的影响
a：模式：模式允许一个设备具有比控件还多的功能，同样的控件在不同模式下提供不同的功能，模式让交互系统分配不同的意义给同样的操作从而减少用户必须学习的操作数量，例如老罗的rom拍照和摄像。模式的缺点是人们会忘记系统当前所处的模式而导致错误操作，因此需要提供强烈的反馈告知当前所在的模式，要么就避免模式。
b：搜索结果：人们会忘记搜索词，因此应该允许现实搜索词
c：指令：在多步骤操作中，应该允许人们在完成所有操作步骤的过程中随时查阅使用说明。

（2）长时记忆特点对用户界面设计的影响
避免开发出造成长期记忆负担的系统，人们需要工具加强长时记忆
a：安全认证的时候除了提供问题，也应该允许用户创建自己的验证问题
b：对于交互系统来说，用户界面一致性有助于学习和长期保留

8.注意力对思考以及行动的限制
（1）模式一：我们专注于目标而很少注意使用的工具
（2）模式二：我们使用外部帮助来记录正在做的事情。
交互系统应该分别标示出哪些是用户已经完成的，哪些还没有完成；应用软件也应该标示出哪些步骤已经完成；交互系统还应该允许用户标记或者移动对象。
（3）模式三：我们跟着信息“气味”靠近目标
理解用户每次做决定的目标是什么，保证为用户的每个重要目标提供选项，并清晰地标示出各个目标所对应的选项
（4）模式四：我们偏好熟悉的路径
减少中间过程，引导用户到最佳路径，帮助有经验的用户提高效率
（5）模式五：我们的思考周期：目标，执行，评估
（6）模式六：完成任务的主要目标之后，我们经常忘记做收尾工作
交互系统应该设计成对还没做彻底的事情做出提醒，某些情况下系统甚至可以自己完成扫尾工作。

认知与设计（笔记3）

请叫我小疯子 2013-04-16 0赞

9.识别容易，回忆很难
（1）识别与回忆对用户界面设计的影响
a：看到和选择比回忆和输入要容易
b：尽可能使用图像来表达功能:类比现实世界中的物体，或者容易使得图标与它们所代表的意义容易联系起来
（2）使用缩略图来紧凑地描绘全尺寸的图像
（3）越多人使用的功能，应该越常见
（4）使用视觉提示，让用户知道他们所处的位置，例如网银的预留文字、不同的视觉风格、搭建多个桌面
（5）让认证信息容易回忆
a：让用户自己设置密码，自己设置安全问题和正确答案
b：不需要用户回忆认证数据的认证方式看起来不错，例如生物识别（虹膜扫描、指纹扫描、语音识别）对隐私有危险。

10.从经验中学习与学后付诸实践容易，解决问题和计算很难
（1）旧脑即脑干反映本能，中脑控制情绪，新脑即大脑皮层控制着有目的、有意识的活动，前两个进化靠前，所以我们的第一反应总是本能的和情绪的，而非理智的。
（2）在用户界面设计上的影响
a：显著地标识系统状态和用户当前进度
b：引导用户完成他们的目标
c：不要让用户诊断系统问题
d：尽可能减小设置的数量和复杂度
e：让用户使用感觉而不是计算
f：让系统令人感到熟悉：遵守业界习惯、让新软件像旧软件那样工作、用比喻作为设计基础
g：让电脑去计算，例如excel中的日期时间

11.许多因素影响学习
（1）当操作专注于任务、简单和一致时，我们学得更快
a：做一个任务分析
b：设计一个专注于任务的概念模型，其中主要包括对象—操作分析
c：严格按照任务分析和概念模型设计用户界面。尽可能简单，除非有明确迹象表明会有很多潜在客户或者用户需要它，否则一定要坚决抵制添加额外的功能。
（2）当词汇专注于任务、熟悉和一致时，我们学的更快
词汇应该是专注于任务的，熟悉的而不是专业计算机用语，并且保持一致
有一个好的概念模型能够方便开发一套专用词汇，eg产品词典
（3）风险低的时候我们学得快
尽可能防止出错，停用不合理的命令，向用户清晰地展示他们做了什么，让用户能够轻松撤销、反转或者修正错误

12.我们有时间要求
（1）高响应度的系统即使无法立刻完成用户的请求，也能让用户了解状况，它们对用户的操作和执行情况提供反馈，并且根据人类感觉、运动和认知的时长来安排反馈的优先顺序。
（2）要让用户觉得响应度高，交互系统应遵循下面的准则
a：立刻告知收到用户的动作，即使回应用户需要时间，保持用户对因果关系的感知。例如先反馈，再后台操作。
b：让用户知道软件是否在忙
c：在等待一个功能完成的同时允许用户做别的事情
d：动画要做到平滑的清晰
e：让用户能够取消他们不想要的长时间操作
f：让用户知道长时间的操作需要多次时间
g：尽可能让用户来掌握自己的工作节奏
（3）达到高响应度交互系统的另外一些指导原则
a：使用忙碌标识
b：使用用户进度指示：显示还剩下多少，显示总进度，从1%开始，用通常的精确度而不是电脑精确度
c：单位任务内的延迟比单位任务之间的延迟麻烦
d：先显示重要的信息，例如先显示低分辨率图像再高分辨率，而不是慢慢显示高分辨率
e：在手眼协调的任务中伪装重量级计算，eg伪造反馈
f：提前处理
g：根据用户输入的优先级而不是输入的顺序来处理
h：监控时间承诺，降低工作质量来保证不落后
i：提供及时反馈，即使网页也应该如此

都来看看！轻松拿到想要的好书

leier 2013-11-29 0赞

这边有个关于设计师的一周刮书活动，免费的哦，大家有兴趣可以来看一下http://t.cn/8k4qizC 或者直接关注我们的微信headinevent，扫描我们的微信二维码，即可参加刮书活动。有兴趣的同学过来看看吧~~~

N多有用的规则

唐凯峰 2012-02-25 29

一个月前买了这本书，读完后获益匪浅，可以说是我看过的这类书中最好的。作者将心理学的基本原理与设计的基本原则有机地结合在一起，让设计者看破事物的表层，用心设计。本书共12章内容，以下是前十章的笔记，第11章和第12章是介绍具体方法的，很重要很有用，但因为内容太多，就没列出来了。有兴趣的读者可以去购买此书，值得一看。

第1章

不同页面上相同功能的控件和数据应该摆在每一页上相同的位置，而且它们还应该有相同的颜色、字体和阴影等。

第2章

格式塔原理

1. 接近性

通过拉近某些对象之间的距离，拉开与其他对象的距离使它们在视觉上成为一组，而不需要分组框或者可见的边界。

2. 相似性

如果其他因素相同，那么相似的物体看起来归属于一组。

3. 连续性

我们的视觉倾向于感知连续的形式而不是离散的碎片。如IBM标志、滑动条控件等。

4. 封闭性

我们的视觉系统自动尝试将敞开的图形关闭起来，从而将其感知为完整的物体而不是分散地碎片。如仅仅显示一个完整的对象和其“背后”对象的一角就足以让用户感知到由一叠对象构成的整体。

5. 对称性

我们倾向于分解复杂的场景来降低复杂度。如用平面显示来表现三维物体。

6. 主体/背景

当一个小物体或者色块与更大的物体或者色块重叠时，我们倾向于认为小的物体是主体而大的物体是背景。

如果差别不明显时，则依赖于观察者的注意力焦点。

可用于如主题水印、弹出信息等。

7. 共同命运

一起运动的物体被感知为属于一组或者是彼此相关的。如拖动被选中的几个文件。

第3章

信息呈现方式越是结构化和精炼，人们就越能更快和更容易地扫描和理解。

1. 一个长串的数字可以用两种方式分隔：

l 用户界面明确地为不同部分提供独立字段（用三个文本框填分别写年月日）；

l 界面提供一个字段，但允许用户输入时将号码用空格或者其他符号分隔开（可用于填写电话号码、信用卡号码时的文本框）。

2. 设计者可以用控件而不是用简单的（不论分隔还是不分隔的）文本输入框来显示某个具体类型的数据的值和接收输入（日期控件）。

3. 将分段的文本字段和数据专用控件合并起来（邮箱登录地址）。

可视化信息显示能够：

l 将信息分段，把大块整段的信息分割为各个小段；

l 显著标记每个信息段和子段，以便清晰地确认各自的内容；

l 以一个层次结构展示各段及其子段，使得上层的段能够比下层的更重点地被展示。

第4章

糟糕的信息设计会影响阅读，包括：

l 不常见和不熟悉的词汇

l 难以辨认的书写和字型

l 微小的字体

l 嘈杂背景下的文字

l 信息被重复的内容淹没

l 居中对齐的文字

所以要尽量少让人阅读。

第5章

三种因素影响我们区分颜色的能力：

深浅度：两个颜色越浅（不饱和），就越难将他们区分开（不要用浅色标记重点项）；

色块的大小：对象越小或者越细，就越难辨别它们的颜色（图例的色块要够大）；

分隔的距离：两个色块之间离得越远，就越难区分它们的颜色，尤其是当它们之间的距离大到看它们时眼球需要运动。

使用色彩的准则：

1. 用饱和度、亮度以及色相来区分颜色。避免采用轻微的差别。确保色彩之间有较高的反差（但要参考标准5）。一个测试颜色差异的办法事在灰度模式下观察。如果你不能在灰度模式下区分出不同的颜色，那么这些颜色的差别就不够。

2. 使用独特的颜色：红、绿、黄、蓝、黑和白。

3. 避免使用色盲的人无法区分的颜色对。深红和黑、深红和深绿、蓝色和紫色、浅绿和白色。不要在任何背景上使用深红色、蓝色或者紫色。相反，在浅黄色和浅绿色背景上应该使用深红、蓝色和紫色。

4. 在颜色之外使用其他提示。如小图标。

5. 将强烈的对抗色分开。

第6章

让出错信息可见的常用方法：

1. 放在用户所看的位置上。

2. 标记出错误的具体位置。

3. 使用错误符号。

4. 保留红色以呈现错误（信息）。

5. 需要谨慎使用的几种方法：

l 弹出式对话框；

l 使用声音；

l 闪烁或者短暂的晃动；

第7章

短期记忆的特点对用户界面设计的影响：

模式：要么哦避免模式妖媚提供足够的模式反馈的原因。

搜索结果：显示用户的搜索词。

指令：允许人们在完成所有操作步骤的过程中随时查阅使用说明。

长期记忆的特点对用户界面设计的影响：

安全密码：用户可以自定义问题。

快捷键：尽量使用通用的。

第8章

交互系统应该分别标识出哪些是用户已经完成的，而哪些是用户还没完成的。应该允许用户标记或者移动对象，以便分别标识哪些是他们已经做过的，哪些是还没做过的。

第9章

1. 看到和选择比回忆和输入要容易。

2. 尽可能地使用图像来表达功能。

3. 使用缩略图来紧凑地描述全尺寸的图像。

4. 越多人使用的功能，应该越可见。

5. 使用视觉提示让用户知道他们所处的位置：

6. 网站所欲页面都应有一个通用的特定的视觉风格。

7. 网站授权时，显示网站的标志性图标（新浪微博）。

第10章

1. 显著地标识系统状态和用户当前进度。

2. 引导用户完成他们的目标。确保在每一次做决定的时候提供清晰的信息“气味”，引导用户想目标前进，或者明确地通过使用向导。

3. 不要让用户诊断系统问题（如网络连接故障）。

4. 尽可能减小设置的数量和复杂度。

5. 让用户使用感觉而不是计算（如绘图软件中使用对齐网络和参考线）。

6. 让系统令人感到熟悉：

l 遵循业界标准和习惯；

l 让新的应用软件像用户习惯了的旧软件那样工作；

l 研究用户熟悉什么，不熟悉什么。

7. 让电脑去计算。不要让人去做电脑自己就能做的计算。

面向感官和大脑的设计

王坚 2011-11-18 18

我们可以看到很多优秀的设计案例，和很多失败的设计案例，如果我们能知道一些设计准则，我们就更容易判断哪些方案会失败，我们自己进行设计就可以少走很多弯路。

我们可以看到很多设计准则，它们有一致的场景，它们也有一些相互冲突的场景，如果我们能判断到底哪些设计准则更靠谱，我们就更有自信不会盲从。

如果，我们更了解人类的感官和大脑是如何工作的，我们就能判断哪些设计准则是更靠谱的，甚至可以推断出来新的准则。

《GUI设计禁忌》的作者Jeff Johnson是一位跨界的专家，这次他沉淀出来的《认知与设计》比他以前的设计书更薄，因为直指感官和大脑之后，讲清楚这些设计准则就不需要堆积海量案例了，案例不再是一种证明，而是对设计准则的简单阐释。

坑太大，书太薄

Josherich 2012-03-19 8

书中包括了认知，行为，生物，心理等许多领域的内容，但坑挖的太大。对于初学者展示是本好书，书名也说了, 本书仅仅是Simple Guide.

记几个不错的点：

1. 带着目标做事时，其他都是浮云。
our goals filter our perception in other perceptual senses as well as in vision.

The goal sensitizing our perceptual system to certain features.

After we achieve a task's primary goal , we often forget cleanup steps.

prominently indicate system status and user's progress toward their goal.

2.视觉是有血有肉的模拟系统，有着许多用数字观点看很诡异的特性。

The human visual system tries to resolve complex scenes into combinations of simple, symmetrical shapes.

vision is optimized for edge contrast, not brightness.

large color patches make it easier to distinguish the colors.

use color differences visible to all sighted people, on any display.

The resolution of our visual field is high in the center(fovea region) but much lower at the edges.

The vision peripheral is good at detecting motion.

3.认知的过程很大程度上还是个迷
Watermark background can convey information.

We are wired for language, but not for reading.

To see how it feels to be illiterate, look at the text printed in a foreign script such as tibetan.

Information buried in repetition.

each memory corresponds to a pattern of neural activity extending over a wide area of the brain.

let people use perception rather than calculation.

Unbroken concentration on a task is only 10s!

Delays between unit tasks(unbroken concentration) are less bothersome than delays within unit tasks.

[每周读书] 第四十一周 Jeff Jhonson——《认知与设计》

枫影JustinYan 2012-06-02 4

更多书评欢迎访问我的博客：justinyan.me

《认知与设计——理解UI设计准则》，书名初见，会以为是偏视觉设计的方法指引，其实本书是以心理学的角度讲述计算机系统的交互设计原理的。作者Jeff Jhonson本身拥有耶鲁和斯坦福的心理学学位，著有畅销书《GUI禁忌》。

我看的是图灵的版本，译者是老程序员 @yining 张一宁。书本身是针对计算机交互来写的，用了很多计算机系统的例子来作比，译本中除了解释计算机专业的部分要用到计算机术语，在解释心理学原理的时候写得也颇有“Geek”的味道。比如第8章解释人的注意力很容易转移的时候，把注意力比作稀缺资源，容易被释放并转移到更重要的信息上。这里有点像C/C++释放资源的感觉。

这样的语言风格决定了这本书表达清晰，逻辑分明的特点。但于此同时也带来一个问题——多数的读者是没受过计算机专业训练的，大量的计算机术语会使人望而却步。当然，作者与译者或许都认为，软件开发者无论是测试、运维、后台还是前端，都至少应该要了解简单的心理学，基本的交互原理。可惜这理想很丰满，现实却很骨感，相信多数程序员都对交互和设计兴趣不大——虽然我也是程序员——而设计师们则因为看不懂这些术语亦兴味索然。

不过于我个人而言，读这本书仍感到受益匪浅。尽管生物神经的解释有时比较枯燥，但至少让没受过美术和设计专业训练的我知道了格式塔，知道了基本交互原理，还有些从未接触过的想法。在平时的工作中，自己很多时候只是自然而然就这么做了，但是并不知道为什么，解释为什么就是一种理论总结，借助这本书的理论，我得以在项目中与成员沟通时更好地解释自己的想法。

我现在看书的时间基本安排在中午休息的时候，不比之前在学校的清闲，现在看书只求能让自己在工作的忙碌与混沌中看到一丝灵感的光亮，代码诚可贵，想法价更高。无论架构也好设计也罢，无论营销也好推广也罢，混沌的脑袋出不来好的想法。近期看佐藤的整理术有所受益，再看这本认知与设计又有受益，心情不由也跟着好起来，工作也跟着有热情了，不由感慨心情对自己状态调整重要性。我觉得程序员们不妨多尝试进行技术外的阅读（或者画画或者其他不同于技术的活动），即使只是作为心理调整也好。

再一次认识UI

蓝色随缘C 2012-12-03 3

有关于UI设计，到现在才知道自己之前的理解一直是错的，以前一直以为UI就是手机电脑上的那些小图标，就是得那些界面，它们设计的漂不漂亮它们好不好看就是"UI设计师"的工作。
最近去听了次华为“对话顶尖UI设计师”的宣讲，虽然内容很坑爹，但是帮我变相清楚了UI到底是什么东西，因为他们UI的经理竟然以前是学电路的，就这个底子我就基本明白UI它不是一个设计的事。他对他自己既了解设计又懂程序怎么制作的经历表示很happy，并且表示这对UI的帮助很大，所以，好吧，UI设计其实是交互规划，看了这本书我就更明白了，UI换句话说是用户体验规划。
一直认为DESIGN这个词在英文的意思远比中文的设计来的广泛，所以我一直对UI的错误理解我觉得就是这个翻译带来的，我觉得UI应该叫交互规划更好，而我之前理解的UI设计则只是UI设计的一小块：GUI设计，也就是UI里的图形设计。
不得不说这本书写的很好，它通过分析受众的心理和一些体验上的东西帮助设计师设计出对受众更好的交互界面，并且有部分涉及到视觉，也给出了一些经验和建议。
书里提到了众多设计心理学相关的内容，也就是研究UI归根到底我们是研究人类的心理和行为习惯的，所以，UI做的好的人必定是把握受众心理的人，最后的产品做的好不好就来自于对受众的调研和对前人研究的搜集以及相关产品的横向比较。
手里拿着手机用着APP，现在在电脑上打着字，心里无比清楚UI在这个年代处于一种什么样的地位，现在的孩子们从一出生就开始接触一个终端，而这个终端拥有无数内容，将来改变的只会是体验的方式和在这个终端上视觉的感受，占领这个平台的人就会有无比光明的前景。这不像步入夕阳的杂志报纸数码卡片机，我开始犹豫我是否应该向这一块迈出一步，或者其实我心理已经在说，一定要在这一块迈出一步。

UI小白表示还是本很赞的书~附内容简介

不神奇的满大人 2012-01-27 3

此书主讲最新（09年以前）的认知神经科学成果如何应用到人机交互设计上。关于认知神经科学的部分清晰易懂，关于交互设计原则的部分则非常有启发（大概主要因为我是小白的原因），无论搞网页设计程序设计甚至平面设计——都可以在这里找到有用的东西。

第一章总论；

第二章和第三章主要介绍人类视觉感知的7大格式塔原理及其应用；

第四章以“阅读不是人类天然能力”以起点，探讨了后天培养出的阅读到底是特征驱动还是语境驱动的问题（这段如果觉得太学术可以跳过），然后提出人机交互界面上的信息到底如何设计才能让人以最快速度最高质量被接受。

第五章介绍了人类如何感知色彩：“人类对于对比度敏感而不是对绝对亮度敏感”等原理及其应用；

第六章介绍了人类视野的空间分辨率分布：非常小的眼球中央凹比边界视野的分辨率高得多，但边界视野主要能捕捉运动物体。作者基于此提出几种“让信息抓人眼球”的方法。

第七章和第八章介绍了对人类短期和长期记忆的最新研究观点及应用（关于记忆的神经机制介绍得很长，如果觉得太学术也可以跳过…）

第九章展现了“人类识别内容容易，回忆内容难”的神经机制，告诉交互设计者要让用户多识别，少回忆。

第十章和第十一章介绍人类是如何学习的（学习心理学及神经机制），及其如何设计才能让用户最快最好地学会操作一个交互界面。

第十二章介绍了人类大脑的许多时间常量，比如我们看到一个物体与意识到它的存在和说出它名称之间的时间间隔分别为多长，那么交互系统就要尽量在数量级上满足这些时间常量。
--------------
P.S.这本书的设计也很符合他说的设计原则~非常human-friendly~原文和翻译都不生涩，信息的层次划分和重点都非常清晰，最重要的是例证图片多！易于理解啊！！

给四星的原因是书有点小贵。。

一半是心理一半是设计

天天 2012-12-26 2

这是一本认知心理学和设计结合的书，书中的目录，就是人类对待事物的一套流程，书本理论结合实际挺不错的。

整理点笔记:

用户的经验，当前的环境，当前的目标都影响着感知。（废话，也是最重要的一条依据情景而设计，知易行难）

格式塔原理：
1接近性，相互靠近的物体看起来属于一组

2相似性，如果物体看起来相似，就感觉属于一组

3连续性，我们的视觉倾向于感知连续的形式而不是离散的碎片，必要时甚至会填补遗漏。

4封闭性，我们的视觉系统自动尝试将敞开的图形关闭起来，从而将其感知为完整的物体而不是分散的碎片。

5对称性，人类的视觉系统试图将复杂的场景解析为简单和对称形状的组合
6主题背景，我们的大脑将视觉区域分为主题和背景。

7共同命运，一起运动的物体被感知属于一组或者彼此相关的。

我们的边界视力很糟糕，我们视野周边的模糊线索可以提供信息，帮助大脑计划往哪里去以及什么顺序移动眼睛。

短期记忆力等于注意的焦点，即任何时候我们意识中专注的任何事物。最适合用特征来衡量，而不是整个或者成组的事物。

我们跟着信息“气味”靠近目标

完成任务的主要目标之后，我们经常忘记做收尾工作。

单位任务内的延迟比单位任务间的延迟麻烦。

在书本结尾最后附上了一些原则，我就写点gui设计禁忌里的几个原则：
1专注于用户和他们的任务，而不是技术
2先考虑功能，在考虑展示
3与用户任务的角度一致
4为常见的情况设计，分为很多人和很经常
5不要把用户的任务复杂化
6方便学习
7传递信息而不是技术
8为响应度设计
9让用户试用后在修改

设计原则总结

[已注销] 2013-04-20 2

Don’t make me think
如果你要让我考虑怎么用你的软件或者网站，而不是做我要做的事情，那么你就失去我这个用户了。
少即是多

目标影响感知

1.避免歧义：避免显示有歧义的信息，并通过测试确认所有用户对信息的理解是一致的。当无法消除歧义时，要么依照标准或者惯例，要么告知用户你期望的方式去理解歧义之处。
2.保持一致：在一致的位置摆放信息和控件(不同页面上的相同功能),还应该有相同的颜色、字体和阴影等。
3.理解目标：在一次交互的每个点上，确保提供了用户需要的信息，并非常清晰的对应到一个可能的用户目标，是用户能够注意到并使用这些信息。

格式塔原理

在设计一个现实之后，使用每个格式塔原理—接近性原理、相似性原理、连续性原理、封闭性原理、对称性原理、主体/背景原理以及共同命运原理，来考量各个设计元素之间的关系是否符合设计的初衷

视觉结构

结构化呈现能够更快地浏览和理解。信息呈现方式越是结构化和精炼，人们越能更快和更容易地扫描和理解。

视觉层次

将信息分段，把大块整段的信息分割为各个小段
显著标记每个信息段和子段，以便清晰地确认各自的内容
以一个层次内容展示各段及其子段，使得上层的段能够比下层更重点的被展示

妨碍阅读的设计

如果系统给的目标无法阅读这些文字，或者阅读起来非常费劲，文字还不如不要。
前景和背景反差太小，另一些地方反差太大。
大段的文字居中对齐，文字放在有图案的背景上，阅读起来非常困难
将用户界面里的文字尽可能减少，不要让用户看一大版面的文字。

让信息可见的常用方法

1.放在用户所看的位置上
2.标记出错误
3.使用错误符号
4.保留红色以呈现错误信息(使用红色来标记其他信息会导致误解)

注意弹出框的使用

错误：仅仅用于类似确认用户请求操作的执行情况等不重要的信息，就会让人觉得厌烦。
正确：1.紧急情况下的错误消息
      2.非模式的弹出窗口允许用户忽略他们继续自己的工作。
      3.应用程序层的弹出窗口停止了该程序下的所有工作，但允许用户与计算机上的其他程序互动。
      4.系统级别的弹出窗口阻止了所有的用户操作知道对话被关闭。

识别与回忆对用户界面设计的影响

看到和选择比回忆和输入要容易：对用户显示可选项，并让他们从中选择而不是强迫用户回忆出他们的选项再告诉电脑。（识别而不是回忆）
尽可能使用图像来表达功能
越多人使用的功能，应该越可见(解决方案是让许多人需要的功能高度可见，用户就能看到并识别出可有的选择而不是必须去回忆它们在哪儿，相反，少数特别是充分训练的人才会使用的功能，可以隐藏起来。)

在用户界面设计上的影响

显著地标识系统状态和用户当前进度
引导用户完成他们的目标(“气味”含蓄引导用户向目标前进)
不要让用户诊断系统问题
尽可能减小设置的数量和复杂度
让用户使用感觉而不是计算
让系统令人感到熟悉
让电脑去计算

尽可能简单

除非确有迹象表明会有很多潜在客户或者用户需要它，否则一定要坚决抵制。
(这实际上也不仅仅是一种可能性那么简单，每一个新想法都要与很多其他的想法发生联系，这种联系会导致复杂性进一步上升，因此，新想法不断加入导致应用程序复杂性的增加不是线性的，而是倍增关系)

专用词汇应保持一致性

同一个名称，就是同一个东西。不同的名称，就是不同的东西

响应度的定义

(对用户的操作和执行情况提供反馈)
立刻告知已经接收到用户的动作
对操作需要多久时间完成提供一定的指示
在等待一个功能完成的同时允许用户做别的事情
能够智能的管理事件队列
让用户能够终止(取消)他们不想要的长时间的操作
尽可能让用户来掌控自己的工作节奏

不知 2014-10-28 2

人机交互领域，需要建立起来的是一种交互方面的科学。最简单的方法是进行可用性测试，观察用户的操作，发现他们遇到的困难，并通过重新设计来进行纠正。
这是一本为交互系统设计提供工程方法的书。

关于交互界面准则：
不同的交互界面准则有相似性。这种相似有其原因。
所有的设计准则相似，是因为基于人类心理学。人类如何感知，学习，推理，记忆，以及把意图转换为行动。

用户界面设计准则是以人类心理学为基础的。

1 感知
我们感知自己的期望。先入为主影响感知。经验也会影响感知。类似的，当寻找某件东西却不在老地方时，依照经验我们会到老地方去找。
环境也会影响感知，特定的环境也蕴藏了一定的信息。
目标也会影响感知，视觉有时候也是目标导向的。

保持一致。在交互的每一点上，确保提供了用户需要的信息。

2
格式塔原理。
接近性。距离相近，才会感知到他们是靠近的。
相似性。相似的元素看起来是在一组的。
连续性。
共同命运原理。

3
结构化的呈现文字。更好的视觉结构。结构提高了用户浏览长数字的能力。
将信息分段，显著标记每个信息段和子段。
视觉层次帮助用户找到位置。

视觉噪声也来自于文字本身，如果连续多行的文字有重复内容。读者接受到的反馈太少。
文字如果全部都是居中对齐，很大程度上破坏了读者的无意识眼动。

4
颜色
对对比度敏感而不是绝对亮度敏感是人类的有时。
用饱和度，亮度和色相来区分颜色。确保颜色之间有较高的反差。
将强烈的对抗色区分开。

5
视觉边界和视觉重点。
把信息放在用户所看的位置上。
标记出错误。

6
操作已经学会的动作是容易的。
人们倾向于用无意识或者半无意识的方法去减少犯错的机会。
解决技术问题需要对技术感兴趣而且受过训练。

当操作专注于任务，简单和一致的时候，我们学习的更快。

7
响应度。

＊认知与设计＊读书笔记

长不大的小孩儿 2016-01-14 1

感知与设计
◎我们的感知是有偏差的
   ＃过去的经验会影响我们的感知
       －过去的经验会让我们更容易感知到熟悉的事物｜匹配用户认知
       －过去的经验会让我们更习惯用熟悉的模式感知｜尊崇用户习惯
       －过去重复的经验会削弱我们对环境的敏感程度｜避免用户倦怠
   ＃当前的环境会影响我们的感知｜杜绝干扰元素
       －当前的环境会直接影响我们的感知
       －当前的环境唤醒我们对过去的记忆，会间接影响我们的感知
   ＃将来的目标会影响我们的感知｜突出目标元素
       －我们会对某些与我们目标相关的事物比较敏感
       －我们会对某些与目标事物相关的特性比较敏感
◎我们的视觉感知是有组织的｜呈现视觉层次
    －接近性原理：我们倾向于把接近的事物看成一组
    －相似性原理：我们倾向于把相似的事物看成一组
    －共同命运原理：我们倾向于把共同运动的事物看成一组
    －连续性原理：我们倾向于感知连续的形式
    －封闭性原理：我们倾向于感知完整的形式
    －对称性原理：我们倾向于感知对称的形式
    －主体/背景原理：我们倾向于感知主体和背景
◎我们的色彩感知是有限制的
   ＃有些差异不好识别｜体现颜色反差
       －颜色的深浅：两个颜色越浅，就越难区分
       －色块的大小：两个色块越小，就越难区分
       －分隔的距离：两个色块越远，就越难区分
   ＃有些人是色盲｜考虑色盲用户
       －大约有8%左右的人有色彩感知障碍，最常见的色盲是红绿色盲
       －色盲无法区分的颜色对：深红与黑色、深红与深绿、蓝色与紫色、浅绿与白色
       －在深色背景上不要使用深红、蓝色和紫色，最好在浅黄和浅绿背景上使用
◎我们的范围感知是有边界的
    －我们视野的空间分辨率从中央向边缘锐减｜聚焦相关信息
    －边界视觉的存在引导我们快速找到我们正在寻找的、存在威胁的或者正在运动的东西
    －我们的视觉搜索是线性的，除非目标“跳入”到边界视野内｜突出重要信息
    －颜色、形状、运动、闪烁、声音等都可以让目标具有“跳入”效果

阅读与设计
◎我们的阅读方式以特征驱动（自下而上）为主、情景驱动（自上而下）为辅
    －熟练的阅读大部分基于对特征、字母或者单词的无意识识别
    －非熟练的阅读还需要语境提示的帮助
◎我们的阅读能力很容易受到影响，糟糕的书写或者显示会影响阅读｜清除阅读障碍
    －不熟悉或者不常见的词汇
    －难以辨认或者字号太小的字体
    －带图案的背景
    －重复性或冗长的文字
    －居中对齐的格式

注意与设计
◎我们的注意力是有限制的
   ＃我们注意的对象是有限的｜把握信息主次
       －我们的注意力往往高度集中并且具有选择性：目标相关的事物、具有威胁的事物、正在运动的东西、人脸、性和食物
   ＃我们注意的容量是有限的｜控制信息层级
       －我们能够注意到的事物一般保持在“4±2”区间

记忆与设计
◎我们的长期记忆系统具备两项功能：识别和回忆
◎识别较易、回忆很难｜看到和选择比回忆和输入要容易

思维与设计
◎我们的大脑有两套思维系统：感性思维和理性思维｜转移复杂操作
    －感性思维执行熟练掌握的活动，是无意识的、自动的，消耗很少甚至不消耗短期记忆资源，能与其他活动同时进行
    －理性思维执行尚未学习或者很难学习的活动，是有意识的、受控的，对短期记忆有着很高的要求并且无法并行处理
◎我们的行为主要靠无意识进程驱动，只有在需要的时候意识进程才会介入
◎我们只有通过不断地训练，才能渐渐把有意识的思考过程转化为无意识的思考过程
    －当实践是经常的、规律的和精确的时候，我们学得更快保持认知一致
    －当操作专注于任务、简单和一致的时候，我们学得更快保持操作一致
    －当词汇专注于任务、熟悉和一致的时候，我们学得更快保持词汇一致
    －当环境很安全或者犯错代价很低的时候，我们学得更快降低犯错代价

协调与设计
◎菲茨定律：使用指点设备到达一个目标的时间取决于当前设备位置和目标位置的距离和目标大小
    －距离越远，到达时间越长移动距离要尽量短
    －目标越小，到达时间越长点击区域要足够大

我要写长评

想读在读读过

标签(多个标签以“，”分开):

保存

Designing with the Mind in Mind

推荐文章

猜你喜欢

附近的人在看

推荐阅读

拓展阅读