像用美图秀秀一样简单地制作动态H5页面

daisyzhu

VXPLO互动大师的平台发布了一个简单的动态页面模板，为大家提供了十几种动态页面的模板，使你简单几步就能做出丰富的动态页面效果。

首先到互动大师的“浏览作品”页面（http://www.vxplo.cn/explore），找到这个简单交互的模板。


点击作品封面上的下载按钮。


作品就会出现在“我的作品”页面上。鼠标浮上作品封面图片，点击左上方的编辑按钮，就可以进入作品的编辑页面。


看到右手边对象树面板中有很多页面对象。每一个页面就代表一种排版和动态方式。你可以勾选页面前面的方框，来查看不同页面的版式和动态效果。


当你点开页面前方的三角按钮时，能更好地了解这个页面中的结构。每个页面都会有时间轴，其下的图片和文字都会有相应的轨迹，页面上的动态效果就是由时间轴和轨迹所控制的。


还记得我们之前介绍的怎样利用模板嘛？如果你要沿用这个模板中的动态效果，只需要替换页面上的素材就可以了。找到你所要的动态效果页面，双击图片或文字位置进行替换即可。


如果你想改变动态效果，比如加快飞入飞出时间。那只需要在时间轴上找到相对应的关键帧的点，选中这个点（示意橙色为选中），在时间轴上进行拖动（要更快就向左移动，要更慢就向右移动）


如果你想改变图片或文字位置。也只需要在时间轴上找到相对应的关键帧的点，然后相应地改变素材的位置即可。


欢迎进入vxplo互动大师官方网站学习和注册使用工具做各种炫酷的交互效果：www.vxplo.cn
对交互设计感兴趣的朋友，欢迎加入VXPLO技术交流群：301817884