第十五章 防止错误 通知决定

一、运用富视觉非模态反馈

1.1 富视觉非模态反馈，大多不适合初学者

1.2 听觉反馈，避免负面的，提供正面的

二、撤销、恢复和可逆的历史操作

2.1 撤销应当遵循心理模型：撤销不代表错了，用户不会承认错，这只是探索和尝试。

2.2 共同的撤销类型

隐蔽/解释性，单次/多次，撤销和恢复，分组多次撤销

2.3 撤销的其它类型

不连续的多次撤销(需要解释性撤销配合)/分类撤销/已删除的数据缓冲区/版本控制和还原/冻结

2.4 撤销可撤销的

三、假设：对比和预览

第十六章 为不同的需求而设计

一、易学性和帮助

1.1 命令模态

1.2 有效功能工作集

通过重复使中级用户记住的部分命令和特性就是有效功能工作集。每个用户的工作集不同。最常用的功能生成的最小子集就是最少工作集。

1.3 上下文帮助和辅助界面（为新手）

1.导览教程guide tour&覆盖层教程overlay，注意一般在最后一页要有如何再次调出界面的入口介绍，一般5－7屏

2.库和模板，让用户不用从0开始创建

3.输入与内容区域提示

4.向导的优缺点

5.工具提示和覆盖式工具提示

1.4 传统的在线帮助（为中级用户）

应用内的用户指南不是帮助的首选，导览和覆盖层教程才是。

二、可定制性

个性化（装饰，提升亲切度），配置（移动，添加，删除），特质模态行为（有时用户测试会显示用户偏好明确分为2组或更多组，他们的偏好就是特质模态的，要想办法同时满足他们）

三、本地化和全球化

四、无障碍性

在设计时要考虑到，无论因为年龄、事故、疾病而有认知、感官、移动障碍的人，还是没有此类障碍的人，都能有效使用产品。

4.1 无障碍的目标

1.用户能够感知、理解所有的提示、信息和反馈

2.用户能够感知、理解并轻易操作所有的控件并进行输入

3.用户能够轻易的导航，并且总能知道所处界面的位置及其导航结构

4.2 无障碍人物模型

4.3 无障碍指导方针

1、利用操作系统的无障碍工具和指南

2、不能覆盖用户选择的系统设置

3、启用标准的键盘访问方式

4、为视觉不佳的人加入显示选项

5、提供只有视觉和听觉的输出

6、不要有闪动、闪现、闪烁等视觉元素

7、使用简单、明确、精炼的语言

8、响应时间要能满足所有用户

9、使用一致的布局和任务流程

10、给视觉元素添加文本释义--屏幕阅读器能读，但是一般用户未必能看见

第十七章 整合视觉设计

一、视觉艺术与视觉设计

艺术家表达自我，设计师重点在清晰沟通。

二、视觉界面设计元素

视觉界面设计关注在于如何处理和安排可视元素，传达行为和信息。以下要素要谨记：情景（最重要）、形状、大小、颜色、方向、纹理(能供性)、位置（可用来传达层级消息，空间关系可以反过来暗指概念关系）、文字与版面（使用高对比度文字80%对比度，小字号最好使用无衬线体，简洁的组织文字）、信息层级、动效

2.4 颜色，颜色比形状更容易抓住用户注意力

1、色值（深浅，加白）--对比才有意义。吸引注意力的好工具

2、色调--色调的巨大差异能迅速吸引注意力，但用户往往对色调有联想。 色调与大小和色值不同，内在不是有序和量化的。使用有限数量的色调，注意色盲的问题。

3、饱和度（鲜艳还是暗淡，加黑）--对比才能发挥作用。饱和度是量化的，较高的饱和度与较高色值密切相关。

4、HSV结合--上述三个值共同描述了界面的任何颜色。

三、视觉界面设计原则

3.1 传达风格/传播品牌

3.2 带领用户理清视觉层次，给有关系的元素建立联系，眯眼测试

3.3 在组织的每一层提供视觉结构和流，对齐到网格，创建逻辑路径（眼睛浏览的路径），界面元素平衡

3.4 在特定屏幕上告诉用户能做什么，使用图标、传达功能感、将视觉符号与对象关联起来、简单的渲染图标和视觉符号、尽可能预览视觉效果

3.5 响应命令

3.6 把注意力吸引到重要事件上，这里有两个挑战：吸引注意力的机制不在我们有意识的控制之下；很难保持注意力信号有效的同时还保持体验一致

3.7 最小化视觉工作量，多余的视觉元素将人们的注意力从那些传达能供性和信息的主要对象上转移到他处

3.8 保持简单，不断删减，直到破坏了设计，再把最后去掉的加上

四、视觉信息设计的原则

1.加强视觉对比

2.显示因果关系

3.显示多个变量

4.在一个界面中整合文本、图形及数据

5.确保内容的质量、相关性和完整性

6.在相邻空间上显示事物，而不是按时间堆积

7.可量化的数据就要可量化

五、一致性和标准化

第十八章 为桌面应用而设计

一、剖析桌面应用

1.1 主窗口和辅窗口

1.2 主窗口的结构

二、桌面系统中的窗口

1.层叠窗口

2.平铺窗口

3.虚拟的桌面空间

4.全屏应用

5.多窗格应用（outlook，tab）

6.窗口状态：最小化，最大化，多元化

7.窗口和文档：MDI（多文档界面，ps sheets of excel）和SDI（单文档界面，sketch）

8.窗口的运用：在定义设计框架时要考虑好用哪种窗口，不能随意给应用程序增添不必要的窗口，当用户执行非日常功能时，必须提供特殊的新窗口为场所。

三、菜单

3.1 把菜单作为教学工具

菜单提供一条学习捷径，对新手来说，菜单是索引工具；对中间用户来说，菜单帮助回忆；对高级用户来说，菜单提供了固定的位置或者最为快捷的提醒。

3.2 禁用的菜单项：没有满足使用条件的

3.3 复选标记菜单项

3.4 菜单上的图标

3.5 快捷键：遵循标准；形成日常使用快捷键的习惯；表明如何使用他们

3.6 助记符

3.7 级联菜单VS单层分组：二级菜单中放不常用功能，尽量只一级菜单，并确保鼠标移动的空间和阈值足够大，以免鼠标轻微越界造成次级菜单消失。

四、工具栏、工具板、侧栏

菜单能帮助新手学习，工具栏适合中间用户快速访问，尽量不要使用隐喻，tooltips在鼠标hover了1s左右的时候出现，不能点击的图标要灰掉，ribbon控件

五、点操作、选择、直接操作

鼠标操作：元键、指向、单击、右击、单击拖动、双击、合击、双拖

第十九章 为移动设备和其他设备而设计

一、剖析移动应用

1.1 移动设备的外形大小：手持设备、平板、迷你平板

1.2 手持设备上的应用：堆叠（包含内容的垂直组织结构）屏幕轮显（左右滑动切换内容）方位和布局（根据需要确定是否旋转）

1.3 平板上的应用

1.堆叠和索引窗格

2.弹出控制窗格

3.基于方向的布局，旋转屏幕涉及控件的重新排布和遮挡问题

4.移动布局VS类桌面布局

5.类硬件控件布局

1.4 小平板上的应用

二、关于移动导航、内容、控制的习惯用法

2.1 浏览控件

1.列表，配合导航tabbar可提供多屏内容

2.网格，如照片预览

3.内容轮显，banner

4.泳道，是垂直排列的轮显

5.卡片，图文混排的内容框

2.2 导航和工具栏

标签栏tabbar，“更多”控件，标签轮显，导航栏和动作栏（iOS的nav bar，android的action bar），工具栏和工具板，垂直的工具栏和工具板，工具轮显，菜单栏

2.3 抽屉：次要动作抽屉（常在右侧），双抽屉，条目级抽屉（可发现性比较差），要避免的抽屉行为（不要多度使用弹出窗格和滑动窗格，尤其是窗格出现的方向不同），争议（抽屉让导航隐藏不易被发现，但保持了界面的干净整洁）

2.4 轻拍显示及其他直接操控

2.5 搜索、排序、筛选

在保证搜索的情况下，尽量减少数据输入的方法：语音搜索、自动填充、预加载、最近/频繁搜索建议、自动推荐、分类推荐

2.6 欢迎和帮助界面

三、多点触摸手势

四、让独立运行的App的数据/功能集成

五、其他设备

嵌入式设备的交互设计要考虑：使用环境、屏幕局限性、有限的计算处理能力

5.1 一般性设计原则

1、不要把你正在设计的产品认为是计算机--嵌入式系统，比如照相机、微波炉

2、把硬件和软件设计集成在一起

3、让使用情境来驱动设计--相比计算机，嵌入式系统硬件所在的环境更复杂

4、模态的运用要明智，如果有用的话--限制模式数量，最好能在情境转换时自然切换

5、限定范围--不要把专用系统变成通用电脑

6、要根据显示器的分辨率来考虑导航

7、尽可能简化输入

5.2 专用手持设备的设计

1、持握和携带方式

2、当手操作还是双手

3、避免多个窗口或弹出窗口

5.3 信息台的设计

1、交易型 vs 探索型

2、在公共场合下的交互

3、管理输入--尽量触屏

5.4 为电视界面设计

1、布局、视觉设计清楚

2、导航简单

3、控制器能集成最好

4、遥控要尽可能简单

5、可以考虑给遥控增加显示屏

6、重点放在用户目标上

5.5 为汽车界面设计

1、手离开方向盘的时间要短

2、显示布局一直

3、直接控制对应

4、小心选择输入方式

5、硬件按钮物理外形区别要大

6、显示屏视觉上对比强烈，视觉层次浅

7、模式情境易于理解

8、提供声音反馈

5.6 为语音界面设计

1、按照用户心理模型来组织和命名功能

2、说出当前可选功能

3、任何时候都要能返回上一步和最高一级

4、任何时候都能转接到人工服务

5、给用户足够的时间响应

第二十章 网页的设计

一、基于页面的交互

1.1 导航和寻路

网页的导航量大于软件，信息架构师需要解决逻辑结构和内容流等非视觉的设计工作。

1.一级导航。分类较多时使用左侧导航，大部分使用顶部导航，顶部导航始终置顶，向下滚动时页眉缩小。

2.二级导航和更深层级的导航。多级导航需要提供视觉反馈或者面包渣

3.内容导航：把内容条目组织成列表

4.搜索：自动填充，自动推荐

1.2 滚动

考虑自适应屏幕和视差效果。增加滚动时的可扫描性。

二、移动网页

自适应设计，不同设备间输入方式的不同

三、未来

浏览器将仍然是重要平台，本地软件和网页应用的差别减小。

第二十一章 设计细节：控件和对话框

一、控件

1.1 命令控件

与动词对应的控件类型叫命令控件。按钮（要提供诗句能供性，视觉上最吸引人），图标按钮（易记忆和使用，但入门难），超链接（含图片超链接）

1.2 选择控件

复选框（方形），单选框（圆形），开关按钮

1.3 列表控件

做记号（区分单选和多选），从列表中拖放，列表排序，列表中的水平滚动，在列表中输入数据（现场编辑），下拉列表和弹出列表，组合框，树形控件

1.4 输入控件

1.5 验证输入控件

1.6 显示控件

二、对话框

2.1 合理运用对话框

需要把用户的注意力抽离常规事物流程的地方。

2.2 对话框的基本交互

对话框在视觉上的最上层，一般用动词来做标题以标示用途，至少要有一个可以关闭对话框的终止命令（关闭，OK，cancel）。

2.3 模态和非模态对话框

非模态对话框因为不打断主程序，操作范围不确定，相比模态对话框会比较难以使用；模态对话框一定有终止按钮，非模态一定没有终止；尽量使用OK/cancel这样不易被错误理解的描述

对话框套对话框，尽量不要用

四、魔鬼在细节里

注意点点滴滴的细节，才能做出卓越的产品