1、认知与设计认知与设计理解理解UI设计准则设计准则二、二、UI设计准则设计准则目录目录三、从认知心理学的角度理解三、从认知心理学的角度理解UI设计准则设计准则一、你是怎样设计界面的？一、你是怎样设计界面的？1、完全不知道该如何设计？、完全不知道该如何设计？2、依据经验设计？、依据经验设计？一、你是怎样设计用户界面的？一、你是怎样设计用户界面的？3、依据某一、依据某一UI设计准则？设计准则？4、依据、依据？Shneiderman（1987） 8条条Nielsen&Molich（1990） 10条条二、二、UI设计准则设计准则Stone et al.（2005） 8条条Johnson（2007） 9
2、条条二、二、UI设计准则设计准则原则原则1：专注于用户和他们的任务，而不是技术：专注于用户和他们的任务，而不是技术p 了解用户。了解用户。p 了解所执行的任务。了解所执行的任务。p 考虑软件运行环境。考虑软件运行环境。原则原则2：先考虑功能，再考虑展示：先考虑功能，再考虑展示p 开发一个概念模型。开发一个概念模型。二、二、UI设计准则设计准则原则原则3：与用户看任务的角度一致：与用户看任务的角度一致p 要争取尽可能自然。要争取尽可能自然。p 使用用户所用的词汇，而不是自己创造的。使用用户所用的词汇，而不是自己创造的。p 封装，不暴露程序的内部运作。封装，不暴露程序的内部运作。p 找到功能与复杂
3、度的平衡点。找到功能与复杂度的平衡点。原则原则4：为常见的情况而设计：为常见的情况而设计p 保证常见的结果容易实现。保证常见的结果容易实现。p 两类两类“常见常见”：“很多人很多人”与与“很经常很经常”p 为核心情况而设计，不要纠结于为核心情况而设计，不要纠结于“边缘边缘”情况。情况。二、二、UI设计准则设计准则原则原则5：不要把用户的任务复杂化：不要把用户的任务复杂化p 不给用户额外的问题。不给用户额外的问题。p 清除那些用户经过琢磨推导才会用的东西。清除那些用户经过琢磨推导才会用的东西。原则原则6：方便学习：方便学习p “从外向内从外向内”而不是而不是“从内向外从内向外”思考。思考。p 一
4、致，一致，还是一致。一致，一致，还是一致。p 提供一个低风险的学习环境。提供一个低风险的学习环境。二、二、UI设计准则设计准则原则原则7：传递信息，而不是数据：传递信息，而不是数据p 仔细设计显示，争取专业的帮助。仔细设计显示，争取专业的帮助。p 屏幕是用户的。屏幕是用户的。p 保持显示的惯性。保持显示的惯性。原则原则8：为响应度而设计：为响应度而设计p 即刻确认用户的操作。即刻确认用户的操作。p 让用户知道软件是否在忙。让用户知道软件是否在忙。p 在等待时允许用户做别的事情。在等待时允许用户做别的事情。p 动画要做到平滑和清晰。动画要做到平滑和清晰。p 让用户能够终止长时间的操作。让用户能够
5、终止长时间的操作。p 让用户能够预计操作所需的时间。让用户能够预计操作所需的时间。p 尽可能让用户来掌控自己的工作节奏。尽可能让用户来掌控自己的工作节奏。二、二、UI设计准则设计准则原则原则9：让用户试用后再修改：让用户试用后再修改p 测试结果会让设计者（甚至是经验丰富的设测试结果会让设计者（甚至是经验丰富的设计者）感到惊讶。计者）感到惊讶。p 安排时间纠正测试发现的问题。安排时间纠正测试发现的问题。p 测试有两个目的：信息目的和社会目的。测试有两个目的：信息目的和社会目的。p 每一个阶段和每一个目标都要有测试。每一个阶段和每一个目标都要有测试。三、三、从认知心理学的角度理解从认知心理学的角度
6、理解UI设计准则设计准则p 基于人的认知机理及局限性，剖析基于人的认知机理及局限性，剖析UI设计准则。设计准则。p 从最基本的影响因素，到人们感知的倾向（规律），再从最基本的影响因素，到人们感知的倾向（规律），再到人的感知能力的局限性，告诉人们应该怎样去设计用到人的感知能力的局限性，告诉人们应该怎样去设计用户界面。户界面。本文的目标：本文的目标：三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则p 经验：先入为主影响感知。经验：先入为主影响感知。我们对周围世界的感知不是对其真实的描述。我们感知到的很我们对周围世界的感知不是对其真实的描述。我们感知到的很大程度上是我们期望感
7、知到的。大程度上是我们期望感知到的。3个基本影响因素个基本影响因素三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则p 环境：同样的短语，在不同的句子中，有不同的含义。环境：同样的短语，在不同的句子中，有不同的含义。我们对周围世界的感知不是对其真实的描述。我们感知到的很我们对周围世界的感知不是对其真实的描述。我们感知到的很大程度上是我们期望感知到的。大程度上是我们期望感知到的。3个基本影响因素个基本影响因素三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则p 目标：影响我们注意什么；使我们的感知系统对某些特目标：影响我们注意什么；使我们的感知系统对某
8、些特性敏感性敏感。我们对周围世界的感知不是对其真实的描述。我们感知到的很我们对周围世界的感知不是对其真实的描述。我们感知到的很大程度上是我们期望感知到的。大程度上是我们期望感知到的。3个基本影响因素个基本影响因素三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则p 接近性：物体之间的相对距离会影响我们感知它们是否接近性：物体之间的相对距离会影响我们感知它们是否以及如何组织在一起，相互靠近（相对于其他物体）的以及如何组织在一起，相互靠近（相对于其他物体）的物体看起来属于一组，而那些距离较远的就不是。物体看起来属于一组，而那些距离较远的就不是。我们的视觉系统是如何被优化从而感
9、知结构的我们的视觉系统是如何被优化从而感知结构的格式塔原理。格式塔原理。感知倾向感知倾向视觉系统试图给对象分组的倾向视觉系统试图给对象分组的倾向：三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则p 相似性：如果其他因素相同，那么相似的物体看起来归相似性：如果其他因素相同，那么相似的物体看起来归属于一组。属于一组。我们的视觉系统是如何被优化从而感知结构的我们的视觉系统是如何被优化从而感知结构的格式塔原理。格式塔原理。感知倾向感知倾向视觉系统试图给对象分组的倾向视觉系统试图给对象分组的倾向：三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则p 共同命运
10、：一起运动的物体被感知为属于一组或者说彼共同命运：一起运动的物体被感知为属于一组或者说彼此相关的此相关的。我们的视觉系统是如何被优化从而感知结构的我们的视觉系统是如何被优化从而感知结构的格式塔原理。格式塔原理。感知倾向感知倾向视觉系统试图给对象分组的倾向视觉系统试图给对象分组的倾向：三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则p 连续性：倾向于感知连续的形式而不是离散的形式。连续性：倾向于感知连续的形式而不是离散的形式。感知倾向感知倾向视觉系统试图解析模糊或者填补遗漏来感知整个问题的倾向视觉系统试图解析模糊或者填补遗漏来感知整个问题的倾向：三、三、从认知心理学的角度
11、理解从认知心理学的角度理解UI设计准则设计准则p 封闭性：自动尝试将敞开的图形关闭起来，从而将其感封闭性：自动尝试将敞开的图形关闭起来，从而将其感知为完整的物体而不是分散的碎片。知为完整的物体而不是分散的碎片。感知倾向感知倾向视觉系统试图解析模糊或者填补遗漏来感知整个问题的倾向视觉系统试图解析模糊或者填补遗漏来感知整个问题的倾向：三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则p 对称性：倾向于分解复杂的场景来降低复杂度对称性：倾向于分解复杂的场景来降低复杂度。感知倾向感知倾向视觉系统试图解析模糊或者填补遗漏来感知整个问题的倾向视觉系统试图解析模糊或者填补遗漏来感知整个问题的倾向：三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则p 主体主体/背景：大脑将视觉区域分为主体和背景。背景：大脑将视觉区域分为主体和背景。感知倾向感知倾向视觉系统试图解析模糊或者填补遗漏来感知整个问题的倾向视觉系统试图解析模糊或者填补遗漏来感知整个问题的倾向：三、三、从认知心理学的角度理解从认知心理学的角度理解UI设计准则设计准则我们的视觉系统是如何被优化从而感知结构的格式塔原理。人类感知能力的限制人类感知能力的限制
