html格斗游戏,对打游戏

不用引擎,不用画布canvas,不用任何库(包括jquery), 原生div+img组件,开发格斗游戏
游戏教程视频已经上传 b站:https://www.bilibili.com/video/av89986087/

接下来会陆续发布该游戏的开发教程。

大家好,我是居家懒人,现在是2020年,我在湖北老家过春节,嗯~~~,因为这次武汉冠状病毒,大家都憋在家,都说呆在家里不出门,就是对国家最好的贡献,各位兄弟姐妹们,有没有坚持室内健身和学习呢

我的职业是做IT农民,就是什么也不会,生活圈子狭窄,只会写代码的码农
宅在家这些天,吃的很好,但是睡的其实不好,因为心里头空空的,躺在床上很晚了却睡不着,直到一天我翻出了自己的记事本里的一个记录之后
 
接下来的几天作息时间才有了一些节奏,我记事本里这个想法就是用原生html写一个小游戏,看看能做到什么程度。
 
对了介绍一下我的工作,感觉慢杂乱的,做过技术主管,开发过手游,页游,app,还开发过小程序,甚至还做过flash动画广告制作,那是我大学毕业后早报纸上找到的第一份工作. 大学的一个兴趣就是玩flash,做各种时间轴动画,加上一点点似懂非懂的代码让图片跟随鼠标位移什么的,不过后来因为我没有美术功底,然后想找编程相关的工作,做了几个月就离开了。

说到游戏开发,都离不开讨论现在流行的游戏引擎,我也做了简单的归纳:

好,有点跑题了,回到我的关于html的话题,在很多年前,html5标准还没有普及,甚至现在html中的canvas组件还没有,也就是不支持webgl出现的时候,听说,不知道是国内还是国外的大牛高玩,写出了html版本的星际争霸,我没玩过。
 
刚才说到我要用原生html写一个小游戏,那么具体是个什么类型呢:答案是对打游戏,可能会有懂行一些或者比较认真的小伙伴们要问,
 
"什么?你要用html开发一款对打游戏?用html标签那种写UI的组件来开发?现在都是采用成熟的游戏引擎的年代了,你做这件事情有什么意义?"
 
嗯,我要说,我没想过把这个游戏做的很完善或者体验很好,我的目标是实现一些基本的功能就打住,不再玩后开发,所以也没有想过把这个游戏做上线,毕竟时间有限,而我的记事本里接下来要做的事情还有很多
 
那么这个小游戏就是我爱折腾,想要动手实践一下而已,真的就是一个非常小非常小的小游戏,没有很酷炫的技能特效,也没有给人带来沉浸感的光线,阴影效果,其实可以看到仅仅是几张图片被我控制来回跑来跑去而已, 只能算是做一个demo,一次尝试。
 
我在网上找了两个人物角色,决定自己ps一下直接用,
 
不知道玩dota的伙伴,喜不喜欢屠夫这个角色,或者现在王者荣耀的伙伴,爱不爱玩钟馗,他们的技能是我最喜欢的,就是钩子技能,于是我自己给钢铁侠弄了个仍钩子的技能,
 
扔出去把对手勾过来,然后咬一口,但是我没有美术功底,所以就用一团火焰来代表发动攻击了,
 
右边这个角色我起名叫做盔甲幽灵,他的技能就是蓄力攻击,蓄力越久,扔出的长矛越远
 
游戏的角色技能的平衡我其实没有想太多,盔甲幽灵因为比较很难打到人,所以给他的攻击值设的比较高
 
怎么样,两个角色是不是仔细看有些得瑟,摇头晃脑的
左边人物走路,右边人物走路,左边人物跳跃,右边人物跳跃
我直接把我当前的书桌拍下来,做成了游戏背景,可以随人物移动的时候水平滚动
 
 
好了,算是一个开篇介绍,内容做的比较仓促,感谢兄弟姐妹们看到这里,从下一期开始,我就会逐步的给大家讲解,这个看起来比较无聊的小游戏的步骤。
嗯,下期再见。

都闪开,不用任何游戏引擎,html也能开发格斗游戏的更多相关文章

  1. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇:简介及目录》(附上完整工程文件)

    G-3D引擎2D射击类游戏制作教程 游戏类型: 打飞机游戏属于射击类游戏中的一种,可以划分为卷轴射击类游戏. 视觉表现类型为:2D 框架简介: Genesis-3D引擎不仅为开发者提供一个3D游戏制作 ...

  2. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇08:弹幕系统》本系列完结

    8.弹幕系统 弹幕系统概述: 弹幕系统的设计体现了射击游戏的基本要素,玩家要在敌人放出的大量子弹(弹幕)的细小空隙间闪避,能在玩家闪躲弹幕的时候给玩家带来快感,接近满屏的子弹,增加了对玩家的视觉冲击力 ...

  3. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇05:角色中弹》

    5.角色中弹 概述: 为了使游戏具有挑战性,大部分游戏设定中,游戏角色都有生命限制.即在游戏中,由于玩家的操控操控不当,导致游戏角色死亡游戏终止.打飞机游戏也不例外,当敌人击中角色的时候,角色宣判死亡 ...

  4. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇04:碰撞检测》

    4.碰撞检测 碰撞概述: 游戏世界里,游戏对象不能做出如同在真实世界里的物理运动效果.对于大部分游戏来说,都要为其添加物理系统,让其可以模拟真实世界发生的物理运动.但是在这个打飞机游戏Demo中,是用 ...

  5. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇03:子弹发射》

    3.子弹发射 子弹发射概述: 在打飞机游戏中,子弹是自动发射的.子弹与子弹之间间隔一定的时间,玩家通过上下左右控制游戏角色,来达到躲避敌人及击中敌人的操作. 发射原理: 抽象理解为有两个容器存放子弹, ...

  6. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇02:滚屏》

    2.滚屏 滚屏概述: 打飞机游戏场景背景设计通常很简单,因为角色敌人道具等都不与背景发生交互事件.开发者只需要根据设定的游戏类型,为游戏制作背景,模拟一个大环境即可. 滚屏原理: 材质UV动画,实现背 ...

  7. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇07:全屏炸弹》

    7.全屏炸弹 全屏炸弹概述: 为了增设游戏的趣味性,我们制作一个游戏的基本框架以外.还会增设一些其他的额外的功能.比如5秒无敌状态.冰冻效果等.下面咱们以消灭屏幕中所有炸弹为例,看除了碰撞可以触发事件 ...

  8. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇06:计分》

    6.计分 计分概述: 分值计量直接反应玩家在游戏中获得的成就感.因此,计分系统在游戏中显得尤为重要,有的反应在直接获取的分数上,有的反应在杀敌数量上等. 计分原理: 原理图,如图6-1所示. 图6-1 ...

  9. 《Genesis-3D开源游戏引擎完整实例教程-2D射击游戏篇01:播放序列动画》

    1.播放序列动画 系列动画播放概述 2D游戏中的动画系统,不同于3D游戏.3D游戏中,角色美术资源不仅包含角色模型的,还包括角色的贴图和动作等,模型本身自带角色的动作动画效果.2D游戏中,角色美术资源 ...

随机推荐

  1. Numpy常用方法及应用总汇

    目录 Numpy 1.基本操作 1.1数组转换 1.2数组生成 1.3文件读取 1.4查看操作 2.数据类型 2.1指定数据类型: 2.2查看数据类型 2.3数据类型转换 3.数组运算 3.1数组间运 ...

  2. RabbitMQ入门之Hello World

    RabbitMQ简介   在介绍RabbitMQ之前,我们需要了解一些最基础的概念,相信使用过或者听说过RabbitMQ的人都不会陌生,但笔者还是不厌其烦地在这里讲述,因为笔者的理念是self con ...

  3. .NET Core 3 WPF MVVM框架 Prism系列之事件聚合器

    本文将介绍如何在.NET Core3环境下使用MVVM框架Prism的使用事件聚合器实现模块间的通信 一.事件聚合器  在上一篇 .NET Core 3 WPF MVVM框架 Prism系列之模块化 ...

  4. 关于在读取excel的文件时候,放在服务器上就报路径错误

    就是指定这个路径:C:\Program Files (x86)\IIS Express 因为在上传到服务器的时候,服务器读取的是在服务器上的路径,所以正确的思路应该是 把上传的Excel存在服务器上, ...

  5. 关于<Java 中 RMI、JNDI、LDAP、JRMP、JMX、JMS那些事儿(上)>看后的一些总结-1

    原文地址:https://www.anquanke.com/post/id/194384#h3-3 1.java rmi 关于rmi客户端和服务端通信的过程,java的方法都实现在rmi服务端,客户端 ...

  6. GP工作室—团队项目总结

    GP工作室-团队项目总结 这个作业属于哪个课程 https://edu.cnblogs.com/campus/xnsy/GeographicInformationScience/ 这个作业要求在哪里 ...

  7. Dynamics CRM Package Deployer 部署工具

    CRM 部署工具非常有用 我们可以用部署工具来做迁移,部署 等等.  Package Deployer可以同时部署多个solutions. 并且也可以勾选solution的plugin也同时部署. 三 ...

  8. php编译完php.ini加载问题-Loaded Configuration File (none)

    编译安装php7时指定了--with-config-file-path=/usr/local/php7/etc,修改了 php.ini 的配置后重启,但就是不生效. 出现Loaded Configur ...

  9. python 3 创建虚拟环境(Win10)

    python 3 创建虚拟环境(Win10) ①为什么要用虚拟环境? 为了解决一个环境多个项目的版本冲突问题 ②如何创建虚拟环境? 用窗口键+R来打开win10的运行窗口,然后在运行输入框输入cmd, ...

  10. 基于Flask框架搭建视频网站的学习日志(二)

    基于Flask框架搭建视频网站的学习日志(二)2020/02/02 一.初始化 所有的Flask程序都必须创建一个程序实例,程序实例是Flask类的对象 from flask import Flask ...