这才是适合设计师的免费交互神器——iH5

设计师们，你的电脑装了多少个设计软件？

据说设计软件的标配是：平面设计类、动效设计类、交互原型制作类、视频制作类和3D建模类等等，少说也得装上八九个。

（图为iH5设计师悟脚叔叔的设计软件截图）

而且每次工作都得同时打开多个软件，电脑又卡慢又发热，狂躁不安的你是不是有股强大的冲动想换一台超高配置电脑，但囊中羞涩又让你断了这个念头？

这个时候，一款功能强大的云端设计工具，就能有效解决问题。

今天就来介绍一款线上、云端、免费、多用途、比Flash智能、比AE可交互、比Axure更高效的交互神器——iH5。

iH5 ：http://www.ih5.cn/

iH5是什么？

iH5是世界顶尖的H5制作工具和创作服务平台。它不是软件，只是一个在线网站，用浏览器打开就能使用，无须下载安装和捆绑。

作为一款零代码的专业交互H5工具，iH5专为不懂代码的设计师打造。

你可以用它制作动效丰富的动态海报，轻松制作创意酷炫的H5广告。

可以用它高效产出可测试、可交互的产品原型，当然也可以直接制作出Web App。

可以不需要一行代码就生成网站，可以打造能够购物、付款的电商平台。

HTML5是目前最佳的内容载体，有着丰富的应用场景，而iH5的丰富功能能帮助不懂技术的我们，享用HTML5技术，零代码实现任何创意的H5。

今年6月，iH5发布了3.0版本编辑器。 新增响应式布局、变形动画、实时通信等关键组件，全新的界面和功能对设计师更加友好！

iH5 3.0——适合设计师的思维方式

作为设计师，无论是交互还是视觉，无论是用PS、AI还是用Axure、Sketch，我们最最熟悉的一个概念，就是 图层 了。而iH5的操作方式，同样也是图层的概念，因此上手门槛不高。iH5的界面，乍一看有点像PS呢。

如上图所示，iH5的编辑界面可分为6个部分。

最左边是 工具栏 ，提供页面、 多媒体素材、按钮、数据库、表格、时间轴等对象组件，而不是构建好的模块组件，因此iH5相比其他H5制作工具来说，自由度非常高。

iH5的 组件 包括素材类、动画类、容器类、数据应用类和开发类等50个左右的组件，组件的任意搭配可以组合出多种多样的功能，满足你天马行空的想象力。

iH5的界面是灵活的，点击对象树中的任意组件会出现相应的 属性栏 。通过设置这些对象的属性，即对各元素的参数进行规定。常规属性如尺寸、位置、不透明度、颜色都能支持，比较强大的是还有中心点、旋转度数、XY轴旋转、拖动类型等等。

最中间是 可视化工作台 ，可以对图片、视频和网页等素材进行尺寸、位置的简单编辑，完成一定的可视化操作。点击上方快捷工具栏的预览按钮或者是二维码，可以直接在电脑和手机预览案例。无需适配，无需导入手机，是不是比Axure更高效？

最右边是 对象树 ，好比PS的图层面板，可以进行对象的拖动、分组、删除、隐藏，还可以添加对象的运动轨迹、路径、事件等等。

iH5 3.0——功能强大的交互神器

看下面两张图，你就知道iH5 3.0是名不虚传的交互神器。交互不仅是点击翻页，还能有多种可能！

针对H5移动广告和网站应用，iH5 3.0有数十种交互的方式。什么720°全景互动、时间轴动画、序列帧动画、SVG、绘图互动、照片合成、游戏互动，iH5 3.0统统都能做。

除此之外，iH5的功能更新非常快，紧跟潮流趋势。比如，16年淘宝出了个造物节的720°全景H5，天猫出了个一镜到底H5，引起行业轰动。

iH5的技术人员在几周内就开发出一个全景组件，不用代码，半天就可以做出720°全景和一镜到底，满足了中小企业的传播需求。

以下案例就是用iH5 3.0制作的：

iH5 “事件”——让交互逻辑可视化

iH5是用“事件”来进行交互设置的，通过设置触发对象、触发条件、目标对象、目标动作来完成整个交互事件。这样就将复杂的交互逻辑可视化了，不需要敲代码，你也可以做出一个可交互的案例。

比如，你要设置点击按钮，时间轴动画播放。不用代码，只需要这样简单设置：

触发对象：按钮

触发条件：点击

目标对象：时间轴

目标动作：播放

当然，如果你要做测试题和小游戏等，还有高级的运算方式，比如：

• 并行触发：自定义事件

• 条件判断：与或非、包含、大于/等于/小于、类型（邮箱、身份证、手机等）

• 循环触发：条件循环、次数循环