人机交互设计课件

给人快乐或者挑战就是交互的目的
19
产品交互设计
第1章 概述 艺术与交互
2 交互设计的设计本质
艺术与交互
交互艺术、工业设计、交互设计
拥有同一目标：
为用户设计产品或者体验
拥有同样的工具以及工作流程：
草图
模型
最终成品的展示
20
产品交互设计
第1章 概述
3 交互设计中的系统观
交互：两个或两个以上活动的参与者之间的信息交流。 交互设计的目的
系统表示模型
设计师最重要的工作是: 为系统建立一个面向用户的表现模
用户心智模型
产品系统在用户心目中的运作机制 ，通常是用户对系统的一种简化的 、类比的理解和想象
型，将系统的功能通过形式语言诚 实地展现给用户。
应尽可能容易理解和记 忆
10
产品交互设计
第1章 概述 计算机成为设计的对象
1 交互设计的缘起
与系统发生交互的人
系统做出修改，并明白对某个部分的修改可能影响到 系统的另一个部分。 最复杂的交互模式——完美的交谈
21
产品交互设计
第1章 概述
4 交互设计的基本目标
避免误解产生
创建交互应用最困难的任务之一是去理解系统怎样看待
品牌
来自用户的信息以及用户怎样看待系统提供的信息。
交互信息越丰富，越容易报错
产品交互设计
11
产品交互设计
第1章 概述 计算机成为设计的对象
1 交互设计的缘起
交互的语汇
采用二进制数值的直接输入和输 出的世界首台计算机Altair-8800 。 拥有位图显示器 、 Windows 、 鼠标的Xerox Alto计算机，首次 使用了窗口设计被认为是操作系 统GUI界面发展史上的里程碑。
交互设计 所 追求 的是 易用性 ，以及 技术上的可能性、合理性。 交互设计的策略之一
人机交互设计
Human-Computer Interaction Techniques
目录
CONTENTS
1
2 3 4
人机交互 —— 概念 人机交互 —— 发展 人机交互 —— 生活 人机交互 —— 展望
目录
人机交互设计
第1章 概念
概述

概念
人机交互技术（Human-Computer Interaction Techniques）是指通过计算机输入、输 出设备，以有效的方式实现人与计算机对话的技术。
1
人机交互设计
第1章 概念
起源
1st 2nd
交互设计的缘起 交互设计的设计本质 交互设计中的系统观 交互设计的基本目标 交互设计的意义与流程 交互形式：追求自然的交互 对交互设计有较大影响的学者
3rd
4th 5th 6th 7th
2
产品交互设计
第1章 概述
什么是交互设计？
交互设计
交互性不只是技术系统，还有
互动装置常常还会包含媒介间的转换，现实物体
变成虚拟物体，或者反过来虚拟变成现实
理论，利用网络低廉快速的平台，倡导网络实名制，将现
实生活中的人脉关系建立在网络平台之上，使得人与人之 间的交流沟通更加便利。 • 基于用户位置信息的互动是一种用户之间合作的互动应用 程序，这类系统中相互作用趋于方便沟通，并确保从一个 用户发出的信息能被另一位用户接受。
吉利恩:
如果让我用一句话来概括交互设计的话,我认为交互设 计是通过数码产品改变着我们的工作,生活以及娱乐的 一种有效手段。
5
产品交互设计
第1章 概述 计算机成为设计的对象
1 交互设计的缘起
计算机
计算机软硬件复杂性 程序员及普通 软件缺少人性化 用户认识差异
软件未经过设计
可靠
程序不能有影响其功能的错误
产品作为一个object看待
交互设计
产品看作一个事件event 面向行为和过程， 强调过程性思考的能力 流程图、状态转换图、故事板 等成为重要设计表现手段
交互设计
人机界面 技术
认知心理学
传感技术
静态造型和材料
HCI研究
效果图作为设计表现手段
18
产品交互设计
第1章 概述 交互设计与工业设计
2 交互设计的设计本质
窗口边框和按钮外观、字体等
用来调用命令的机制
组件三：用户概念模型
用户想要的内容及用户会如何响应
7
产品交互设计
第1章 概述 计算机成为设计的对象
1 交互设计的缘起
从使用者认知的角度改善易用性的早期成功尝试——Star系统 (首次在界面设计中使用图形比拟）
组件一：信息的显示
图形用户界面
组件二：控制 （命令机制）
，交互界面的设 计问题受到重视
• Apple 的 Lisa 奠 定 了 以
窗 口 (Windows) 、
菜 单 (Menu) 、 图 符 (Icons) 和 指 示 装 置 (Pointing Devices)为 基础的 图形用户界面 ，也称 WIMP 界面的基 本形态
• ARPAnet走向世界
• 1973年首台基于 图形界面的电脑 Xerox Alto推出 • Bill Maggridge 设计出第一台笔 记本电脑“Grid Compass”
组件三：用户概念模型
其他所有一切，都要服从于使这种概念 模型整体、清晰、明确和充实的目标。
8
产品交互设计
第1章 概述 计算机成为设计的对象
1 交互设计的缘起
从使用者认知的角度改善易用性的早期成功尝试——Star系统 (首次在界面设计中使用图形比拟）
组件一：信息的显示
图形用户界面
组件二：控制 （命令机制）
构思数据和与数据的交互时，必须考虑:
工作的效率
操作系统的桌面模拟允许使用者按照一种符合其自然认知 能力和生活中熟悉的主题环境来开展工作。
• 需要呈现的是什么数据
• 用户会如何诠释这些数据 • 用户会想对数据做什么 • 用户想如何与数据互动
小屏幕或无屏幕的界面交互应用往往趋向于关注实用性
和功能性，使用户能够更有效率地完成任务、组织信息和 保存信息。
非线性叙事
用交互的方式来播放电影、讲述一个故事或者一段 历史的概念。
用户可以通过从数据可视化或游戏中学来的方法控
制叙事的流程和方向。
17
产品交互设计
第1章 概述
2 交互设计的设计本质
交互设计属于设计学发展中的一个分支，是多个学科的交叉。
设计的思维
设计的思维
设计理论
计算机 技术
可用性测试 研究
传统设计
塞缪尔·莫兰德（ Samuel Morland）发明 了可以计算加数 及减数的一部机
技术人员将计算过 程分解，穿孔纸带
输入编码
• INTEL推出8008微 处理器
• C语言开发完成
• 米兹（mits）公 推出了世界上第
一台个人计算机 Altair-8800
• Xerox Alto商用 版本star开发中
16
产品交互设计
第1章 概述 计算机成为一种媒介材料
1 交互设计的缘起
交互设计的常见话题
控制物理世界
通过各种传感器、制动器，设计师可以把物理世界中所有的 东西植入计算机，使之有感知和有反馈。 • Home Automation 在一个房间里安装各种复杂的传感器和系统，在一个空间 内跟踪记录各种变化，还可以使用这些数据来更全面地控制 这个环境，使之更加舒适，使环境配置正确。 • 感应性建筑（reactive architecture） 通过建筑方面的实践与计算机技术的结合来达到房屋和环 境能够对用户、环境因素和外部命令做出反应。
设计某种让人能够以有意义 的方式与之互动的系统
反馈循环： 系统自我反馈
自我调节
反应式交互 研究用户会对系统做什么和系统会作出什么反应。
交互设计 对象
信息交流
用户
更复杂的交互模式 系统不停地执行任务，同时用户输入命令调整任务。 • 难点 用户需要每时每刻都了解系统如何运作，了解如何对
有感知和反馈的物体系统
当用户与系统交互时，把他们试图做什 么与他们更熟悉的其他东西关联起来。
12
产品交互设计
第1章 概述 计算机成为一种媒介材料
1 交互设计的缘起
无处不在的交互 数字逻辑触发器 智能手机ARM芯片 微控制器
MP3播放器
游戏设备 汽车导航系统 物联网冰箱
……
塑造日常消费电子产品的形状和使用方式
Biblioteka Baidu
交互设计是信息时代的工业设计。
交互的语汇
使用双方能理解的语汇系统：
程序员
面向机器（系统模型）的语言 • 二进制机器语言 • 汇编语言指令集合 • C语言 • 可视化、图形化编程
程序的结构越来越面向人 的思维和现实世界问题
普通用户
Important
用户明白自己能执行什么动作，且系
统能够以同样的方式明白并按照其所
期待的来执行这些动作。
好的软件
实用
程序应该满足所期望的实用要求
愉悦
使用程序的体验应该是愉快的
6
产品交互设计
第1章 概述 计算机成为设计的对象
1 交互设计的缘起
从用户认知角度 改善易用性的早期成功尝试——Star系统 (首次在界面设计中使用图形比拟）
组件一：信息的显示
处理要在屏幕上显示的内容
图形用户界面
组件二：控制 （命令机制）
Important
设计一致的命令调用（针对跨不 同语言的程序）
组件三：用户概念模型
Important
使用户能够把这种抽象的东西与 自己的工作关联起来
9
产品交互设计
第1章 概述 计算机成为设计的对象
1 交互设计的缘起
表现模型
产品模型
系统实现模型
即实现模型，是机器和程序实际如 何工作的原理和细节，描述了程序 和机器中功能实现、实际的工作机 制。
交互设计与工业设计
工业设计师还能设计独立于
产品信息化
软件使用体验的硬件产品？! 设计师技能 ：
外形的设计
一些概念进行全新定义
• 新产品类型 • 预想人们如何使用
交互的设计涉及 很多建模过程
• 系统怎样正常工作
• 用户将如何接近其目标
• 如何配置界面
……
设计师确保交互过程简单直接，使一切用户所期 望的，通过清晰明确的方式尽快地传达给他/她 。
15
产品交互设计
第1章 概述 计算机成为一种媒介材料
1 交互设计的缘起
交互设计的常见话题
创造体验
创造体验的价值是交互设计更普遍的目标 通常使用新颖的方式连接听觉和视觉刺激，来 创造娱乐用户的场面或者带有娱乐性的交互
人与人之间的交流
设计师不仅需要设计人与物之间的交互，也要学习设计人与人
交流的新方式。 • 根据美国社会心理学家Stanley Milgram提出的六度分割
在普适计算和物联理论的基础上，交互已经变得无处不在。
13
产品交互设计
第1章 概述 计算机成为一种媒介材料
1 交互设计的缘起
好的交互设计
设计体验
交互设计逐渐发展成为一种理念，那就是将信
理解人类的行为和需求
息和通讯技术看成一种新的艺术媒介。
从 人的需求出发，分析发掘潜在的 用户需求 和
了解环境、活动、 人们的注意力及目标
非电子类 产品
维基百科 : 交互设计定义 两个 或多个 互动的个体之间交流的内容和结构，
人
使之相互配合，共同达成某种目的。
服务
组织
以“在充满社会复杂性
的物质世界中嵌入信息 技术”为中心
使用的 产品
接受的 服务
3
产品交互设计
第1章 概述
1 交互设计的缘起
交互设计起源于计算机的人机界面设计
1666年 上个世纪70年代 1972年 1973年 1975年 1981年 1983年
技术的成熟性、经济性之间的最佳匹配点。为
开发指明方向，基于技术的潜能，设想和实验新
的生活样式，提供更好的用户体验。
适应使用环境、
个人特征、生活规律
尝试超越现有需求， 满足潜在需要
14
产品交互设计
第1章 概述 计算机成为一种媒介材料
1 交互设计的缘起
交互设计的常见话题
数据的可视化
图形、图像使用户更好地理解数据。
械计数机
ARPA：美国高级研究计划署（阿帕，Advanced Research Project Agency）的简称
4
产品交互设计
第1章 概述 计算机成为设计的对象
1 交互设计的缘起
1984年, Bill Maggridge在一次会议中提出交互设计的概念 开始只是想着将软件与用户界面设计的结合，称为 “soft face”（软面） 1990年更名为“Interaction Design”(交互设计)。
趣味性 完整的 用户体验 愉悦
为了更好的体验 避免交互过程中的误解，重点在于产品界面和文档的
易学习性、易用性、满意度等方面。
帕特里克·乔丹(Patrick Jordan) 形容从功能性到愉悦 的进步与马斯洛（Maslow）的人类需求层次相类似 ，在低层需求满足以后人们就去追求更高层次的需求 。
审美
22
人机交互技术包括机器通过输出或显示设备给人提供大量有关信息及提示请示等，人 通过输入设备给机器输入有关信息，回答问题及提示请示等。人机交互技术是计算机用户 界面设计中的重要内容之。它与认知学、人机工程学、心理学等学科领域有密切的联系。 也指通过电极将神经信号与电子信号互相联系，达到人脑与电脑互相沟通的技术，可 以预见，电脑甚至可以在未来成为一种媒介，达到人脑与人脑意识之间的交流，即心灵感 应。