现在H5做的越来越好了，我的品位也被越养越高，一般的H5都入不了法眼。

2017已经过去六分之一了，只有这几个H5入了我的法眼……

1、老板们的苦日子——小影子

2、连连看——莫炼

3、居然这么来订票——央美互动

4、快闪——李安

5、POLA——咖墨创意

这些H5作品我都是在Mugeda平台（www.mugeda.com，专业级H5制作云平台）看到的，现在我正在学这个软件，它的界面跟Flash特别像，所以我觉得特别亲切，学习起来不会特别吃力。

值得一提的是：Mugeda制作的H5无任何广告，LOGO，无需花钱去广告，简直太人性化了。如果你是一个有过flash动画或者有过视频制作基础的设计师的话，Mugeda是最适合转型进入H5行业的工具！

一、操作页面：

1)     菜单栏：设置操作和作品的属性，如：可以导出HTML源代码、GIF，发布模式等

2)     时间轴：用来控制动画

3)     工具栏：可以快捷使用常用工具

4)     页面：制作内容的页面展示

5)     舞台：相当于你的手机屏幕，在这里制作你的作品

6)     属性栏：设置元素属性

二、入门方面：

对于新手，Mugeda提供了“预置动画”这种比较便捷的动画设置，小白也可以分分钟做出动画来。

三、强大功能介绍：

1、动画方面：

1)  基本动画设置：Mugeda基本上沿用了Flash的时间轴动画设定方式，可以设定关键帧。

2)  遮罩动画：Mugeda支持自定义路径的遮罩，并可以进行动画控制。

3)  3D旋转动画：Mugeda支持X、Y、Z三轴带透视旋转动画。

4)  路径及变形动画：Mugeda支持图形的变形动画。

5)  序列帧动画：可上传一组图片进行播放控制，并配有专门的触发器来进行精细的序列帧播放控制。

6)  进度动画：可实现绘制线条过程的效果和文字的打字机效果。

7)  视差、联动交互动画：在Mugeda里，采用关联动画实现此类效果，可以将一个元素的位置大小属性做为变量传递给另一个元素，来实现联动的效果。

8)  陀螺仪控件：Mugeda制作的动画可以支持手机的陀螺仪功能，可获取移动设备的旋转角度，将旋转角度联动元素坐标进行动画播放。

9)  虚拟现实场景组件：可以用来显示360度全景图片，并添加热点进行交互。

2、交互：

Mugeda涵盖很多交互功能，比如通过点击、长按、摇一摇等触发播放动画、控制视音频、设置变量、拨打电话、提交数据、修改分享短语、调取微信摄像头、录音等功能，这些都是无需任何代码就可以实现的。

3、逻辑判断：

Mugeda提供行为参数以及执行参数表达式方式进行逻辑设计，更侧重于动画的交互逻辑。
Mugeda可以获取元素的属性，并根据元素属性变化来设置后续的交互逻辑。

4、数据功能：

Mugeda目前提供基础表单和自定义的表单类功能。可以统计基本数据，如：PV，UV以及朋友圈传播层级方面的相关数据。如果你的H5包含让用户上传图片、录制声音，也能在后台直接获取，不用写代码。

四、关于费用？

Mugeda会员是1000元/年（基础版），对比了两家国内专业级H5工具，一个收费16800，一个收费2999，真心太贵，而且发布和导出都有限制，果断放弃了。

Mugeda 的1000元会员可享受到：作品数量不限、发布次数不限、导出次数不限、无广告、无流量限制、可使用全部模板等，具体可以看看他们的官网，戳这里直达。

五、国内各家H5工具的比较？

在最初选择H5工具的时候，我对比了国内好几家，下面仅就我的使用体验，谈一谈吧。

国内主流的专业级H5制作平台其实主要就3个：Mugeda、IH5和Epub360。下面就学习成本、动画、交互等方面谈一下我的体会。

1、学习成本：

·Mugeda（www.mugeda.com）

界面对设计师和动画师太友好了，满眼都是Flash的影子，如果有Flash基础的上手很快，关键帧动画、序列帧动画都沿用了Flash的使用逻辑，如果涉及到复杂的交互功能，也可以写入JS脚本，和Flash的开发流程也是一样的。

学习成本：低

上手时间：2天

有无完整教程：有，不仅有每个功能的讲解，还有动画、交互、逻辑等区块讲解，案例也是最热门的，教程更新很快，看教程点这里。

·iH5（http://www.ih5.cn）

比较要求逻辑思维，媒体元素的组织通过对象树来构建，而动画用的是时间轴，有点违背我的操作习惯。最初是要完整看一遍视频的，要不会觉得有点懵，但热门功能更新很快，这点对设计师的吸引力挺大。

学习成本：高

上手时间：1周

有无完整教程：有，特效讲的比较多，但动画较少，认真学完还是能掌握的，而且教程页面支持搜索，比较方便查找，但案例有点过时了，整体教程更新较慢，看教程点这里。

·Epub360（www.epub360.com）

Mugeda是Flash的操作逻辑，Epub360是PPT的操作逻辑，没有设计基础的人就可以通过简单的研究开始初步的H5设计。入手极快，但要做成好作品挺难的，需要有强大的想象力配合对软件的深入理解才可以。

学习成本：低

上手时间：1天

有无完整教程：有，但以文档为主，很多还是用户的经验分享，挺有参考性的，案例课程几乎没有，课程更新速度很慢，看教程点这里。

2、动画

·Mugeda

Mugeda的遮罩动画、陀螺仪控件、关联动画做的很好，可以做很多交互效果，而且时间轴的方式，能更精准的调整动画。

目前支持预置动画、时间轴动画、遮罩动画、3D旋转动画、路径及变形动画、视差、联动交互动画和陀螺仪控件。

·iH5

IH5的滑动时间轴挺特别的，用的好能做出非常酷的效果，但目前不支持SVG动画。

目前支持时间轴动画、序列帧动画、视差、联动交互动画、3D旋转动画、属性冻哈和物理引擎。

·Epub360

Epub360里没有时间轴这个概念，刚开始觉得很容易，但用到后面有种被工具束缚的感觉，还是自己水平的问题吧。

目前支持路径动画、序列帧动画、SVG动画、视差联动交互动画。

3、交互

·Mugeda

Mugeda是通过添加行为的方式设置交互的，而且这块完全是可视化，设计师使用完全无障碍，高级的交互，可以用API实现，官网也给了非常完整API文档，如果之前在Flash里做过开发，这个也很容易搞定。

·iH5

iH5是通过添加事件的方式添加交互的，去年上线了几款非常好用的效果，如碰撞检测、计时器还有物理引擎，现在还能做双屏了，很强大，但开放性不够，设计师对平台的依赖比较大。

·Epub360

Epub360是通过添加触发器来实现交互的，目前已经有十几款高级组件，能满足设计师一般要求，而且团队很注重交互方面的开发，如果设计师要做小游戏用Epub360还是很方便的。

4、总结

·Mugeda

适合人群：有Flash基础的设计师、及有开发人员的H5团队

优势：无广告、动画流畅、学习成本低

不足：数据功能相对简单

平台稳定性：高

·iH5

适合人群：逻辑思维感强的设计师

优势：交互功能强大，新功能更新很快

不足：学习成本太高

平台稳定性：中

·Epub360

适合人群：设计师，及小白用户

优势：很多功能提供多种实现方式，可玩度很高

不足：动画方面不足，比如遮罩、3D旋转还比较弱

平台稳定性：高

上面是我个人经过体验后的一些想法，大家不要拍砖~~目前正在学Mugeda，有志同道合的小伙伴可以一起交流。