准备工作：

1、下载chrome浏览器（百度搜索下载即可）
2、使用chrome浏览器打开Mugeda网站注册账号。(考虑到有些浏览器对html5的支持不够，强烈建议使用chrome浏览器)

点击图片查看大图

简单来讲，制作一个Mugeda动画内容，包含有如下几个步骤：

1. 添加元素（图片、文字等）到舞台；（制作动画前需要先准备好图片或文字等素材）

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

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

4. 导出或发布内容；

现在我们制作一个简单的动画，让一段”Hello, world!”的文字旋转着出现在屏幕中央，点击文字后，调转到一个指定的页面。
点击查看动画演示
 
1、登录网站后，点击右上角用户名旁边的小箭头——点击下拉列表“动画作品”，进入管理后台，创建作品。



2、Mugeda的编辑工作台(IDE)在浏览器窗口中打开。默认的舞台尺寸为320*520，（我们通常建议使用这个默认尺寸，这是一个典型的适配移动设备动画的尺寸），素材（图片）建议是640*1040，几乎可以保证清晰度，适配大多数主流机型。



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



如果Mugeda提供的素材无法满足您的需求，您可以选择上传自己制作的素材，点击查看上传方式

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



5、新添加的图层会自动命名为”图层1”, 并添加在图层0的上面。



6、添加文字。从IDE左侧的工具栏选择”文字“， 并在舞台上点击鼠标添加文字，双击鼠标可以改变“文字的内容”，并且通过右侧属性栏修改文字的颜色，大小等。



7、这个例子我们把颜色调为红色。下面是一个调整好的样子。



ok，我们已经完成了第一个步骤：添加元素到舞台。
接下来，我们为添加的文字定义一个简单的动画。
在继续之前，我们先保存一下作品，点击IDE上部工具条上的”保存”按钮，或者从文件菜单中选择“文件/保存”。
第一次保存作品时，需要提供一个文件名称。
（注意：保存时的当前舞台截图，将作为作品的缩略图存在。之后再次保存时，不需要提供文件名，而作品缩略图会根据最新的舞台截图进行更新。）



8、为了制作动画，我们需要先将内容的帧数扩展至一个适合的数据。默认情况下，动画内容只有一帧，这个可以时间线面板上看到：



9、我们现在把动画的帧数调整到20帧。在时间线上点击图层0，选中第20帧，然后单击鼠标右键，从出现的菜单中选择“插入帧(F5)”，可以将图层0的帧数扩展至第20帧。也可以选中第20帧后，直接按下键盘的F5键，达到同样的效果。



这时候时间线显示如下。注意：图层0已经包含20帧，而图层1仍然只有一帧。



注意：定义在图层中的元素（图像、文字等），只有在图层的范围内才可见。为了理解这一点，可以点击工具栏上的播放按钮，在舞台上预览作品。



10、开始添加动画，在时间线上，单击图层1中1到20帧的任何一帧，单击右键，在出现的菜单中选择“插入关键帧动画”。



这时候，图层1变成了浅绿色，并且在图层范围的最后一帧（第20帧）出现了一个红色的点。这表明，动画已经添加成功了。图层1中的第1帧和第20帧，定义了动画的开始、结束帧。中间的帧就可以由系统自动通过插值产生了。我们可以为图层1中包含的（文字）元素在动画的开始和结束帧分别定义不同的（位置、大小等）属性，从而产生动画效果。



11、在时间线上选中图层1的第1帧，选中IDE左侧的“变形”工具，然后在舞台上选中文字，可以对文字进行缩放、旋转等操作。也可以直接在属性面板调整其属性。在这个例子中，我们把文字的初始透明度设置为10，旋转设为180度，大小缩小一点，并放置在舞台中央。调整好的属性如下图所示。



保存作品。然后从工具栏点击“播放”在舞台上预览动画效果。也可以在工具栏上点击“预览”在一个单独的窗口预览动画效果。还可以在工具栏点击”二维码“获取一个二维码，然后在手机上预览产生的动画。



默认的动画是不循环，可以通过菜单项”动画/循环“来切换循环状态。



12、我们已经完成了添加元素、定义动画两个步骤。下面我们进一步为动画添加一个最简单的跳转行为。就是当点击文字时，跳转到一个目标网页。选中背景图片，然后在其属性面板上，为其添加一个”链接“行为，地址指向百度，打开方式选择“外部打开”。



点击预览查看动画。点击背景图片，将会导航至http://www.baidu.com。（注意：添加链接前面一定要加http://）Mugeda支持大量的行为方式，从简单的链接，到表单提交、动画控制、调用手机功能（例如打电话），甚至调用JavaScript回调函数等。我们会在今后的教程中陆续介绍给大家。

13、点击保存，恭喜你！第一个动画已经顺利完成了！

为了在你的网站使用这个动画内容，最简单的方式，就是导出完整的动画包，并内嵌到自己的网站中。记住在导出前保存你的作品。在菜单中选择”文件/导出/HTMl源文件”。该操作会将动画内容打包下载到你的硬盘上。



导出的动画包中包含有动画播放所需要的脚本、样式、页面、图像等。双击其中的index.html文件可以直接在浏览器中观看动画内容或者通过iframe的方式嵌入动画。



本教程用到的动画的预览地址是：

点击查看

你也可以在登录后用下面的链接在IDE中查看其源代码：

点击查看

 不知不觉一年一度的教师节要来了，“H5”模仿秀第三期给大家挑选了教师节的案例。为了充分展现各位Mu友的实力，本期形式为模仿＋创意，意思是您既可以模仿原作品制作，也可以根据提供的素材，自由发挥属于您的个性作品呦。都有机会获得奖品。

一辈子的时间
谁不曾感到无助和迷茫……
幸好我有你这位损友无时无刻的给我？
醍醐灌顶
当头棒喝
振聋发聩
……
别说九月十号和你八竿子打不着关系，
孔子都说了“三人行，必有我师”
~咱俩认识那么久，你偶尔粗暴的提醒却蕴含老师的智慧，
所以请接受我的祝福：教师节快乐~

获奖公示：
 

• “Mu”仿达人（1名）：200元（红包）

       用户名：shuihu
       作品预览
 

• “最佳创意奖”（1名）：200元（红包）

       无：由于未发现具有代表性的创意作品
 

• “积极参与奖”（5名）：20元（红包）

1、用户名：totalacg
      作品预览
 
2、用户名：qq15080
      作品预览
 
3、用户名：qqf1b7f
     作品预览
 
4、用户名：qq54750
      作品预览
 
5、用户名：qqe5b49
      作品预览
 
请以上获奖人加微信号：ju5787695，联系人：明月，以便于我们尽快发奖。7个工作日内联系有效。

作品提交：8月25日——8月31日

参赛规则：

1、使用Mugeda工具模仿原作品制作H5内容

2、在下方评论区直接贴出作品的发布链接即可

3、根据提交作品的顺序、相似度及创意评选（如两个作品的相似度相同，先提交的作品获奖）

4、制作中遇到问题在下方评论区提出，有专业老师解答

5、获奖名单将在本页公示（一定要随时关注动态哦）

奖品设置：

“Mu”仿达人（1名）：200元（红包）

“最佳创意奖”（1名）：200元（红包）
  
“积极参与奖”（5名）：20元（红包）
 
作品预览：



教程地址：（8月23日下午15:00直播）
 
评选老师：安仔老师，vn老师，森林味老师，钟樾老师以及班主任松月

本活动最终解释权归Mugeda所有。
 
素材下载：

如经审查发现我的作品中包含诱导分享、色情、暴力等违规内容，Mugeda有权对相关内容进行删除，屏蔽，直至“删除用户帐号，删除用户帐号，删除用户帐号，删除用户帐号”的措施以保证Mugeda内容发布的健康运作。
 为了给大家提供更好的服务，维护Mugeda平台与用户共同发展，请严格遵守以下审核规范。

具体规则及相关处罚如下：

1、诱导分享类内容

1.1 要求用户分享，分享后方可进行下一步操作，分享后方可知道答案等；

1.2 含有明示或暗示用户分享的文案、图片、按钮、弹层、弹窗等的，如：分享给好友、邀请好友一起完成任务等；

1.3 通过利益诱惑，诱导用户分享、传播外链内容，包括但不限于：现金奖励、实物奖品、虚拟奖品（红包、优惠券、代金券、积分、话费、流量、信息等）、集赞、拼团、分享可增加抽奖机会、中奖概率，以积分或金钱利益诱导用户分享、点击、点赞微信公众帐号文章等；

1.4 用夸张言语来胁迫、引诱用户分享的。包括但不限于：“不转不是中国人”、“请好心人转发一下”、“转发后一生平安”、“转疯了”、“必转”、“转到你的朋友圈朋友都会感激你”等；




若内容中包含以上情况，一经发现，立即停止链接内容在朋友圈继续传播、停止对相关域名或IP地址进行的访问，短期封禁相关开放平台帐号或应用的分享接口；对于情节恶劣的情况，永久封禁帐号、域名、IP地址或分享接口。 

2、诱导关注类内容

强制或诱导用户关注公众帐号的，包括但不限于关注后查看答案、领取红包、关注后方可参与活动等；



若内容中包含以上情况，一经发现，立即停止链接内容传播；对于情节恶劣的情况，永久封禁帐号。 

3、H5游戏、测试类内容

以游戏、测试等方式，吸引用户参与互动的，具体形式包括但不限于比手速、好友问答、性格测试，测试签、网页小游戏等；





若内容中包含以上情况，一经发现，立即停止链接内容传播；对于情节恶劣的情况，永久封禁帐号。 

4、欺诈类内容

4.1 虚假红包、活动

通过虚假的红包、活动等形式，以赚取现金、实物奖品、虚拟奖品等方式欺骗用户参与的，具体形式包括但不限于虚假现金红包、虚假话费卡、虚假流量红包、虚假优惠券、虚假优惠活动等； 

4.2 宣传或销售侵害他人合法权益的商品

通过虚假宣传、恶意营销等方式，向用户宣传或诱骗用户购买侵害他人合法权益的物品的，例如以骗取邮费为目的的赠送物品活动、虚假付费服务等； 

若内容中包含以上情况，一经发现，立即永久封禁帐号。 

5、骚扰信息、广告信息及垃圾信息

传播骚扰、欺诈、垃圾广告等信息的，包括但不限于虚假中奖类信息，不符合国家相关法律法规的保健品、药品、食品类信息，假冒伪劣商品信息，虚假服务信息，虚假网络货币等；

若内容中包含以上情况，一经发现，立即停止链接内容传播；对于情节恶劣的情况，永久封禁帐号。 

6、内容低俗的信息

6.1 内容低俗的信息

涉及性器官、性行为、性暗示的，传播低级趣味、庸俗、有伤风化内容的，或者宣扬暴力、恶意谩骂、侮辱他人内容的，例如：传播走光、偷拍、露点、一夜情、换妻、性虐待、情色动漫、非法性药品广告和性病治疗广告、推介淫秽色情网站等；



若内容中包含以上情况，一经发现，立即停止链接内容传播；对于情节恶劣的情况，永久封禁帐号。 

7、非法获取用户数据、信息

未经用户明确同意，并向用户如实披露数据用途、使用范围等相关信息的情形下复制、存储、使用或传输用户数据的，包括但不限于要求用户共享个人信息（手机号、出生日期等）才可使用其功能，或收集用户密码或者用户个人信息（包括但不限于，手机号，身份证号，生日，住址等）；

若内容中包含以上情况，一经发现，立即停止链接内容传播；对于情节恶劣的情况，永久封禁帐号。 

8、其它违反国家法律法规的内容，包括但不限于：

(1) 违反宪法确定的基本原则的；

(2) 危害国家安全，泄露国家秘密，颠覆国家政权，破坏国家统一的；

(3) 损害国家荣誉和利益的；

(4) 煽动民族仇恨、民族歧视，破坏民族团结的；

(5) 破坏国家宗教政策，宣扬邪教和封建迷信的；

(6) 散布谣言，扰乱社会秩序，破坏社会稳定的；

(7) 散布淫秽、色情、赌博、暴力、恐怖或者教唆犯罪的；

(8) 侮辱或者诽谤他人，侵害他人合法权益的；

(9) 煽动非法集会、结社、游行、示威、聚众扰乱社会秩序；

(10) 以非法民间组织名义活动的；

(11) 含有法律、行政法规禁止的其他内容的。

若内容中包含以上情况，一经发现，立即停止链接内容传播；对于情节恶劣的情况，永久封禁帐号。 

更多规则请参考微信外部链接内容管理规范，立即查看
常见问题：

1、我的内容出现下图的提示是什么原因？我该怎么办？



答：你好，由于您发布的内容违反了Mugeda的审核标准，所以将你的内容屏蔽，他人将无法查看。您可以根据以上的标准逐一检查，将违规内容修改或删除，重现发布至原地址即可。重新发布后，如果内容没有及时更新，请ctrl＋F5强制刷新一下。（注意：如果违规内容没有删除或修改，选择再次发布，一经发现，永久封禁帐号）

2、我的内容好像被微信封了？我该怎么办？



答：您好，由于您的内容违反的微信的规则，您需要自己申诉，联系微信的工作人员呦。


 
 更多参考资料：http://kf.qq.com/faq/131117ne2MV7141117JzI32q.html
 
3、Mugeda不可以制作测试题的作品吗？
 
答：您好，Mugeda是可以制作测试题类的H5，但是不可以直接发布，您需要将作品导出，部署到您的服务器上发布。（因为您发布了测试题的内容有可能导出Mugeda整个域名被封，所有用户的作品将都不能查看，后果很严重），导出方法如下：


 
提示：部署服务器需要您联系贵公司的工程师去处理哦。