多媒体教学软件设计与开发 王志军 教学课件10.pptVIP

* 学习目标 1. 了解人机交互界面设计 2. 掌握设计多媒体教学软件主界面的方法 3. 掌握设计多媒体教学软件子界面的方法 4. 掌握交互界面设计的一般方法 第 10 章 多媒体教学软件交互界面与交互形式设计 10.1.1 交互界面基本概念 第 10 章 多媒体教学软件交互界面与交互形式设计 10.1 人机交互界面概述 1．交互设计 交互设计（Interaction Design）作为一门关注交互体验的新学科于20世纪80年代产生，它由比尔莫格里奇在1984年一次设计会议上提出，并将交互设计命名为“软面（Soft Face）”，后来更名为“Interaction Design”（交互设计）。 2．界面设计 用户界面（UI）的本意是User Interface也就是用户与界面的关系。近年来，由于图形化界面软件的普及，用户对软件界面可操作性以及操作的舒适性等方面提出了更高的要求，友好的人机界面设计已经成为教学软件开发的一个重要组成部分。 10.1.1 交互界面基本概念 第 10 章 多媒体教学软件交互界面与交互形式设计 10.1 人机交互界面概述 3．交互设计与界面设计 交互设计不等同与界面设计。交互设计更加注重教学软件和学习者行为上的交互以及交互的过程，这一过程可以不倚赖于界面（声音指令也是交互）。界面主要指画面的素材组成，结构布局，风格特征等，界面的作用是支撑有效的交互。反之，交互行为是界面设计的约束与参照，当交互设计完成时，就提出了对界面设计的要求。在进行界面设计时需要明确界面是为交互行为服务的，不可以阻碍交互行为。 10.1.2 界面设计的工作流程 第 10 章 多媒体教学软件交互界面与交互形式设计 10.1 人机交互界面概述 1．结构设计（Structure Design） 结构设计也成概念设计 （Conceptual Design），是界面设计的骨架。通过对用户研究和任务分析，制定出产品的整体架构。结构设计类似与教学软件中的界面脚本设计，可以通过基于纸质的设计方案供集体讨论与修改。在结构设计中，需要完成目录体系设计以及逻辑分类和语词定义工作，并力求不在之后的工作中进行修改。 10.1.2 界面设计的工作流程 第 10 章 多媒体教学软件交互界面与交互形式设计 10.1 人机交互界面概述 2．交互设计（Interactive Design） 交互设计的基本原则如下： ● 有清楚的错误提示。 ● 让用户用尽可能少的操作控制界面，需要同时在画面上出现多个层次的目录结构。 ● 为同一种交互提供多种操作可能性。 ● 允许中断。 ● 使用学习者易懂的文字与图示，避免技术术语。 ● 提高交互反馈速度，避免学习者等待。 10.1.2 界面设计的工作流程 第 10 章 多媒体教学软件交互界面与交互形式设计 10.1 人机交互界面概述 ● 方便退出。 ● 灵活实用的导航功能，既可让用户知道自己当前的位置，又方便其自由跳转。 3．视觉设计(Visual Design) 原则概括如下： （1）界面清晰简约 ● 在技术允许的情况下可让用户选择或定制界面。 ● 完善视觉的清晰度。图片、文字的布局和隐喻不要让用户去猜。 10.1.2 界面设计的工作流程 第 10 章 多媒体教学软件交互界面与交互形式设计 10.1 人机交互界面概述 （2）使用图形化设计 ● 提供图形符号，尽量减少文字交互提示。 ● 图形符号的使用尽量符合日常生活的习惯。 ● 同样功能用同样的图形。 （3）界面协调一致 ● 界面布局设计的协调一致（如退出按钮的位置设计等）。 ● 色彩与内容。整体软件不超过5个色系，近似的颜色表示近似的意思。 10.1.3 教学软件交互界面设计原则 第 10 章 多媒体教学软件交互界面与交互形式设计 10.1 人机交互界面概述 1．操作简便 （1）安装运行简便 （2）菜单简明合理 （3）内容简洁明了 （4）提供帮助信息 2．布局合理前后一致 （1）恰当布置，主体突出 （2）重点集中，视点明确 （3）美观大方，前后一致 10.1.3 教学软件交互界面设计原则 第 10 章 多媒体教学软件交互界面与交互形式设计 10.1 人机交互界面概述 3．色彩搭配协调 （1）需要表现对比的颜色搭配 （2）需要表现调和的颜色搭配 （3）使用配色技巧 4．界面组接流畅 （1）界面切换自然 （2）增加画面间的过渡 （3）界面间的组接设计应遵循学习规律 10.2.1 教学软件界面结构设计特点 第 10 章 多媒体教