一、开题依据

1. 研究目的及意义

随着Internet技术的发展，网页游戏渐渐进入了人们的日常生活，随着偷菜游戏的出现，网页游戏由于它简单、易操作、无时间限制等原因，出现了“井喷式”增长。正如人人网、QQ等社交网站一样，网页游戏的用户之间的交互往往是通过网站平台来完成的，随着网页游戏的日益增加，越来越多的网页游戏嵌入到网站平台。

作为新一代的开发平台，HTML5游戏能够运行于包括iPhone系列和iPad系列、智能Android手机以及平板电脑上，HMTL5强化了Web网页内容的表现能力，具有较好的跨平台特性，可以不通过第三方软件就能很好地展现网页上的多媒体元素。随着Web2.0的浪潮的掀起，HTML5有望成为网络游戏开发的热门新平台。

本论文将基于新一代的HTML5技术，开发一个支持多人参与的德州扑克网页游戏。德州扑克是一种技巧性非常强的扑克游戏，有一定的运气成分，但玩家之间主要还是要靠斗智力、耍手段、动脑筋。其规则非常简单，比较容易掌握，赢得了广泛玩家的喜爱。本论文基于B/S（浏览器/服务器）模式开发，后台服务器采用PHP，MySQL，该游戏具有特点，具有友好灵活的操作界面，用户可以通过网页的元素搭配，使用户得到不同于传统网页游戏的体验，为都市中紧张生活的人们从中得到移动的娱乐和放松。

2. 国内外研究现状

在HTML5尚未成熟应用的时候，流媒体播放等一些精彩应用必须借助第三方软件才可以实现，比如Flash等。但是现在HTML5已经将其超越，它不但可以播放视频和音频，而且还可以开发出各种网络在线应用程序，如标识的地理位置、离线存储、拖放、图片处理等。HTML5从根本上改变了开发商开发Web应用的方式，从桌面浏览器到移动应用，这种语言和标准都在影响并将继续影响着各种操作平台。

目前国内基于HTML5的网页游戏还不是太多，实现具有较复杂的动画特效的网页游戏还比较少，本文采用HTML5技术开发的德州扑克的网页游戏，在选题上具有较好的新颖性。

3. 主要参考文献

［1］ 吕定平, 陈升想. HTML5游戏开发实战[M]. 机械工业出版社, 2012.

［2］ Thomas A. Powell. HTML5&CSS完全手册（第五版）[M]. 刘博，译. 清华大学出版社, 2011.

［3］ David Flanagan. JavaScript权威指南[M]. 机械工业出版社, 2012.

二、主要研究内容

设计课题名称

基于HTML5的德州扑克多人网页游戏开发

项目研究内容

本网页游戏网站平台基于B/S（浏览器/服务器）模式，后台服务器采用PHP，MySQL。具体提供用户界面模块、后台管理模块、网页游戏操作模块和游戏与服务器之间的接口模块等四大功能

(1) 用户界面模块

① 登陆模块

用户必须登陆后才能进行游戏。

② 进入房间

用户必须进入房间才能进行游戏，用户只能与同一房间内的其他用户进行游戏。

③ 站起坐下

用户首先以旁观者的身份进入房间，坐下后参与下一轮游戏。

④ 筹码

用户可以随意注入筹码，但有上下限。

(2) 后台管理模块

① 新建用户

管理员可以新建用户。

② 数据管理

管理员可进行任何数据管理。

③ 数据统计

可以根据不同时间段统计访问人次。

(3) 游戏操作模块

① 发牌模块

在游戏开始时，先随机发牌，需要保证的是每一张卡牌都会以动态的形式从牌堆移动到指定的位置。

② 翻牌模块

在每一张反面的牌翻动时，以旋转的形式翻出正面，并且期望添加卡牌音效。这里主要用到Canvas以及audio元素。

③ 时间限制模块

任何一次加注操作都有时间限制，超过时间视为放弃。

④ 筹码模块

玩家可以任意增加筹码，筹码操作按顺时针轮流。

⑤ 判断模块

开牌后自动判断最大牌组，以此确定获胜玩家。

⑥ 筹码分堆模块

对于一些筹码较少的玩家，在投入所有筹码后，不再参与后续的加注，因此需要将筹码分堆。

(4) 游戏与服务的接口模块

在登陆或者其他操作是，通过Ajax技术向后台发送请求，并且后台以json或者text的形式封装数据，反馈给请求页。

课题的新颖性

相对于旧有的Flash应用，采用HTML5+CSS3+JavaScript开发模式不但开发周期短、运行效率高、并且加载速度极快、性能需求低、2D、3D图形硬件优化等，这些都不是旧有的Flash 可以比拟的优势。另外，更重要的是，HTML5作为HTML的最新的公开标准，这意味着所有的浏览器都必须以兼容HTML5为目的，反观私有的Flash插件，其兼容性孰优孰劣也就一目了然了。由于兼容性产生的问题，不但极大影响应用的运行效率，并且会极其巨大地占用系统资源，这样一来，这类小游戏应用的开发意义也就大打折扣了。甚至，更严重还可能导致系统的崩溃、对硬件造成不可恢复的损害。

重点解决问题

n 需要体现HTML5应用的特点之一：惊人的视觉效果。比如动态的发牌效果、翻牌效果、牌组移动效果等。这些都不是旧有的HTML语言开发模式所能具备的。

n 一个好的游戏应用除了要有让人惊叹的视觉效果，恰到好处的音效也是必不可少。

n 更好的游戏应用，理应是可以记录用户操作的重要信息，比如一些时间记录，这不但能更快速地载入已有的游戏信息，并且能够提醒用户上一次的游戏记录，这可以有效提高用户的体验。HTML5提供了两种更好的客户端存储方法，与之前的cookie存储不同，HTML5中的数据不是由每个服务器请求传递的，而是只有在请求时使用数据。这就使在不影响网站性能的情况下存储大量数据成为可能。对于不同的网站，数据存储于不同的区域，并且一个网站只能访问其自身的数据。

预期结果

本游戏应用程序最终的结果，必将是具备加载速度极快、性能消耗极少、视觉效果良好、用户交互性优秀、操作简单等优点的网页卡牌游戏。

三、研究方案

研究方法

(1) 需求分析

明确卡牌游戏的规则，以用户的身份体验一些相关的卡牌游戏应用，找出其中的共通点，特别要注意此过程中游戏的视觉表现以及听觉表现，力求得到良好的设计灵感。

(2) 概要设计

明确开发任务和目标，进行总体设计。

(3) 详细设计

这个阶段将把游戏应用模块化，对每个模块进行细化分析，最后依靠特定的接口组合模块，形成最终的游戏程序。

(4) 代码的编写与测试

研究工作的总体安排和进度

(1) 2011年10月—12月：熟悉设计课题，查找资料，研究和阅读资料，撰写开题报告。

(2) 2011年12—2012年2月：进行需求分析，撰写需求分析报告。

(3) 2012年3月初：制定程序的概要设计和详细设计，熟悉开发环境。

(4) 2012年3月—2010年4月初：开发程序，进行系统测试。

(5) 2012年4月：撰写论文。

(6) 2012年5月：修改论文，参加论文答辩。

理论分析

(1) HTML5

HTML5赋予网页更好的意义和结构。更加丰富的标签将随着对RDFa（RDF attribute）的，微数据与微格式等方面的支持，构建对程序、对用户都更有价值的数据驱动的Web。基于HTML5开发的网页APP（Application）拥有更短的启动时间，更快的联网速度，这些全得益于HTML5 APP Cache，以及本地存储功能。Indexed DB（html5本地存储最重要的技术之一）和API（Application Programming Interface）说明文档。

从Geolocation功能的API文档公开一来，HTML5为网页应用开发者们提供了更多功能上的优化选择，带来了更多体验功能的优势。HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以直接与浏览器内部的数据直接相连，例如视频影音可直接与microphones及摄像头关联。更有效的连接工作效率，使得基于页面的实时聊天，更快速的网页游戏体验，更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术，Server-Sent Event和Web Sockets就是其中的两个特性，这两个特性能够帮助我们实现服务器将数据“推送”到客户端的功能。

支持网页端的Audio、Video等多媒体功能，与网站自带的APPS（Application Service），摄像头，影音功能相得益彰。基于SVG（Scalable Vector Graphics）、Canvas、WebGL及CSS（Cascading Style sheet）3的 3D功能，用户会惊叹于在浏览器中，所呈现的惊人视觉效果。HTML5会通过XML HttpRequest2等技术，帮助Web应用和网站在多样化的环境中更快速的工作。

(2) CSS3

CSS即层叠样式表，在网页是做时采用CSS技术，可以有效地对网页的布局、字体、颜色、背景和其他效果实现更加准确的控制。CSS3是CSS技术的升级版本，CSS3语言开发是朝着模块化发展的。以前的规范作为一个模块实在是太过庞大而且比较复杂，所以，把它分解为一些小的模块，更多新的模块也被加入到CSS3中。这些模块包括：盒子模型、列表模块、超链接方式、语言模块、背景和边框、文字特效、多栏布局等。CSS3将完全向后兼容，其主要影响是将可以使用新的选择器和属性，这会允许实现新的设计效果，而且可以更加简单地设计出原有的设计效果。

(3) JavaScript

JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。同时也是一种广泛用于客户端Web开发的脚本语言，常用来给HTML网页添加动态功能，比如响应用户的各种操作。它最初是由网景公司的Brendan Eich设计，是一种动态、弱类型、基于原型的预言，内置支持类。Ecma（European Computer Manufacturers Association）国际以JavaScript为基础指定了ECMAScript标准。JavaScript也可以用于其他场合，如服务器端编程。完整的JavaScript实现包含三个部分：ECMAScript，文档对象模型，字节顺序记号。

(4) Ajax

AJAX即"Asynchronous JavaScript and XML"（异步JavaScript和XML)是一种用于创建更好更快以及交互性更强的Web应用程序的技术。AJAX的核心是JavaScript对象XMLHttpRequest，可以使用JavaScript向服务器提出请求并处理响应，可在不重载页面的情况与Web服务器交换数据，而不阻塞用户。通过AJAX，因特网应用程序可以变得更完善，更友好。

实验方法与步骤

(1) 进行可行性研究，明确程序本身的价值，列出游戏程序所需要具备的功能，进行页面的布局设计，然后划分模块，细化各个模块的功能。

(2) 根据上一步骤得出的文档进行概要设计。

(3) 根据概要设计所列出的功能进行编写代码。

(4) 进行测试编好的程序。

实验方案可行性

(1) 经济可行性

本应用具备小游戏的特点，性能消耗极低，硬件要求不高，开发时间短，周期短，工作量不大，是比较适合个人开发的理想应用。

(2) 技术可行性

使用Power Designer、Rose、my eclipse等开发工具能使此系统的开发更加快速方便。

(3) 社会可行性

虽然市面上基于HTML5的游戏众多，但市场需求极大，只要游戏做得好，不必担心市场需求。

可能遇到的问题及解决方法

自身的代码的封装思想并不成熟，是以容易造成代码重用性不高，代码冗余等情况，在开发的过程中必须要重视此类问题，坚持使用类封装所有的实现方法，力求提升自身的代码风格。

四、指导教师意见