使用HTML5制作简单的RPG游戏
很久以前就想着做一个游戏,但什么都不会又不知道从哪里开始,胡乱找来一些书籍和资料结果太深奥看不懂,无奈只能放弃。这一弃就是十多年,倥偬半生,眼看垂垂老矣,还是没能有什么成果。
近年来游戏引擎越来越多,相关资料也愈加丰富,使得游戏开发的门槛不再那么高了。特别是HTML5游戏,只需要一个支持HTML5的浏览器就能运行,特别适合我这样的初学者。一个偶然的机会,在某著名视频网站上发现很多关于Enchant.js 这个游戏引擎的教学视频,还有一本教程叫做《HTML5 Game Programming with enchant.js》,于是抱着再不开始就晚了的心态决定使用这个引擎开发一个游戏。
经过两个多月断断续续的开发,期间边学边做,终于做出了一个demo,不过只支持最新版的Chrome浏览器,其它浏览器经过测试都不能很好的运行,包括最新的Edge。
演示地址如下(友情提示——游戏带有音效,请注意打开场合):
(操作方法 W、A、S、D或方向键控制人物行走,J键确认/对话,K键取消/返回)
demo采用的是暗雷遇敌方式,且遇敌率较低,在大地图上多走走就能碰上,某一区域能碰上Boss。
在这个区域能碰上Boss。
//
游戏素材都是从网上找来的,并且是模仿了某一款老游戏。对于游戏画质和模式飞速发展的今天来说,这样的游戏显得有些过时了,但并不妨碍我们去探索其中的实现原理。
demo实现了一部分RPG游戏的基本要素:
- 地图的绘制
- 游戏场景的切换
- 对话系统
- 商店/交易系统
- 地图/场景事件
- 战斗系统
还有一部分因为时间关系没能做出来:
- 伙伴系统
- 装备/道具系统
- 任务系统
- 游戏背景、剧情
- 很多计算公式没能应用上
- 可玩性不够丰富
开发游戏实在是一个任重道远的过程,一开始确实很有挑战也能勾起兴趣,但时间一长,就会陷入到不断的功能改进、Bug测试当中,从而产生一种“feel like shit”的感觉,因此需要极大的耐心与热情。虽然只是很小的一步,但总算是跨出去了,比起之前浑浑噩噩要聊胜于无吧。
最后附上项目地址:https://troybug.github.io/SimpleRPG/index.html
参考资料:
RPG Maker VX Ace
使用HTML5制作简单的RPG游戏的更多相关文章
- 简单3d RPG游戏 之 003 怪物AI
游戏中,怪物会自动的往玩家所在地点走去,那需要创建一个C#脚本EnemyAI,包含两个功能: 1. 怪物旋转自己对准玩家 2. 怪物向前移动,追逐玩家 public class EnemyAI : M ...
- 简单3d RPG游戏 之 002 生命条(二)
在游戏中,游戏人物的血条可能会因为受伤或吃血瓶而长度变化,所以需要将血条的长度单独提出来作为一个变量,方便直接修改数值. public float healthBarLength; 改变生命值函数如下 ...
- 简单3d RPG游戏 之 001 生命条(一)
1.创建一个新项目,引用如下的包: 2.将asset里的First Person Controller拖入project作为游戏角色,将其命名为Player,将mainCamera删除,这样就是用Pl ...
- 简单3d RPG游戏 之 005 选择敌人
选择一个敌人,按ctrl+d,复制出3个,调整一下它们的位置,不重叠,修改Tag为Enemy,禁用EnemyAI. 创建Targetting脚本,绑定到Player玩家对象 public class ...
- 简单3d RPG游戏 之 004 攻击(二)
人物和怪物的攻击都有CD冷却,在PlayerAttack脚本中添加成员 //冷却倒计时 public float attackTimer; //CD冷却时间 public float coolDown ...
- 简单3d RPG游戏 之 004 攻击(一)
功能:实现点击键盘F键,怪物血量条减少,并且假定是近战,需要对距离进行判断,距离小于一定值的时候按F才会减少怪物的血条. 新建c#脚本PlayerAttack,绑定到Player,并在unity里将敌 ...
- HTML5制作简单画板
<!DOCTYPE HTML> <html lang="en-US"> <head> <title></title> & ...
- 如何制作一款HTML5 RPG游戏引擎——第五篇,人物&人物特效
上一次,我们实现了对话类,今天就来做一个游戏中必不可少的——人物类. 当然,你完全是可以自己写一个人物类,但是为了方便起见,还是决定把人物类封装到这个引擎里. 为了使这个类更有意义,我还给人物类加了几 ...
- 如何制作一款HTML5 RPG游戏引擎——第四篇,情景对话
今天我们来实现情景对话.这是一个重要的功能,没有它,游戏将变得索然无味.所以我们不得不来完成它. 但是要知道,使用对话可不是一件简单的事,因为它内部的东西很多,比如说人物头像,人物名称,对话内容... ...
随机推荐
- iOS 关于请求参数在cookie里面
一.首先了解一下什么cookie cookie是在客户端存储服务器状态的一种机制.web服务器可以通过set-cookie或者set-cookie2 HTTP头部设置cookie. Cookie可以分 ...
- Bzoj 3145 - [Feyat cup 1.5]Str
bzoj 3145 - [Feyat cup 1.5]Str Description 给你两个长度\(10^5\)级别的串\(S, T\) 求\(S,T\)的最长模糊匹配公共子串 模糊匹配 : 至多一 ...
- HDOJ Important Sisters
Important Sisters Time Limit: 7000/7000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Othe ...
- 10个HTML和CSS必须知道的重点难点问题
前端日刊 登录 10个HTML和CSS必须知道的重点难点问题 2018-02-26 阅读 2982 收藏 6 原链:segmentfault.com 分享到: 前端必备图书<深入浅出Node ...
- 从无序序列中求这个序列排序后邻点间最大差值的O(n)算法
标题可能比较绕口,简单点说就是给你一个无序数列A={a1,a2,a3……an},如果你把这个序列排序后变成序列B,求序列B中相邻两个元素之间相差数值的最大值. 注意:序列A的元素的大小在[1,2^31 ...
- 2017-2018 ACM-ICPC, NEERC, Southern Subregional Contest A E F G H I K M
// 深夜补水题,清早(雾)写水文 A. Automatic Door 题意 \(n(n\leq 1e9)\)个\(employee\)和\(m(m\leq 1e5)\)个\(client\)要进门, ...
- awk 使用方法
awk是一个强大的文本分析工具,相对于grep的查找,sed的编辑,awk在其对数据分析并生成报告时,显得尤为强大.简单来说awk就是把文件逐行的读入,以空格为默认分隔符将每行切片,切开的部分再进行各 ...
- formal parameter
formal parameter : [3.16] object declared as part of a function declaration or definition that acqui ...
- uva 1442:Cave(贪心)
题意:一个洞穴长n,告诉你每个位置的地面高度和顶部高度,让你往里灌水,要求水不能碰到天花板(但可以无限接近).求最多的水量.(洞穴两边视为封闭) 思路:如果知道一个位置向左看最高可以多高,向右看最高可 ...
- HDU 1005 Number Sequence【斐波那契数列/循环节找规律/矩阵快速幂/求(A * f(n - 1) + B * f(n - 2)) mod 7】
Number Sequence Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)T ...