1、人机交互软件工程方法 试验指导书人机交互软件工程方法课程是计算机专业一门选修课程。人机交互软件工程方法应用领域越来越广泛,对人机交互软件工程方法课程教学提出了更高要求。开设人机交互软件工程方法试验,目标就是为了学生能够愈加好掌握人机交互软件工程方法应用,使课堂教学和实践步骤紧密结合。期望学生能够充足利用试验条件,认真完成试验,从试验中得到应有锻炼和培养,为以后深入学习和应用人机交互软件工程方法打下坚实基础。人机交互软件工程方法课程试验目标:是为了使学生在课程学习同时,经过试验教学验证课堂教学理论,了解和掌握人机交互软件工程方法中最基础、最广泛应用概念、原理、理论和算法和基础技术和方法,愈加好地
2、掌握人机交互软件工程方法课程教学纲领要求内容。人机交互软件工程方法课程试验注意事项:在人机交互软件工程方法课程试验过程中,要求学生做到:(1) 预习试验指导书相关部分,认真做好试验内容准备,就试验可能出现情况提前作出思索和分析。(2) 认真书写试验汇报。试验汇报包含试验目标和要求,程序设计说明,给出源程序清单。(3) 遵守机房纪律,服从教导老师指挥,珍惜试验设备。(4) 试验课程不迟到。如有事不能出席,所缺试验通常不补。人机交互软件工程方法课程试验验收:试验验收将分为两个部分。第一部分是上机操作,包含检验程序运行和即时提问。第二部分是提交书面试验汇报。试验一 命令行和文本菜单一、 试验目标和要
3、求掌握命令行和文本菜单界面设计二、 试验内容和原理a) 设计一个命令行界面游戏,登入游戏界面后,应该有游戏规则说明,按键说明。b) 进入游戏前应该有难度选择:1表示简单、2表示中等、3表示困难。c) 在游戏主界面中有能够循环输入数独值、能够连续玩好几局直到退出、检验结果、查看答案、新开一局功效。d) 信息提醒功效:输入错误时应有提醒、游戏失败或获取胜利时应有庆贺界面等。三、 试验演示3.1登入游戏界面你会看到有四个选项:a、b、c、e;图3.1(1) 对于图3.1,假如你按“b”,则会出现图3.2;图3.2(2) 对于图3.1,假如你按“c”,则会出现图3.3;图3.3(3) 对于图3.1,假
4、如你按“e”,则退出游戏;(4)对于图3.1,假如你按“a”,则出现游戏难度选择界面,图3.4。3.2游戏难度选择图3.4(1)对于图,假如你按“0”,则返回上一级目录,出现图3.1 ;(2)假如你按13,则进入游戏主界面,图3.5。按“1”时,数独有20个空格,按“2”时,数独有40个空格,按“3”时,数独有60个空格。3.3进入游戏主界面图 3.5(1)对于图3.5,假如按“a”,这开始输入要填数字横纵坐标和其值,假如输入错误即所输入横纵坐标不在19范围中,这会有“输入错误,请重新输入”提醒,图3.6;假如输入位置原题中就有数字则会有“对不起,原题中该位置已经指定为%,你不能修改这个值”提
5、醒,图3.7;图3.6图3.7(2)对于图3.5,假如按“b”,则检验结果,假如获胜则出现图3.8,假如结果不正确,则出现图3.9; 图3.8 图3.9(3)对于图3.5,假如按“c”,则输出数独答案,假如只有一个解会出现图3.10,假如有多个解则出现图3.3.;图3.10(4)对于图3.5,假如按“d”,则新开一局,返回到图3.5,循周游戏;(5)对于图3.5,假如按“e”,则返回上一级菜单,即图3.4四、 试验演示在这数独游戏设计中,让我学会怎样把所想所思用代码来实现,它不仅锻炼了我思维,增加了我逻辑紧密性,提升了我自学能力。使我在巩固C+基础上,深刻了解了面向对象思想,而且也使我知道了光
6、靠书本上知识是远远不够。因为“山外有山,人外有些人”呀!大学,大部分就是要靠自学呀!还有很多知识,等着青春勃发我们去汲取呢!还有一点就是人机交互用户界面应该含有可用性、灵活性、复杂性、可靠性,设计用户界面应该尽可能置用户于控制之下、降低用户记忆负担、保持界面一致。试验二 图形用户界面设计一 试验目标和要求1) 熟悉图形用户界面设计标准2) 利用一个设计工具完成图形化用户界面设计二 预备知识图形用户界面又称为WIMP界面,由窗口(windows)、图标(icons)、菜单(menu)、指点设备(pointing device)四位一体,形成桌面(desktop) ,图所表示。图形用户界面是目前用
7、户界面主流,广泛应用于各档台式微机和图形工作站。图形用户界面共同特点是以窗口管理系统为关键,使用键盘和鼠标器作为输入设备。窗口管理系统除了基于可重合多窗口管理技术外,广泛采取另一关键技术是事件驱动(event-driven)技术。 WIMP界面可看作是第二代人机界面,是基于图形方法人机界面。在WIMP界面中,人被称为用户,人机经过对话进行工作。用户只能使用手这一个交互通道输入信息,经过视觉通道获取信息。在WIMP界面中,界面输出能够为静态或动态二维图形或图像等信息。这种方法能同时输出不一样种类信息,用户也能够在多个工作环境中切换而不丢失多个工作之间联络,经过菜单能够实施控制型和对话型任务。因为
8、引入了图标、按钮和滚动条技术,大大降低键盘输入,提升了交互效率。基于鼠标和图形用户界面交互技术极大地推进了计算机技术普及。 (1)图形用户界面三个关键思想1) 桌面隐喻(desktop metaphor)指在用户界面中用大家熟悉桌面上图例清楚地表示计算机能够处理能力。 隐喻表现方法:静态图标、动画、视频 2) 所见即所得(What You See Is What You Get,WYSIWYG) 显示用户交互行为和应用程序最终产生结果是一致。 3) 直接操纵(direct manipulation) 直接操纵是指能够把操作对象、属性、关系显式地表示出来,用光笔、鼠标、触摸屏或数据手套等指点设备
9、直接从屏幕上获取形象化命令和数据过程。直接操纵对象是命令、数据或是对数据某种操作。 (2)设计图形用户界面标准 1) 通常性标准:界面要含有一致性、常见操作要有快捷方法、提供简单错误处理、对操作人员关键操作要有信息反馈、操作可逆、设计良好联机帮助、合理划分并高效地使用显示器、确保信息显示方法和数据输入方法协调一致2) 颜色使用:颜色是一个有效强化手段,同时含有美学价值。使用颜色时应注意以下几点:限制同时显示颜色数;画面中活动对象颜色应鲜明,而非活动对象应暗淡;尽可能避免不相容颜色放在一起,如黄和蓝,红和绿等,除非作对比时用;若用颜色表示某种信息或对象属性,要使用户了解这种表示,并尽可能采取通用
10、表示规则。3)图标设计:图标是可视地表示实体信息简练、抽象符号。图标设计是方寸艺术,需要在很小范围内表现出图标内涵。设计图标时应该着重考虑视觉冲击力,要使用简单颜色,利用眼睛对色彩和网点空间混合效果,做出出色图标 。4) 按钮设计:设计按钮应该含有交互性,应该有3到6种状态效果(点击时状态、鼠标放在上面但未点击状态、点击前鼠标未放在上面时状态、点击后鼠标未放在上面时状态、不能点击时状态、独立自动改变状态),按钮应含有简练图示效果,应能够让使用者产生功效上关联反应。属于一个群组按钮应该风格统一,功效差异大按钮应该有所区分。 5) 屏幕布局设计:设计屏幕布局(Layout)时应该使各功效区关键突出
11、 ,应遵照以下几条标准:平衡标准、预期标准、经济标准、次序标准、规则化6) 菜单界面设计:菜单在图形界面应用程序中使用得很普遍,是软件界面设计一个关键组成方面,描述了一个软件大致功效和风格。 菜单中选项在功效上和按钮相当,通常含有下列一个或多个类型选项:命令项、菜单项和窗口项。 菜单结构通常有单一菜单、线状序列菜单、树状结构菜单、网状结构菜单等,其中树状结构菜单是最常见结构。 设计菜单界面时应注意通常性标准:功效组织菜单,合理分类,并努力争取简短,前后一致;合理组织菜单界面结构和层次;按一定规则对菜单项进行排序;菜单选项标题要努力争取文字简短、含义明确,而且最好以关键词开始;常见选项要设置快捷
12、键;充足利用菜单选项使能和严禁、可见和隐藏属性;使用弹出式菜单 。 7) 填表输入界面设计:在处理大量相关数据场所下,需要输入一系列数据,这时填表输入界面是最理想数据输入界面。在设计填表输入界面时应遵照标准:一致性;有含义表格标题;使用易于了解指导性说明文字;栏目按逻辑分组排序;表格组织结构和用户任务相一致;光标移动方便;犯错提醒;提供帮助;表格显示应美观、清楚,避免过分拥挤。三 试验内容和步骤(一) 试验内容:利用常见设计工具(VC/VB/Delphi/PB等)完成一个通用图形用户界面设计,要遵照界面设计通常标准(一致性、快捷方法、提供错误处理),注意颜色使用,学会使用图标、按钮、屏幕布局、
13、菜单和对话框设计(二)试验步骤1设计多个对话框,完成填表输入界面设计,合理使用图标、按钮、颜色;2设计不一样形式菜单,完成对不一样对话框调用;3提供简单错误处理、联机帮助试验三 Web界面设计一 试验目标和要求1) 熟悉Web站点信息交互模型和结构 2) 熟悉Web界面设计基础思想和标准 3) 掌握Web界面设计工具和技术 二 预备知识Web界面设计是人机交互界面设计一个延伸,是人和计算机交互演变。Web界面设计和站点外观直接相关,站点界面外观是否友好直接关系到是否能吸引人关注。人性化设计是Web界面设计关键,怎样依据人心理、生理特征,利用技术手段,发明简单、友好界面,是Web界面设计关键。
14、(1) Web信息交互模型 用来解释Web人机界面性质一个模型,它提出网页是用户和知识之间界面。对于信息提供者来说包含信息表示,对于使用者来说则是信息获取。信息表示和获取分别受到二者认知结构制约。模型包含到信息三种类型1)数据:当一条信息被反复、简单提供时称为数据,比如机票价格。2)复杂信息:而用来叙述事件时称为复杂信息,如多媒体信息。3)过程性信息:在信息有明确目标,并相互作用时称为过程性信息,如在线练习、在线测试等。 模型包含到信息两种特征:1)动态性:信息在不停改变,含有动态性;2)一致性:信息元素组织方法含有一致性 (2)Web信息设计模型 是解释Web人机界面性质另一个模型,是一个研
15、究网页信息设计模型。设计模型中要考虑到信息两个方面:1)第一是应该展现或略去什么信息。 2)第二个方面指是信息该怎样被表现。(3)Web界面设计基础标准 1) 了解浏览者心理状态 2) 内容和形式统一 3) 降低浏览层次 4) 特点明确 5) 统一整体形象 6) Web界面设计3C标准 (4)Web界面概要设计 1)Web界面框架设计:Web网站计划 、建立原型系统、具体设计、正式实施2)Web界面内容和风格设计:网站内容设计标准、Web界面风格3)Web界面设计语言和文化:网站应设置多语言选择,在网站设计和建设中进行跨文化研究(5)Web界面设计要素 n Web界面布局n Web界面色彩 n
16、 Web界面字体 n Web界面动画和多媒体 n Web界面导航 (6)Web界面设计技术和工具 要设计好Web界面,需要有良好设计工具,伴随Internet网络发展,国际组织和很多互联网软件开发商制订了若干标准,开发了不一样Web界面设计工具。关键技术包含超文本标识语言HTML、用户端脚本语言JavaScript、JavaApplet、服务器端脚本语言。 页面编辑器关键包含:1)MicroSoft企业 Frontpage;2)Macromedia企业 Dreamweaver,Dreamweaver对于动态网页支持尤其好,能够轻而易举地做出很多眩目标互动页面特效,Dreamweaver和Fla
17、sh、Firework并称为Macromedia网页制作三剑客。辅助工具关键包含:1)AceHTML Pro 6.0全功效 HTML & JavaScript 编辑器;2)Antenna Web Design Studio强大可视化网页设计软件;3)Easy HTML简单所见即所得HTML 编辑器,有固定、类似浏览器界面;4)Easy Web Editor是一个 Web 公布工具,许可不了解HTML而在所见即所得环境中编辑Web网页。 三 试验内容和步骤(一) 试验内容:要求依据Web界面设计标准(简练、一致性、对比度),进行Web界面计划、概要设计和设计要素选择,利用一个界面设计工具(Dre
18、amweaver / Frontpage)完成网页设计。(二)试验步骤:1)选择一个界面设计工具,并熟悉它;2)针对一个具体网站(学校、个人、企业)设计应用,进行Web界面计划和概要设计;3)选择WEB界面设计要素,设计出网页四 试验结果1. 数据库中信息 news_user表news表2. 打开浏览器,在浏览器中输入 出现3. 单击滚动区域内信息,跳出过了4秒出现4. 假如在欢迎界面直接单击“登录”,则直接出现登录页面 单击“登录” 出现5. 单击“注册”出现输入信息,不过不输入用户名结果:输入用户名,不过不输入密码结果:输入用户名,不过两次密码输入不一样结果:输入已经注册过用户名,而且两次
19、输入密码一样结果:输入合理用户名,而且两次输入密码全部一样结果:过了3秒钟出现6. 用一样方法注册一个一般用户,数据库中添加用户统计以下7. 登录页面输入不存在用户名 结果过了4秒后,有出现登录界面输入存在用户名和错误密码 结果过了4秒出现登录界面输入正确用户名和密码 结果8. 系统主界面使用一般用户登录使用管理员身份登录9. 以管理员身份登录,新闻添加页面此时数据库中新闻表中内容,以下 单击“添加新闻”出现: 若没有输入摘要若没有输入具体内容若没有输入标题输入已经存在新闻标题,进行插入单击“提交”出现重新输入标题出现5秒过后,出现此时查看,新闻表10. 单击“新闻查询” 在标题上输入“地”,
20、新闻摘要不输入内容,单击“查询”结果: 在新闻摘要上输入“日本”,标题上不输入内容结果 在标题上输入“地”,而且在新闻摘要上输入“日本”结果: 什么全部不输入,直接单击“查询”结果:显示了全部新闻11. 选一条新闻,单击“查看具体详情”结果:单击“返回”12. 选择一条新闻,单击“删除新闻”结果:删除前,数据表中信息删除后13. 选一条新闻,单击“更新新闻”出现假如新闻摘要为空假如具体内容更为空输入合理摘要和内容出现5秒后出现单击“查看具体详情”五 总结试验四 多通道用户界面一 试验目标和要求1) 了解常见多通道用户界面2) 查找资料,熟悉一个多通道用户界面并写出综述二 预备知识为适应现在和未
21、来计算机系统要求,人机界面应能支持时变媒体,实现三维、非正确及隐含人机交互,而多通道人机界面是达成这一目标关键路径。80年代后期以来,多通道用户界面成为人机交互软件工程方法研究崭新领域,在中国外受到高度重视。 综合采取视线、语音、手势等新交互通道、设备和交互技术,使用户利用多个通道以自然、并行、协作方法进行人机对话,经过整合来自多个通道、正确和不正确输入来捕捉用户交互意图,提升人机交互自然性和高效性。多通道用户界面关键关注人机界面中用户向计算机输入信息和计算机对用户意图了解,所要达成目标可归纳为以下方面:1)交互自然性使用户尽可能多地利用已经有日常技能和计算机交互,降低认识负荷。2)交互高效性
22、使人机通讯信息交换吞吐量更大、形式更丰富,发挥人机相互不一样认知潜力。3)和传统用户界面尤其是广泛流行WIMP/GUI兼容。(1) 多通道用户界面基础特点 1) 使用多个感觉和效应通道 2) 许可非正确交互 3) 三维和直接操纵 4) 交互双向性 5) 交互隐含性 (2)包含关键技术1)多媒体使用多个表示媒体,如文本、图形、图像和声音,使人机交互软件工程方法最终要向着更靠近于人自然方法发展,使计算机含有听觉和视觉,以更自然方法和人交互。多媒体技术引入了动画、音频、视频等动态媒体,大大丰富了计算机表现信息形式,拓宽了计算机输出带宽,提升了用户接收信息效率,使大家能够得到更直观信息,从而简化了用户
23、操作,扩展了应用范围。2)虚拟现实又称虚拟环境,虚拟现实系统向用户提供沉醉和多感觉通道体验。在虚拟现实中,人是主动参与者,复杂系统中可能有很多参与者共同在以计算机网络系统为基础虚拟环境中协同工作。 虚拟现实系统含有三个关键特点:沉醉感、交互性、构想性。3)眼动跟踪和视觉相关人机交互自始至终全部离不开视线控制。假如能经过用户视线盯着感爱好目标,计算机便“自动”将光标置于其上,人机交互将更为直接,也省去了上述交互过程中大部分步骤。4)手势识别一个简单手势蕴涵着丰富信息,人和人能够经过手势传达大量信息,实现高速通信。将手势利用于计算机能够很好地改善人机交互效率。在多数情况下我们笼统地认为手势是人上肢
24、(包含手臂、手和手指)运动状态。 5)三维输入 很多应用(如虚拟现实系统)需要三维空间定位技术,三维空间控制器共同特点是含有六个自由度,分别描述三维对象宽度、深度、高度、俯仰角、转动角、偏转角。经过控制这六个参数,用户能够在屏幕上平移三维对象或光标,也可沿三个坐标轴转动三维对象。在三维用户交互中必需便于用户在三维空间中观察、比较、操作、改变三维空间状态。6)语音识别语音识别是计算机经过识别和了解过程把语音信号转变为对应文本文件或命令技术。 语音识别又是一门交叉学科,它和声学、语音学、语言学、数字信号处理理论、信息论、计算机科学等众多学科紧密相连。 7)表情识别 面部表情是人体语言一部分。人面部
25、表情不是孤立,它和情绪之间存在着千丝万缕联络。人多种情绪改变和对冷热感觉全部是很复杂高级神经活动,怎样感知、统计、识别这些改变过程是表情识别关键。8)手写识别发展手写识别技术并嵌入到多种设备中,将是手写识别技术未来发展关键方向之一。联机手写识别技术优点是不需专门学习和训练、无须记忆编码规则、安装后即可手写输入汉字,是最简单方便输入方法。同时符合人书写习惯,能够一面思索、一面书写,不会打断思维连续性,是最自然输入方法。 9)数字墨水数字墨水是一个新人机界面技术,它借鉴手写识别技术同时,克服了它很多不足。 数字墨水在数学上是经过三阶贝塞尔曲线来描述笔输入字迹,它统计格式和图像和文本格式全部不一样。这种存放方法使得数字墨水文件大小很小,从而能够更有效地进行存放。 三 试验内容和步骤(一) 试验内容:要求上网查找资料,熟悉一个多通道用户界面并写出综述,能够是眼动跟踪、手势识别、三维输入、语音识别、表情识别、手写识别等。(二)试验步骤: 1)借助图书馆中英文参考文件资料和网络,确定出一个多通道用户界面; 2)完成对该多通道用户界面综述(包含定义、发展历史、目前应用、关键研究方法分类、和发展前景和中英文参考文件(最少各5篇))