UI界面设计 ·

APP设计师最爱的HTML5制作工具和动效神器【Hype3】

想用HTML5实现各种可互动动画、动效甚至游戏的移动APP设计师,却苦于不会代码的;

不过从今天开始,25学堂带你认识一款无代码做动效神器Hype3的入门教程。

也是目前大部分APP设计师最爱的HTML5制作工具和动效神器——Hype3

Hype3是一款不需要掌握编程知识就能制作出HTML 5复杂动画效果的Mac网页设计软件。Hype 3采用全新 UI 设计,增加了24种功能。首次运行时,应用会提供一些功能概览、使用教程以及各种新技巧等知识,用户可以点击右侧的功能进行查看。

HTML5制作工具 hype 3

hype官网地址:http://tumult.com/hype/

很不幸的这款非常棒的工具只能在MAC版电脑上使用。

25学堂想作为一名优秀的APP设计师,肯定特别希望自己能够真正独立“精益”一把,不需要依赖开发,能够把你的设计原型100%还原成产品,哪怕只是一个细微的动效。

而且非常看好HYPE这个软件,配上Sketch简直可以说无敌(当然还有一些bug希望在后续版本中能够改善),最后,这个软件是付费的,专业版要人民币600多,暂时没看到破解的方法,不过作为有节操的设计师,在用完试用期之后,我想我会付费去继续使用的。

当然也有破解版:http://www.xdowns.com/soft/184/apple/2015/Soft_139362.html

 

Hype 界面

 

APP设计师最爱的HTML5制作工具和动效神器—HYPE的好处有:

1、无需代码,像AE一样使用时间轴就做可互动的动画(如上图)

2、PC、手机、pad端都可以直接访问(以web的形式),也可以导出视频或者GIF

3、3.0版还有物理特性和弹性曲线,可以发挥更强大的动画效果

4、对中国人来讲,它原生支持中文这一点也非常棒!

5、所见即所以及手机移动需求的完美支持。

 

下面我们就来跟随木木Hype教室 的3节课来认真的进行HYPE入门学习吧!

 

第一期:零代码搞定H5动画【木木Hype教室】  初遇Hype3

 

第二期:零代码搞定H5动画【木木Hype教室】  熟悉Hype3

 

第三期:零代码搞定H5动画【木木Hype教室】  Hype3 深入进阶

 

在此25学堂也非常感谢静电和木木两位老师的辛勤奉献!希望这3个非常棒的Hype3入门教程是各位APP设计师新的征程!

参与评论