基于html5和Javascript的别踩白块儿游戏.docx

HTML5课程设计题 目： 基于html5和Javascript的别踩白块儿游戏 学 院：__信息工程学院 ___________专 业：__ 软件工程（服务外包） 姓 名：xxxxx指导教师：xxxx 2015年 6月 15日 摘要通过一个学期的HTML5选修课程的学习,对HTML5的开发与设计有了初步的了解,希望通过这篇论文,以开发《别踩白块儿》这款小游戏为例，对本学期所学习的知识进行总结。本文从《别踩白块儿》的设计原理以及各个模块的实现等方面对该游戏进行详细的介绍。目录1 绪论..........................................................51.1 开发背景...................................................51.2开发内容....................................................52 游戏开发相关技术.................................................62.1开发工具介绍................................................62.2开发技术运用介绍............................................62.2.1 HTML5介绍............................................62.2.2 JavaScript介绍.......................................73 游戏设计.........................................................83.1游戏总体流程图..............................................83.2游戏的详细设计..............................................93.2.1页面搭建代码...........................................93.2.2黑白块随机模块........................................103.2.3 黑白方块运动模块......................................113.2.4 计分模块..............................................123.2.5 犯规处理模块..........................................123.2.6 加速模块..............................................134运行测试.........................................................135.1测试目的....................................................135.2测试截图....................................................145.3测试结果....................................................155 课程设计小结.....................................................151. 绪论1.1 开发背景《别踩白块儿》是由“有猫腻娱乐工作室（umoni Studio）”制作的一款非常耐玩的休闲益智游戏。别踩白块儿，这就是这个游戏唯一的一个规则。该游戏于2014年4月16日上线App Store。并在全球40多个国家、地区免费游戏榜登顶榜首，超过一百个国家或地区排名前十，5月份荣登全球游戏下载总榜（iOS + Android）第一宝座，游戏上线3个月累计下载达1亿。 鉴于这款游戏的火爆，并且随着HTML5所带来的技术热潮，我便想把这款游戏在PC端通过浏览器在本地实现。1.2 开发内容本游戏通过浏览器，使用HTML5标记语言，CSS样式设计语言，以及JavaScript脚本语言进行实现。 2. 游戏开发的相关技术 2.1 开发工具介绍 Sublime Text 是一个代码编辑器（Sublime