H5页面小游戏怎么做的

提到小游戏，很多非IT技术人员望而却步，随着小游戏越来越受欢迎，部分公司越来越注重小游戏营销，2014以来出现很多爆款轻量级小游戏：《围住神经猫》、《微信跳一跳》等。从刚开始的技术创新到现在注重营销，在微信等各种国民app中经常出现类似小游戏。在HTML技术还未成熟时，制作这样一款web小游戏需要一个团队去策划开发。小公司想玩小游戏营销往往要考虑开发成本、人力成本，为了省去开发这部分，下面给大家讲解的如何利用专业交互设计制作工具Epub360简单实现一个营销小游戏并且发布浏览。

如何策划：

1.参考别人的经验看看别人制作的品牌宣传小游戏案例！下面我找到一些可以参考参考:

经典的flappy fish

经典碰撞游戏 · 打飞机 （由设计师：NEVER提供）

经典射击游戏《坦克狙击战》

2.结合活动主题，将活动文化植入游戏角色中，达到宣传目的。出点子并用脑图先说明流程，在想点子的时候，问一些这样的问题，例如：“玩家接下来会做什么？”、“玩家会怎么做？”、这个游戏是为了什么目的？。

3.根据脑图画出小游戏页面逻辑图。

4.使用专业制作工具epub360实现这种小游戏。

epub360这款软件将常用的物理组件集成，如碰撞检测、拖放组件、数据变量及判断。专业级的交互数据设计、功能强大的同时保证了用户可操作性，设计自由度高，不受模版限制。专业性及软件稳定性在业内一直是深受用户好评，很多企业将它作为营销的交互设计利器。

这样优秀的案例和模版在平台很多大家可以看看～接下来教大家如何利用这款工具模拟实现一个打飞机游戏：经典碰撞游戏 · 打飞机，点击预览即可。

制作思路：

点击登录软件，创建新作品进入编辑器，通过各种组件组合实现交互。

2.将准备的素材导入调整页面布局。

3.通过碰撞组件，将子弹与敌机关联。

4.碰撞时触发爆炸效果和音效，触发记录得分传到其他页面或者数据库保存。

其他敌机依次这样设置，做好小游戏后一键发布分享链接二维码即可，非常方便！由于图文教程限制这里只说制作思路，具体操作可以学习这款软件然后自己操作，这里不在赘述，我们来看看最终效果：飞机大战

写在最后：

这种轻量级的游戏更多作为一种营销手段，主要作用是品牌宣传和营销手段。从目前数据来看，H5游戏的次日留存不断增高，但是在7日留存率上面，这类轻量级游戏的的留存水平也较原生游戏偏低，游戏类型以及游戏玩法更多需要运营人去探索，如何将这类小游戏不断与实体经济和互联网O2O跨界结合，是否能够真正能够成为渠道流量的变现工具这个问题，这是我们运营人所思考的，也希望通过提供这个工具和制作思路，让你在互联网活动运营过程中有些新玩法，新思考。

H5是一系列制作网页互动效果的技术集合，能在移动端做出Flash做不出的动画效果，即H5就是移动端的web页面。而H5游戏，你可以看作是移动端的web游戏，无需软件即可体验。 这个是专业的说法。其实简单的说法就是，H5游戏相当于电脑的网页版游

你可以通过代码定制开发的方式制作H5页面小游戏，但这种方法成本比较高。你也可以通过第三方平台去制作H5页面小游戏，比如意派Epub360。用这个工具做些接物游戏、躲避游戏相对来说是比较简单的，而且这个平台上是有教程的，比自己瞎捉摸强多了。如果你不想花时间研究怎么做的话，也可以直接使用意派Epub360的游戏H5模板，方便快捷且品质有保障。