如何制作微信H5页面动画?Mugeda在线制作工具制作流程

H5动画在微信朋友圈愈来愈火爆，看到各种脑洞大开的动画，你是不是也有量一量自己脑洞大小的冲动？今天小编为大家分享Mugeda在线制作工具如何制作微信H5页面动画方法，一起来看看吧！

这里我用的工具室Mugeda在线制作工具，建议使用chrome浏览器会支持的比较好。

方法/步骤

大体的流程是这样的：

1. 添加元素（图片、文字等）到舞台；

2. 为添加的元素定义动画；

3. 定义和用户的交互行为（例如点击跳转等）；

4. 导出或发布内容；

首先创建

然后需要选择一个动画尺寸。在这个例子中我们选择300x250, 这是一个典型的适合移动设备动画的尺寸。选择尺寸后，按“确定”继续。

准备好一个大小为300x250的舞台，这时候我们就可以开始制作动画内容

我们为舞台添加一个背景图片。从IDE左侧的工具栏上选择“图片”按钮，可以打开选择图片的对话框

选择图片对话框是在制作动画中用的最多的对话框之一。他提供了三种上传图片的方式：选择本地文件，输入网址，通过拖拽批量上传。上传的时候还可以指定一个目标文件夹。我们暂时采用默认上传位置即可。这个例子中我们从本地上传一个木质纹理图片。大家可以自由选择一个图片。选择图片并上传后，其尺寸、格式以及预览会显示在对话框中。如果满意了，就点击“选择”将图片添加到舞台上。

由于添加的图片尺寸(370x280)比舞台大，图片会缩小显示在舞台中央。

为了使其全屏显示，可以点击选择图片，然后在IDE右侧的属性对话框中编辑其位置和大小使其全屏显示。

接下来，我们为舞台添加一段文字。首先在IDE上方的时间线上，点击时间线左下角的“新图层”添加一个新的图层。