《毕业设计（论文）围住逃课男游戏设计与开发.doc》由会员分享，可在线阅读，更多相关《毕业设计（论文）围住逃课男游戏设计与开发.doc（59页珍藏版）》请在三一办公上搜索。
1、编号：（）字号本科生毕业设计（论文）围住逃课男游戏设计与开发 08113681网络11-3班题目：姓名：学号：班级：二一五年六月中国矿业大学本科生毕业设计姓 名： 学 号：08113681学 院：计算机科学与技术学院专 业：网络工程 设计题目：围住逃课男游戏设计与开发专 题：指导教师：职 称：讲师2015年6月徐州中国矿业大学毕业设计任务书学院计算机科学与技术学院专业年级网络工程11级姓名任务下达日期：2015年 1 月 12日毕业设计日期： 2015年1月 19日至 2015 年 6月 3日毕业设计题目：围住逃课男游戏设计与开发毕业设计专题题目：毕业设计主要内容和要求：研究内容：（1）采用最
2、新的HTML5、JavaScript技术和CSS3标准来构建各种常见类型的游戏；（2）实现游戏的模式设置、难度设置、背景设置、声音设置、用户信息存储与管理；（3）利用JavaScript技术解决HTMl5有关浏览器的兼容问题；（4）开发富有趣味性和技术性的游戏，掌握HTML5、JavaScript技术和CSS3标准中与游戏开发相关的理论知识。工作要求：在完成最低工作量：（1）设计与开发基于HTML5的游戏开发；（2）装订好论文（包括不低于3000字的翻译）；电子版设计论文；程序源代码；系统使用说明书的基础之上，尽量完成该课程设计的其他要求及一些扩展功能。院长签字：指导教师签字：中国矿业大学毕业
3、设计指导教师评阅书指导教师评语（基础理论及基本技能的掌握；独立解决实际问题的能力；研究内容的理论依据和技术方法；取得的主要成果及创新点；工作态度及工作量；总体评价及建议成绩；存在问题；是否同意答辩等）：成绩：指导教师签字：年月日中国矿业大学毕业设计评阅教师评阅书评阅教师评语（选题的意义；基础理论及基本技能的掌握；综合运用所学知识解决实际问题的能力；工作量的大小；取得的主要成果及创新点；写作的规范程度；总体评价及建议成绩；存在问题；是否同意答辩等）：成绩：评阅教师签字：年月日中国矿业大学毕业设计答辩及综合成绩答辩情况提出问题回答问题正确基本正确有一般性错误有原则性错误没有回答答辩委员会评语及建议
4、成绩：答辩委员会主任签字：年月日学院领导小组综合评定成绩：学院领导小组负责人：年月日摘要随着计算机性能的飞速提升和互联网技术的持续发展，用户享受互联网的方式也越来越简单快捷，因而对于网络应用的要求也越来越高。目前，越来越多的应用可以用浏览器打开的方式直接使用，用户数据则存储在云端，这样不仅增加了安全性还方便了用户共享数据。当网络化在各种应用中不断普及的同时，一种新的技术标准应运而生，那就是HTML5。HTML5是新一代互联网标准的开发语言，作为当今最炙手可热的Web开发技术，凭借其强大的功能特性和跨平台等优势，它将把Web带入一个崭新的应用平台，图像、动画、音频和视频，以及人机交互在这个平台上
5、都会被更加完善地标准化，给用户更好的体验。本文首先从国内外HTML5 技术的发展现状和趋势入手，对其进行整体分析，然后讨论了HTML5、JavaScript和CSS及其相关开发技术的发展历程，介绍了HTML5新增的功能及其应用。以此为基础设计开发了一款基于HTML5 技术的网页版“围住逃课男”的游戏应用，该游戏界面简洁，操作简单，运行流畅，功能完善，趣味十足。采用HTML5新添加的Canvas绘图功能创建游戏舞台，并使用img和audio标签完成了游戏背景和音效的设置。使用JavaScript编码设计游戏的人物模块、地图模块、算法模块和流程控制模块，提高了程序的兼容性和实用性。游戏布局则采用C
6、SS样式实现，用法简单且功能强大。游戏主要有经典和基友两种游戏模式，每种模式对应不同数量和形象的人物动画，同时采用移动算法的切换实现了游戏难度的控制。当然，在整个游戏过程中实现了对人物位置和地图布局等相关数据的存储和管理，确保了游戏数据的统一性和实时性。本游戏是参照2014年在微信平台上十分火爆的游戏围住神经猫设计开发的，趣味性很强同时也是对经典的缅怀。关键词：HTML5；JavaScript；CSS；Canvas；网页版游戏；ABSTRACTWith the rapidincrease of the computer performance and the continuous develo
7、pment of the Internet technology, users also begin to change ways of enjoying the Internet constantly. So the requirements for network applicationare increasingly high. More and more application can be directly used in the way of opening the browser, user data are stored in the clouds, and therefore
8、 thiswill not only increase the safety but also be continent for users to share data. At the same time of various application continuously tends to be more webified, a new standard of technology emerges as the times require, which is HTML5. HTML5 is a new generation of Internet standards development
9、 language, nowadays, as one of the hottest web development technology, by virtue of its powerful features and cross platform advantages, it will take the web into a new application platform, on which the image, the animation, the audio, the videoand human-computer interaction in this platform will b
10、e more perfectly standardized. First of all, the paper starts with the current situation and development trend of HTML5 technology at home and abroad, to which I carry on the overall analysis, and then discusses the development of HTML5, JavaScript and CSS and its related development technologies, n
11、ew HTML5 features and its application are introduced. This design based on developed a based on HTML5 web version of the “Surrounding truant students”game application, the game interface simple, simple operation, smooth running, perfect function, full of fun. Using Canvas newly added HTML5 graphics
12、feature to create the game stage, and use img and audio tags to complete the game background and sound settings. The characters, map module, arithmetic module and process control module of the game are made by using JavaScript coding to improve the compatibility and practicability of the program.Gam
13、e layout is achieved by using CSS style, simple and powerful. There are two game models in the game, the classic and the friends game mode, each mode corresponding to different number and image of the character animation, using mobile algorithm to realize the control of game difficulty. Of course, t
14、he character location and map layout and other related data are stored and managed in the whole game progress, to ensure the consistency and real-time of game data. Thedesign and development of the game is a reference to a very popular game on “weixin” platform in 2014, named “surrounded neurotic ca
15、ts”, fun and strong but also the memory of the classic.Keywords:HTML5; Canvas; JavaScript; CSS; Webpagegames;目 录1 绪论11.1课题的目的和意义11.2国内外发展现状和趋势11.3课题主要的内容和功能介绍21.3.1课题主要的内容21.3.2围住逃课男游戏功能介绍31.4相关技术简介31.4.1 HTML5标准简述及意义31.4.2 JavaScript标准简述及意义41.4.3 CSS标准简述及意义51.5开发工具51.6本文章节安排62 系统分析72.1系统设计分析72.2系统需
16、求分析72.2.1游戏角色72.2.2需求分析72.2.3用例分析82.3本章小结103 系统概要设计113.1系统总体功能设计113.2各模块及其对应的功能123.2.1数据管理模块123.2.2 用户操作界面相关模块123.3程序流程控制133.4本章小结154 系统详细设计164.1数据管理模块设计164.2舞台模块设计174.2.1定义圆点174.2.2绘制地图184.2.3舞台模块部分代码194.3逃课男模块的设计214.3.1逃课男定义214.3.2绘制人物动画214.4算法模块的设计224.4.1随机移动算法模块224.4.2最短路径算法模块264.5声音控制模块的设计304.6
17、游戏流程模块的设计314.6.1各流程模块功能定义314.6.2程序流程控制的实现344.7应对浏览器的HTML5支持374.7.1利用JavaScript解决HTML5兼容问题374.7.2使CSS兼容374.8本章小结385 总结与展望395.1总结395.2展望39参考文献41翻译部分42英文原文42中文译文46致谢491 绪论1.1课题的目的和意义当前，在互联网技术高速发展的同时，其在人们日常学习、工作、生活中的作用和地位也日益凸显，自身也在不断发展并完善。随着时代的进步，人们逐渐开始使用互联网技术及其附属功能所提供的各种便捷服务与应用，无论何时何地都能享受到它为我们生活、工作以及学习
18、所带来的好处和便利。与此同时，随着互联网基础用户的不断增多和相关开发者的底层平民化，人们创造和完善其功能和服务的步伐也会越来越快。对于整个互联网游戏行业，无论是从其所具有的商业价值层面还是从其开发所需要的技术层面上来讲，随着游戏开发设计的方法和模式的推陈出新，不断有公司在尝试和挑战与其相关的新的开发模式和技术。然而，毕竟整个互联网游戏行业处于一个相对开放的平台，在开发和运营游戏的过程中，大家应当遵循一个被共同认可的标准模式。这样不但规避了垄断和一家独大式的竞争模式，而且避免了开发路径偏激化、开发标准多样化和开发结构复杂化等问题。正是基于此，HTML5技术应运而生，凭借其符合大多数开发者的标准和
19、技术体系，在网络革新中不断发展和壮大。就目前来看，尽管距HTML5游戏的普及还有着一段时间，但不可否认的是，HTML5游戏已经逐渐被市场所接受，甚至在改变Web游戏的某些方面。另外，目前人们所认识的互联网已经不仅仅是传统意义和规模上的互联网，它驱使过去出现的所有模式和应用向着更加快捷和移动的方向发展和壮大，人们在日常生活中可以通过智能手机、平板电脑和可穿戴设备等各式各样的移动设备来享受互联网提供的应用和服务。可以看到，HTML5技术必将凭借其强大的功能特性和跨平台等优势深入改变人们日常学习、工作和生活中的方方面面1-3。本课题应用HTML5及其相关技术完成了过去仅用Web 技术难以实现的功能，
20、而且对比之前的技术体系性能提升很多，同时创新性和前瞻性十足，可以说是基于HTML5 技术的一次最佳实践。相对于其他应用来说，游戏本身有着无可替代的作用，其拥有很强的互动性，可以直接在网页中运行。在给人带来轻松愉快的同时，也借此将HTML5技术的相关功能融入到人们的日常生活之中。1.2国内外发展现状和趋势HTML5好比投向互联网行业的一颗重磅炸弹，推动了许多领域进行彻底革新。例如，前几年野蛮成长的手机应用。虽然HTML5从出现到尘埃落定一直在争议中曲折发展，但是随着HTML5页面的推广和HTML5游戏的涌现，互联网巨头纷纷向以HTML5应用为中心的领域靠拢。由此预见一个新的移动互联网黄金时代即将
21、到来，而HTML5游戏也将华丽蜕变。下面来盘点一下HTML5游戏现状：（1） HTML5游戏在微信朋友圈中疯狂传播：2014年7月，HTML5游戏发展的里程碑式产品围住神经猫在微信朋友圈中疯狂传播，人们纷纷炫耀用更少的步数围住此猫，创造了3天点击量过亿的奇迹。电商纷纷借助HTML5游戏增强广告趣味性，从而调动用户参与的积极性，并诱导用户在朋友圈中传播。（2） 触控科技推出Game Creator Online：2014年9月，为了方便缺乏HTML5技术却对此感兴趣的人实现自己的想法，触控科技提供了在线HTML5模板，对资源进行整合并上线发布，构建了全民开发HTML5的蓝图。（3） 万维网联盟正
22、式宣布HTML5 标准定稿完成：2014年10月29日，经过长达8年的艰辛努力，万维网联盟激动地宣布，HTML5标准规范终于制定完成并已公开发布。进一步推动了HTML5游戏的发展。（4） DataEye发布DHAP HTML5游戏统计分析平台：2014年11月5日，DataEye正式发布了DHAP HTML5游戏统计分析平台，凭借其强大且专业的数据统计和分析技术为终端运营的数据保驾护航，给HTML5游戏开发者们提供了精良装备，让他们大展身手，为HTML5游戏运营的多样化打下了夯实的基础。（5） 首届HTML5大会在北京召开：2014年11月19日，首届HTML5大会在京召开，诸多游戏行业内的大
23、佬们出席了会议，他们纷纷对HTML5游戏的未来做了一些展望，多数大佬比较看好HTML5游戏的前景。然而，HTML5的发展也不是一帆风顺，不久前，微信创始人张小龙在一次面向微信公众平台用户的演说中，公开表示微信已经对HTML5游戏的传播进行了限制。紧随其后，12月30日，微信公众平台正式发布公告，表示将对诱导用户关注公众账号和诱导用户分享朋友圈的行为进行整顿。这无疑沉重打击了依赖微信生态圈进行病毒传播来推广HTML5游戏的部分开发者。总之，面临众多机遇和挑战，HTML5游戏不管以何种方式在在游戏市场中立足，其终端游戏的运营都离不开数据的保驾护航，另一方面，精细化运营始终是所有游戏运营商的共同目标
24、。也许随着技术的成熟，HTML5游戏在精细化运营方面越来越出色，届时，运营数据的精细化将会成为每款游戏在市场上占据一席之地的主导因素4-6。1.3课题主要的内容和功能介绍1.3.1课题主要的内容本课题的主要内容是使用最新的HTML5Canvas绘图功能绘制游戏界面；采用JavaScript编程实现游戏的流程控制；应用CSS样式标准来完善页面布局，从而构建各种常见类型的游戏，实现游戏的模式设置、背景设置、声音设置、难度设置、用户信息存储与管理等功能。1.3.2围住逃课男游戏功能介绍启动支持HTML5的浏览器之后，用户通过输入有效地址或者点击相关链接即可进入“围住逃课男”游戏的主界面。游戏模式包括
25、两种：经典模式和基友模式。游戏主要功能包括：（1）玩家必须通过鼠标点击地图上未被选中的点，同时“逃课男”会四处逃窜，直到玩家将其困住，最后逼至无路可走方可获胜，系统记录所用步数。如果“逃课生”逃跑到地图边缘的任一点，则围捕失败游戏结束。（2）游戏开始后，自动播放背景音乐，同时加载图片初始化舞台。利用随机函数将地图中的部分点设置成已被选中的点。当玩家点击鼠标时有按键音。（3）进入游戏主界面后有经典和基友两种游戏模式可供选择，任意选择其中一种，将加载相应人物和算法模块开始游戏，中途有重玩按钮，游戏结束后有再玩按钮。1.4相关技术简介1.4.1 HTML5标准简述及意义HTML5的制定是为了取代19
26、99年所制定的HTML4.01和XHTML1标准成为新的HTML标准，目前仍处于发展阶段，但是大部分主流浏览器已经较好的支持HTML5技术了，其中最完美的当属Chrome浏览器。HTML5技术主要有两大特点，首先，增强了Web页面的表现性能；其次，添加了本地数据库等Web应用的功能。HTML5不但继承了上一个版本全部功能和特性而且还增加了部分新的语法特性和功能，其中就包括、和标签，同时还集成了矢量图形实现方式（SVG）的相关内容。这些元素的添加为在网页中的展现和插入更多的多媒体和图片内容提供了便利。随着互联网的飞速发展，传统的Web界面技术早已不能满足人们对于交互特性日益增长的需求，Web标准
27、是网页设计与开发的一个趋势。而HTML5是近十年Web开发标准中最大的飞跃。与传统Html4.0相比HTML5新增了以下这些功能：（1）绘图（Canvas）：可以动态生成二维图形、图表、图像以及动画，并进行展示。实现图片甚至视频的像素级处理。（2）音频和视频支持（Audio and Video）：HTML5标准为这两个元素提供了完整、通用且可脚本化控制的API，因而开发人员不必使用插件就能播放音频和视频。（3）地理定位（Geolocation）：通过在Web应用程序中共享其地理位置信息，用户可以享受与位置感知相关的服务，例如全球定位功能。（4）实时和跨源通讯（Communication）：构建
28、实时和跨源通信的两个重要模块：XMLHttpRequest Level2与跨文档消息通信，严格限制运行在同一浏览器中的框架、标签页、窗口间的通信，增强了安全性。（5）通讯（Web Sockets）：通过定义一个全双工通信信道，让仅用Web上的一个Socket实现通信成为可能。WebSocket不仅加强了常规HTTP通信的增量，对于实时的和事件驱动的Web应用程序而言，它还代表着一次卓越的进步。（6）后台处理（Web Workers）：HTML5 Web Workers可以为Web应用程序提供后台处理功能。由于它对多线程有非常好的支持性，所以使用了HTML5的JavaScript应用程序可以充分
29、利用多核CPU带来的优势。（7）离线应用（Offline）：HTML5的离线应用缓存使得在无网络连接状态下运行应用程序成为可能。适合阅读和写电子邮件、编辑文档等等，避免了加载应用程序时所需的常规网络请求，从缓存中加载资源可以节省带宽。（8）数据存储（Web Storage）：开发者可以通过将需要跨源请求重复访问的数据直接存储在客户端浏览器中，以减少网络流量。同时可以在关闭浏览器很久后再次打开时恢复数据7-9。1.4.2 JavaScript标准简述及意义JavaScript是一种跨平台、基于对象和事件驱动的脚本语言，最早是由Netscape公司开发。凭借其开发环境简单、不需要Java编译器、可
30、以直接在Web浏览器上运行的优势，从而倍受Web设计者的推崇。JavaScript的主要特点如下：（1） 脚本编写语言JavaScript是一种脚本语言，采用小程序段的方式编程，虽然其基本结构形式与C、C+、VB、Delphi十分相像，但是与这些语言有所不同，由于JavaScript是解释型语言，所以在程序执行过程中只被逐行地解释并运行，不需要预先编译。（2） 基于对象的语言JavaScript既是一种基于对象（Object-Based）的语言，又可以看作是一种面向对象的语言。JavaScript可以把HTML页面中的每个元素都看作是对象，并且这些对象之间存在着层次关系。通过操作HTML对象的
31、方法和属性，可以捕捉到用户在浏览器中的操作，从而实现页面的动态效果。（3） 简单性JavaScript在语法上可以理解为基于Java的语句和控制流，对于已经学习了Java语言的人，使用JavaScript开发将会变得非常容易；反之，学习JavaScript也是对学习Java的一种非常好的过渡。（4） 安全性JavaScript不但不可以将数据保存到服务器上，而且不能访问本地的硬盘，同时不允许对网络文档进行修改和删除，是一种安全性较高的语言。只能通过浏览器实现信息浏览或动态交互，可以有效地防止数据破坏和丢失。（5） 动态性JavaScript是动态的，它可以直接响应用户或客户的操作，无需经过We
32、b服务程序。JavaScript对用户的响应是以事件驱动的方式进行的。（6） 跨平台性JavaScript与操作环境无关，只依赖于浏览器本身，只要浏览器可在计算机上运行且支持JavaScript就可以解释执行，从而真正实现“write once，run everywhere”。综上所述，JavaScript 是一种基于对象（Object-Based）和事件驱动（Event Driven）并具有安全性能的脚本语言。通过把JavaScript嵌入在HTML页面中，可以赋予网页动态效果；采JavaScript开发客户端的应用程序，可以实现与客户的交互10-12。1.4.3 CSS标准简述及意义CSS
33、（Cascading Style Sheet）是指层叠样式表，用于控制网页内容的外观并允许将样式信息和网页内容分离的一种标记语言。引入它的目的是让HTML语言更好地适应页面的美工设计。它在HTML语言的基础上，提供了丰富的格式化功能，比如颜色、背景、字体、和整体排版等，同时网页设计者可以针对各种可视化浏览器来设置不同的样式风格。随着CSS的广泛应用，CSS技术越来越成熟，CSS的发展经历了CSS1、CSS2和CSS3这3个循序渐进的标准：（1）CSS 1.0：1996年12月，W3C（万维网联盟）发布了CSS1规范，该规范主要定义了网页的一些基本属性，例如颜色、字体、行间距和字间距等。（2）C
34、SS 2.0：1998年5月，CSS2规范发布。CSS2规范是基于CSS1设计的，其中包含了CSS1所有的功能和特征，并以此为基础添加了一些高级的功能，如定位和浮动等，另外，还添加了一些高级的选择器，如子选择器、相邻选择器和通用选择器等。（3）CSS 3.0：2001年5月，W3C完成了CSS3的工作草案。该草案完成了CSS3的发展路线图的制定，详细列出了所有模块，并计划在未来逐步统一规范。CSS3标准被分为若干个相互独立的模块，这将有助于理清模块化规范之间的关系，减小完整文件的体积。目前流行的浏览器都对CSS有良好的支持，但不同浏览器对CSS3很多细节的处理存在差异。采用CSS3规范以后，网
35、页的布局会更加合理，样式会更加美观。但CSS3还没有完全普及，各个浏览器对CSS3的支持还处于发展阶段。如果所有浏览器都支持CSS3样式，那么网页设计者将可以使用统一的标记，在不同浏览器上实现一致的显示效果，网页设计将会变得更加容易13-16。1.5开发工具HTML5 近年来发展迅猛，随着主流浏览器对 HTML5 技术支持的不断完善以及 HTML5 技术的不断成熟，越来越多的开发人员开始使用HTML5来制作各种效果显著、内容丰富而且交互性强的Web应用。虽然目前HTML5 的标准还不是特别完善，但是显而易见，HTML5 已经逐渐被市场所接纳，有着广阔且良好的发展前景。正是如此，不断吸引着开发工
36、具提供商向HTML5 技术靠拢，纷纷推出了各自支持HTML5的新版本。下面为大家介绍三款优秀的HTML5 开发工具，相信大家对它们都不会陌生。（1） Adobe Dreamweaver CS6：Adobe Dreamweaver CS6是一款能够同时实现网页制作和网站管理的网页编辑器，不仅提供对移动程序和HTML 网站的可视化编辑界面，其 Fluid Grid 排版系统还通过整合CSS样式表功能实现了自适应版面的跨平台兼容性。（2） IntelliJ IDEA：IntelliJ IDEA作为Java语言开发的集成环境，由于其在J2EE支持、Ant、Junit和CVS整合、智能代码助手、代码补全
37、、重构和审查、以及创新的GUI设计等方面的超常功能，在业界被公认为最好的Java开发工具之一。尤其是它的调试（Debug)功能，可以实现对JavaScript、Java代码、JQuery和Ajax等技术的调试。（3） Jetbrains WebStorm：WebStorm 是Jetbrains公司旗下一款JavaScript 开发工具。倍受广大中国JS开发者的喜爱，有着“最强大的HTML5编辑器”、“最智能的JavaScript IDE”和“Web前端开发神器”等称号。由于本次开发使用到WebStorm，下面就具体简述一下WebStorm及其主要特点。WebStorm出自声名赫赫的JetBra
38、ins公司,原本是JetBrains专门为Web开发人员所设计的一个快速、轻量的商用IDE，而且与IntelliJ IDEA同源，继承了IntelliJ IDEA在JS部分的强大功能。自身包含快速智能的支持代码重构和格式化、代码提示和补全细节的自定义，拥有良好的编辑体验，如快速查看代码结构及定义、快速定位最近的编辑等，以及便于调试的优秀特性。Webstorm的优势主要包括以下三点：（1）由JetBrains开发，是用于HTML5应用开发的JavaScript专业编辑器，系出名门且与强大的Java开发工具IntelliJ IDEA同源，拥有强大的技术支持。（2）通过提供出众且强大的代码补全、智能
39、提示和程序重构等功能，大大提高了开发人员编写JavaScript代码并嵌入HTML5页面的效率。（3）提供了非常有价值的HTML5模板，并非只是简单的开发模板，而是具有很高参考价值的知名实际项目模板17-20。1.6本文章节安排本文共分为五章，基本内容安排如下：第一章 绪论，阐述了课题的研究目的及意义，介绍了HTML5及其相关技术目前在国内外的发展现状及趋势，概述了课题的主要研究内容及功能，之后又详略有序地对HTML、JavaScript和CSS等相关技术和标准进行简介，最后向大家介绍了三款HTML5的优秀开发工具。第二章 系统分析，主要是对该系统进行了需求分析和用例分析，对系统的总体结构进行
40、了分析，对系统的功能模块进行了划分。第三章 系统概要设计，主要是对该系统的程序模块进行分析、地图读取及修改、游戏中的声音控制分析，之后给出了程序流程图，最后分析了实现该游戏的各个模块需要解决的问题，并提出了解决方案。第四章 系统详细设计，首先对该系统的服务端进行了设计分析，之后又对地图功能模块、人物模块、算法模块、绘制画布等各个部分的具体实现进行了说明，然后给出了实现这些模块的部分关键代码。最后针对浏览器关于HTML5和CSS兼容问题提出解决方案。最后一部分是总结与展望，总结了系统的优点与不足，并提出可进行扩展的功能设计，给出了下一步的研究方向。2 系统分析系统分析是指把要解决的问题看作一个系
41、统，通过综合分析其系统要素，最终找出解决问题的可行方案的咨询方法。对游戏系统进行系统设计分析和系统需求分析，可以有效地提出解决问题的方案和满足用户的需求。2.1系统设计分析用户体验（UE）是指用户在玩游戏的过程中建立的心理感受，主要包括：游戏画面是否美观、游戏界面是否友好、游戏运行是否流畅？等等，所以对于每一种游戏来说良好的用户体验至关重要。然而良好的用户体验，必须做到以下几点：（1） 界面友好：游戏界面简洁舒适，能够完美地展示游戏内容。（2） 操作简单：游戏玩法简单易学，操作简单，容易上手。（3） 运行流畅：要能够快速响应用户请求并处理相关信息。（4） 趣味十足：游戏的意义在于其娱乐性，使人
42、们开心快乐。（5） 可扩展性：不仅要实现游戏的基本功能，还要拓展和附加功能来丰富游戏内容，增加趣味性。（6） 节约资源：高速有效地利用资源可以节省系统的资源，尤其是对于游戏应用，要做到快速响应用户操作并进行相关信息处理，就必须合理地利用和配置资源，使资源利用率最大化21-22。2.2系统需求分析2.2.1游戏角色本游戏的创作灵感来自目前广泛存在的大学生逃课现象，由此背景设定在教室，主要有两个游戏角色，一个是想要逃课的学生，另一个是试图阻止学生逃课的老师。游戏玩家：即玩游戏的人，在游戏中扮演老师的角色，通过鼠标点击地图上未被选中的圆点形成一个圈，从而将想要逃课的男生困住直至无路可走。逃课男：玩家
43、可以选择游戏模式：经典或基友模式，经典模式中系统自动加载一个逃课男；基友模式则加载两个逃课男。在玩家围困它们的同时，按一定的移动算法四处逃窜。2.2.2需求分析游戏类系统设计要能够提供美观舒适的游戏画面、友好的交互界面，同时能响应用户的各项操作请求，并将这些请求转化为与之相对应的各项命令。其功能需求可以概括为以下几个方面：（1） 舞台控制功能在游戏开始后，系统调用相应函数，自动加载并初始化舞台。在舞台上随机布置已选中的圆点和未选中的圆点，每次形成的舞台都是不同的，以此增加趣味性和互动性。（2）背景音乐及鼠标点击音效控制功能用户开始游戏后，播放背景音乐，可以使用户得到放松。当用户点击鼠标进行游戏
44、时，鼠标音效响起，避免了玩家在游戏过程中的单调乏味，从而丰富了游戏的内容，增加了游戏的趣味性和可玩性。（3）游戏模式设置功能进入游戏开始界面后，有两个游戏模式可供玩家选择，经典模式比较简单，只需围住一个逃课男；基友模式则较为困难，需要将两个逃课男都围住。这样不仅丰富了游戏的功能，提高了游戏与玩家的交互性，还增强了和趣味性可玩性。（4） 人物模块的相关功能在经典模式下运行游戏，系统会加载人物模块在舞台中央绘制出一个左右摇摆的逃课男；在基友模式下运行游戏则加载两个手舞足蹈的逃课男，两只模式下的人物形象各有特色。（5）算法模块的相关功能游戏进行的过程中，在玩家通过鼠标点击地图上未选中的点围捕逃课男的
45、同时，逃课男会按照一定的算法移动来摆脱困境。两种游戏模式的算法不同，经典模式中使用最短路径算法；基友模式中采用随机移动算法。这样就提高了游戏的娱乐性。（6）流程控制模块的相关功能进入游戏主界面后，点击经典或者基友模式开始游戏，系统会自动调用相应模块的函数加载舞台和人物，游戏进行的过程中，点击“重玩”按钮即可重玩本局游戏；游戏结束后显示游戏结果。点击“再玩”按钮则重新开始游戏。2.2.3用例分析用例分析是连接需求与设计的桥梁，而用例图则是对系统功能的一个宏观描述，画好用例图是由软件需求向最终实现迈出的至关重要的第一步。本设计的用例图由用例、参与者以及它们之间的关系构成，主要用于为系统的功能需求建
46、模。从而描述出系统需要的功能，即从外部用户的角度观察，分析游戏系统应该实现哪些功能，这样有利于开发人员以一种可视化的方式更好地理解系统的功能需求23。（1）游戏模式用例图用例图2.1主要描述了本游戏主要有两种游戏模式可选：经典（单人）模式和基友（双人）模式。不同模式会在舞台上加载不同形象和数量的人物动画，同时控制人物进行移动的算法也会变换。游戏平台玩家游戏模式选择双人模式单人模式图2.1游戏模式用例图（2）玩家所具有功能的用例图用例图2.2描述了玩家在游戏过程中可进行的各项操作。首先玩家可以选择喜欢的游戏模式进行游戏，通过鼠标点击舞台上的圆点来改变地图布局，达到围住逃课男的目的。在游戏过程中，玩家可以点击重玩按钮刷新地图。游戏结束后，系统显示游戏结果以及玩家的最佳成绩，同时提供再玩按钮，让玩家重新体验游戏的乐趣。游戏平台玩家点击重玩按钮重玩本局点击再玩重新开始游戏点击鼠标来围捕逃课男选择游戏模式显示游戏结果图2.2玩家进行各项操作的用例图2.3本章小结对本游戏的系统分析由两部分组成。首先对系统进行设计分析，围绕良好的用户体验为中心，提出了必须达到的六个要求；然后对系统进行需求分析，其中包括游戏角色制定、需求分析和用例分析。游戏角色给出玩家扮演的人物和需要围捕的角色；需求分析以提供美观舒适的游戏画面和友好的交互界面为目的，给出游戏需要实现的各项功能；用例分析通过文字描述和用例
