教程 如何用易企秀制作小游戏?

H5营销2020-05-16 09:56:05

H5小游戏想必我们久经朋友圈沙场的朋友们都有玩过

那些生动好玩儿的游戏在朋友圈传播貌似也是很嚣张的

但是我们玩的那些似乎都是独立开发的


试想如果小白用户用免费工具做一款H5游戏......

那可真是屌丝大逆袭啊!

今天小编就助你一臂之力,走上人生巅峰!  




长按识别上方二维码查看H5


你找到了几个熊猫,通关了吗?

快分享到朋友圈吧!这就给大家教程福利!


第一页

和普通的设计一样,并没有什么交互,

只是在“开始游戏”按钮右脚加一个链接而已。


第二页到第五页

逻辑基本相同,每个页面包含以下三个部分




此处三层都是互相覆盖的,这里我们拆开来讲,

中间部分是页面主元素


左侧是答对状态,右侧是时间到状态。

下面拆分页面讲解下每个部分是如何设置动画和触发的


【倒计时部分】




此部分是10个数字文字依次中心放大后消失

每个数字之间延时1秒,从10到0,

这样就有了倒计时的效果


【“时间到”页面】




此页设置时间延时为10秒

这样整个元素就在10秒后开始显示

一旦10秒内没有找到熊猫,该层就会覆盖掉页面


【偷瞄答案按钮】



此按钮做了一个简单的触发

点击“偷瞄答案”按钮

即可触发正确答案处红色圆圈

先中心放大后淡出的动画


【找到熊猫后的结果】




这里我们做了一个透明层

在熊猫的位置放一个透明层然后做触发

触发出答对效果的层

这样就可以实现点击到熊猫提示“答对啦”的效果了


【设置】




替换题目图片重复以上的动作就好啦

加上尾页,进行全局设置就大功告成啦!


如此,一个复杂的H5游戏就出炉啦

而且还是个免费平台!

是不是感觉瞬间自信心爆棚?


再扫码玩儿一次吧!

玩儿完了记得分享哦!


推荐阅读


连这些工具都没用过,你好意思说自己是运营狗么?

据说99%的人在制作H5的过程中都犯过这些错误




号外,易企秀两周年庆,点击阅读原文,抢楼拿大奖!

关注易企秀微博,还可参加【情人节微博抽奖活动】

科达股份