人机交互的软件工程方法实验指导书-图文(精)

1、人机交互的软件工程方法实验指导书人机交互的软件工程方法课程是计算机专业的一门选修课程。人机交互的软件工程方法的应用领域越来越广泛,对人机交互的软件工程方法课程的教学提出了更高的要求。开设人机交互的软件工程方法实验,目的就是为了学生能够更好的掌握人机交互的软件工程方法的应用,使课堂教学与实践环节紧密结合。希望学生能够充分利用实验条件,认真完成实验,从实验中得到应有的锻炼和培养,为今后进一步学习和应用人机交互的软件工程方法打下坚实的基础。人机交互软件工程方法课程实验的目的:是为了使学生在课程学习的同时,通过实验教学验证课堂教学的理论,理解和掌握人机交互的软件工程方法中最基本、最广泛应用的概念、原理

2、、理论和算法以及基本技术和方法,更好地掌握人机交互的软件工程方法课程教学大纲要求的内容。人机交互软件工程方法课程实验的注意事项:在人机交互的软件工程方法的课程实验过程中,要求学生做到:(1预习实验指导书有关部分,认真做好实验内容的准备,就实验可能出现的情况提前作出思考和分析。(2认真书写实验报告。实验报告包括实验目的和要求,程序设计说明,给出源程序清单。(3遵守机房纪律,服从辅导教师指挥,爱护实验设备。(4实验课程不迟到。如有事不能出席,所缺实验一般不补。人机交互的软件工程方法课程实验的验收:实验的验收将分为两个部分。第一部分是上机操作,包括检查程序运行和即时提问。第二部分是提交书面的实验报告

3、。实验一命令行和文本菜单一、实验目的和要求掌握命令行和文本菜单界面的设计二、实验内容和原理a设计一个命令行界面的游戏，登入游戏界面后，应该有游戏规则说明，按键说明。b进入游戏前应该有难度选择：1表示简单、2表示中等、3表示困难。c在游戏主界面中有可以循环输入数独值、可以连续玩好几局直到退出、检查结果、查看答案、新开一局的功能。d信息提示功能：输入错误时应有提示、游戏失败或获取胜利时应有庆祝界面等。三、实验演示3.1登入游戏界面你会看到有四个选项:a、b、c、e;图3. (1对于图3丄如果你按“b”，则会出现如图3.2;图3.2(2对于图3.1,如果你按,七”,则会出现如图3.3;图3. (3对

4、于图3.1,如果你按“e”,则退出游戏；(4对于图3.1,如果你按“a”,则出现游戏难度选择界面，如图3.4。3.2游戏难度选择图3.4(1对于图，如果你按“0”，则返回上一级目录，出现图3.1;(2如果你按13，则进入游戏主界面，如图3.5。按T”时,数独有20个空格，按“2”时,数独有40个空格，按“3”时,数独有60个空格。3.3进入游戏主界面图3. (1对于图3.5，如果按“a”,这开始输入要填数字的横纵坐标和其值,如果输入错误即所输入的横纵坐标不在19范围中，这会有“输入错误，请重新输入”的提示，如图3.6;如果输入的位置原题中就有数字则会有“对不起，原题中该位置已经指定为%,你不能

5、修改这个值”的提示，如图3.7;图3.7(2对于图3.5，如果按“b”，则检查结果，如果获胜则出现图3.8,如果结果不正确，则出现图3.9;图3.8图3.9(3对于图3.5,如果按,七”,则输出数独答案，如果只有一个解会出现图3.10,如果有多个解则出现图33;图3.10(4对于图3.5，如果按“d”，则新开一局，返回到图3.5,循环游戏；(5对于图3.5,如果按“e”,则返回上一级菜单，即图3.4四、实验演示在这数独游戏设计中，让我学会怎样把所想所思用代码来实现，它不仅锻炼了我的思维，增加了我逻辑紧密性,提高了我自学的能力。使我在巩固C+基础上，深刻了解了面向对象思想，而且也使我知道了光靠书

6、本上的知识是远远不够的。因为“山外有山，人外有人”呀!大学，大部分就是要靠自学呀!还有很多知识，等着青春勃发的我们去汲取呢！还有一点就是人机交互的用户界面应该具备可用性、灵活性、复杂性、可靠性,设计用户界面应该尽量置用户于控制之下、减少用户的记忆负担、保持界面一致。实验二图形用户界面的设计一实验目的和要求熟悉图形用户界面的设计原则利用一种设计工具完成图形化的用户界面设计二预备知识图形用户界面又称为WIMP界面，由窗口（windows、图标（icons、菜单（menu、指点设备（pointingdevice四位一体，形成桌面（desktop，如图所示。WIMP界面用户手眼击键/指点窗口、图标菜单

7、、文本应用例程图形用户界面是当前用户界面的主流，广泛应用于各档台式微机和图形工作站。图形用户界面的共同特点是以窗口管理系统为核心，使用键盘和鼠标器作为输入设备。窗口管理系统除了基于可重叠多窗口管理技术外，广泛采用的另一核心技术是事件驱动（event-driven技术。WIMP界面可看作是第二代人机界面,是基于图形方式的人机界面。在WIMP界面中,人被称为用户,人机通过对话进行工作。用户只能使用手这一种交互通道输入信息，通过视觉通道获取信息。在WIMP界面中，界面的输出可以为静态或动态的二维图形或图像等信息。这种方式能同时输出不同种类的信息，用户也可以在几个工作环境中切换而不丢失几个工作之间的联

8、系，通过菜单可以执行控制型和对话型任务。由于引入了图标、按钮和滚动条技术，大大减少键盘输入，提高了交互效率。基于鼠标和图形用户界面的交互技术极大地推动了计算机技术的普及。(1图形用户界面的三个重要思想桌面隐喻(desktopmetaphor指在用户界面中用人们熟悉的桌面上的图例清楚地表示计算机可以处理的能力。隐喻的表现方法:静态图标、动画、视频所见即所得(WhatYouSeeIsWhatYouGet,WYSIWYG显示的用户交互行为与应用程序最终产生的结果是一致的。直接操纵(directmanipulation直接操纵是指可以把操作的对象、属性、关系显式地表示出来,用光笔、鼠标、触摸屏或数据手

9、套等指点设备直接从屏幕上获取形象化命令与数据的过程。直接操纵的对象是命令、数据或是对数据的某种操作。(2设计图形用户界面的原则1一般性原则:界面要具有一致性、常用操作要有快捷方式、提供简单的错误处理、对操作人员的重要操作要有信息反馈、操作可逆、设计良好的联机帮助、合理划分并高效地使用显示屏、保证信息显示方式与数据输入方式的协调一致2颜色的使用:颜色是一种有效的强化手段,同时具有美学价值。使用颜色时应注意如下几点:限制同时显示的颜色数;画面中活动对象的颜色应鲜明,而非活动对象应暗淡;尽量避免不相容的颜色放在一起,如黄与蓝,红与绿等,除非作对比时用;若用颜色表示某种信息或对象属性,要使用户理解这种

10、表示,并尽量采用通用的表示规则。3图标的设计:图标是可视地表示实体信息的简洁、抽象的符号。图标设计是方寸艺术,需要在很小的范围内表现出图标的内涵。设计图标时应该着重考虑视觉冲击力,要使用简单的颜色,利用眼睛对色彩和网点的空间混合效果,做出精彩图标。按钮的设计:设计按钮应该具有交互性,应该有3到6种状态效果(点击时的状态、鼠标放在上面但未点击的状态、点击前鼠标未放在上面时的状态、点击后鼠标未放在上面时的状态、不能点击时的状态、独立自动变化的状态,按钮应具备简洁的图示效果,应能够让使用者产生功能上的关联反应。属于一个群组的按钮应该风格统一,功能差异大的按钮应该有所区别。5屏幕布局的设计:设计屏幕布

11、局(Layout时应该使各功能区重点突出，应遵循如下几条原则:平衡原则、预期原则、经济原则、顺序原则、规则化6菜单界面的设计:菜单在图形界面的应用程序中使用得非常普遍，是软件界面设计的一个重要组成方面，描述了一个软件的大致功能和风格。菜单中的选项在功能上与按钮相当，一般具有下列一种或几种类型的选项:命令项、菜单项和窗口项。菜单的结构一般有单一菜单、线状序列菜单、树状结构菜单、网状结构菜单等，其中树状结构菜单是最常见的结构。设计菜单界面时应注意的一般性原则:功能组织菜单，合理分类，并力求简短，前后一致;合理组织菜单界面的结构与层次;按一定的规则对菜单项进行排序;菜单选项的标题要力求文字简短、含义

12、明确，并且最好以关键词开始;常用选项要设置快捷键;充分利用菜单选项的使能与禁止、可见与隐藏属性;使用弹出式菜单。7填表输入界面的设计:在处理大量相关数据的场合下,需要输入一系列的数据,这时填表输入界面是最理想的数据输入界面。在设计填表输入界面时应遵循的原则:一致性;有含义的表格标题;使用易于理解的指导性说明文字;栏目按逻辑分组排序;表格的组织结构和用户任务相一致;光标移动方便;出错提示;提供帮助;表格显示应美观、清楚,避免过分拥挤。三实验内容与步骤（一实验内容:利用常用的设计工具（VC/VB/Delphi/PB等完成一个通用图形用户界面设计，要遵循界面设计的一般原则（一致性、快捷方式、提供错误

13、处理,注意颜色的使用,学会使用图标、按钮、屏幕布局、菜单和对话框的设计（二实验步骤设计多个对话框，完成填表输入界面的设计，合理使用图标、按钮、颜色;设计不同形式的菜单，完成对不同对话框的调用;提供简单的错误处理、联机帮助实验三Web界面设计实验目的和要求1熟悉Web站点的信息交互模型和结构2熟悉Web界面设计的基本思想和原则掌握Web界面设计的工具和技术二预备知识Web界面设计是人机交互界面设计的一个延伸,是人与计算机交互的演变。Web界面设计与站点外观直接相关，站点的界面外观是否友好直接关系到是否能吸引人的关注。人性化的设计是Web界面设计的核心，如何根据人的心理、生理特征,运用技术手段，创

14、造简单、友好的界面，是Web界面设计的重点。(1Web信息交互模型用来解释Web的人机界面性质的一个模型，它提出网页是用户和知识之间的界面。对于信息提供者来说包括信息的表达，对于使用者来说则是信息的获取。信息的表达与获取分别受到两者认知结构的制约。模型涉及到信息的三种类型数据:当一条信息被反复、简单的提供时称为数据，比如机票价格。复杂信息:而用来叙述事件时称为复杂信息，如多媒体信息。3过程性信息:在信息有明确目标，并相互作用时称为过程性信息，如在线练习、在线测试等。模型涉及到信息的两种特性:1动态性:信息在不断的变化，具有动态性;2一致性:信息元素的组织方式具有一致性(2Web信息设计模型是解

15、释Web人机界面性质的另一个模型，是一种研究网页的信息设计模型。设计模型中要考虑到信息的两个方面:1第一是应该呈现或略去什么信息。2第二个方面指的是信息该如何被表现(3Web界面设计基本原则1了解浏览者的心理状态2内容与形式的统一3减少浏览层次特点明确统一整体的形象6Web界面设计的3C原则(4Web界面概要设计1Web界面框架设计:Web网站规划、建立原型系统、详细设计、正式实施2Web界面的内容与风格的设计:网站内容设计的原则、Web界面的风格3Web界面设计的语言与文化:网站应设置多语言选择，在网站设计和建设中进行跨文化研究(5Web界面设计要素Web界面布局Web界面的色彩Web界面的

16、字体Web界面的动画与多媒体Web界面的导航(6Web界面设计技术与工具要设计好的Web界面，需要有良好的设计工具，随着Internet网络的发展,国际组织和许多互联网软件开发商制订了若干标准,开发了不同的Web界面设计工具。主要的技术包括超文本标记语言HTML、客户端脚本语言JavaScript、JavaApplet、服务器端脚本语言。页面编辑器主要包括:lMicroSoft公司的Frontpage;2Macromedia公司的Dreamweaver,Dreamweaver对于动态网页的支持特别好，可以轻而易举地做出很多眩目的互动页面特效Dreamweaver与Flash、Firework并

17、称为Macromedia的网页制作三剑客。辅助工具主要包括:1AceHTMLPro6.0全功能的HTML&JavaScript编辑器;2AntennaWebDesignStudio一强大的可视化网页设计软件;3EasyHTML一简单的所见即所得的HTML编辑器，有固定、类似浏览器的界面;4EasyWebEditor是个Web发布工具，允许不了解HTML而在所见即所得环境中编辑Web网页。三实验内容与步骤（实验内容:要求根据Web界面设计的原则（简洁、一致性、对比度，进行Web界面规划、概要设计和设计要素的选择，利用一种界面设计工具（Dreamweaver/Frontpage完成网页设计。（二实

18、验步骤:1选择一种界面设计工具，并熟悉它;2针对一个具体的网站（学校、个人、公司设计应用，进行Web界面规划和概要设计;3选择WEB界面设计要素，设计出网页四实验结果1数据库中信息news_user表news表2打开浏览器，在浏览器中输入出现3单击滚动区域内的信息，跳出过了4秒出现单击“登录”f出现5单击“注册”f输入信息，但是不输入用户名f输入用户名，但是不输入密码f输入用户名，但是两次密码输入不一样f输入已经注册过的用户名，并且两次输入的密码一样纟吉果:输入合理的用户名,并且两次输入的密码都一样纟吉果:过了3秒钟出现6用同样的方法注册一个普通用户，数据库中添加的用户记录如下7.登录页面f输

19、入不存在的用户名结果过了4秒后，有出现登录界面f输入存在的用户名和错误的密码结果过了4秒出现登录界面f输入正确的用户名和密码结果8系统主界面-使用普通用户登录f使用管理员身份登录9以管理员身份登录，新闻添加页面此时数据库中新闻表中内容，如下f单击“添加新闻出现:f若没有输入摘要f若没有输入具体内容f若没有输入标题f输入已经存在的新闻标题，进行插入单击“提交”出现重新输入标题出现5秒过后，出现此时查看,新闻表10单击“新闻查询”f在标题上输入“地”，新闻摘要不输入内容,单击“查询”纟吉果:f在新闻摘要上输入日本，标题上不输入内容结果f在标题上输入“地”，并且在新闻摘要上输入“日本”纟吉果:f什么

20、都不输入，直接单击“查询”结果:显示了所有新闻结果:单击“返回”结果:删除前，数据表中信息删除后13.选一条新闻，单击“更新新闻”出现f如果新闻摘要为空f如果具体内容更为空输入合理的摘要和内容出现5秒后出现单击“查看具体详情”五总结实验四多通道用户界面实验目的和要求1了解常见的多通道用户界面2查找资料，熟悉一种多通道用户界面并写出综述二预备知识为适应目前和未来的计算机系统要求，人机界面应能支持时变媒体，实现三维、非精确及隐含的人机交互，而多通道人机界面是达到这一目的的重要途径。80年代后期以来，多通道用户界面成为人机交互的软件工程方法研究的崭新领域，在国内外受到高度重视。综合采用视线、语音、手

21、势等新的交互通道、设备和交互技术，使用户利用多个通道以自然、并行、协作的方式进行人机对话，通过整合来自多个通道的、精确的和不精确的输入来捕捉用户的交互意图，提高人机交互的自然性和高效性。MMI击键/指点手用嘴语音眼神通道整应用例程合户眼手2D/3D多媒体信息多通道用户界面主要关注人机界面中用户向计算机输入信息以及计算机对用户意图的理解，所要达到的目标可归纳为如下方面：1交互的自然性使用户尽可能多地利用已有的日常技能与计算机交互，降低认识负荷。2交互的高效性使人机通讯信息交换吞吐量更大、形式更丰富，发挥人机彼此不同的认知潜力。3与传统的用户界面特别是广泛流行的WIMP/GUI兼容。(1多通道用户

22、界面的基本特点1使用多个感觉和效应通道2允许非精确的交互3三维和直接操纵4交互的双向性5交互的隐含性(2涉及的主要技术1多媒体使用多种表示媒体，如文本、图形、图像和声音，使人机交互的软件工程方法最终要向着更接近于人的自然方式发展，使计算机具有听觉和视觉，以更自然的方式与人交互。多媒体技术引入了动画、音频、视频等动态媒体，大大丰富了计算机表现信息的形式，拓宽了计算机输出的带宽，提高了用户接受信息的效率，使人们可以得到更直观的信息，从而简化了用户的操作，扩展了应用范围。2虚拟现实又称虚拟环境，虚拟现实系统向用户提供沉浸和多感觉通道体验。在虚拟现实中，人是主动参与者，复杂系统中可能有许多参与者共同在以计算机网络系统为基础的虚拟环境中协同工作。虚拟现实系统具有三个重要特点：沉浸感、交互性、构想性。3眼动跟踪与视觉有关的人机交互自始至终都离不开视线的控制。如果能通过用户的视线盯着感兴趣的目标，计算机便“自动”将光标置于其上，人机交互将更为直接，也省去了上述交互过程中的大部分步骤。4手势识别一个简单的手势蕴涵着丰富的信息，人与人可以通过手势传达大量的信息，实现高速的通信。将手势运用于计算机能够很好地改善人机交互的效率。在多数情况下我们笼统地认为手势是人的上肢(包括手臂、手和手指的运动状态。5三维输入许多应用(如虚拟现实系统需要三维空间定位技术，三维空间控制器的共同特点是具有