互动大师 “一步一步看清韩寒”H5制作教程

37185134

互动大师可以简单的制作很有创意、很酷炫的微信H5页面作品/场景，只要准备好音乐和图片素材，通过互动大师的时间轴和事件，就可以简单快速完成有逼真打字效果的“一步一步看清韩寒”这个H5页面作品。

作品链接：http://www.vxplo.cn/idea/sRb_RtO方法/步骤
1.找到VXPLO互动大师官网，进入并注册成为用户，登录即可免费使用。
2.在我的作品里，创建一个新的手机案例，根据需要调整舞台大小（大多数手机像素是640*1008，iPhone4的是640*832，iPhone5/5S的是640*1008，iPhone6的是640*1030，iPhone6+的是640*1040），互动大师默认的舞台大小是640*1008，该案例是以大多数手机尺寸为准，就不需要再调整舞台大小了。

3.点击工具栏，在舞台下添加朴树的平凡之路音乐素材（音乐属性设为自动播放），添加时间轴1（根据需要，将时间轴的自动播放和循环播放属性设置为No，时间轴时长设为65s），在时间轴下添加1、2、3、4、5图片素材，让图片成为时间轴1的子对象。

4.点击工具栏，为时间轴1下的每张图片添加轨迹，选中1图片的轨迹1添加关键帧，设置图片的运动轨迹，控制图片的运动（这个案例里面的图片是从下到上运动的，所以只需要选中图片轨迹的关键帧，修改图片的Y坐标就可以达到向上运动的效果。比如在0s关键帧设置1图片的坐标为（0,950），在1s关键帧设置1图片的坐标为（0,200），这样1图片就从Y坐标为950的位置向上移动了750个单位，移动到Y坐标为200的位置）。

5.点击工具栏，在舞台下添加透明按钮1、添加音按钮图片素材作为按钮，在这些按钮下添加事件（以事件2为例），设置事件的触发条件，即用户做了什么动作（手指离开）；目标对象是什么，即用户的动作可以控制的东西（舞台.时间轴1）；目标动作，即用户的动作控制的对象做出了什么反应（暂停）。然后根据我们的逻辑顺序，用这些按钮通过事件来控制音乐和时间轴的先后播放顺序，这样就可以将具有逼真打字效果的“一步一步看清韩寒”H5作品做出来了。

短短的5步操作就能将这样一个很有创意很酷炫的H5页面作品做出来了，而且还不需要任何编程，不需要写任何代码，是不是很简单，小伙伴们有没有get到这个新技能呢。
本教程中的案例由互动大师的用户提供，案例创意来自1+手机。