想用HTML5實(shí)現(xiàn)各種可互動(dòng)動(dòng)畫、動(dòng)效甚至游戲的移動(dòng)APP設(shè)計(jì)師，卻苦于不會(huì)代碼的；

不過從今天開始，25學(xué)堂帶你認(rèn)識(shí)一款無代碼做動(dòng)效神器Hype3的入門教程。

也是目前大部分APP設(shè)計(jì)師最愛的HTML5制作工具和動(dòng)效神器——Hype3

Hype3是一款不需要掌握編程知識(shí)就能制作出HTML 5復(fù)雜動(dòng)畫效果的Mac網(wǎng)頁設(shè)計(jì)軟件。Hype 3采用全新 UI 設(shè)計(jì)，增加了24種功能。首次運(yùn)行時(shí)，應(yīng)用會(huì)提供一些功能概覽、使用教程以及各種新技巧等知識(shí)，用戶可以點(diǎn)擊右側(cè)的功能進(jìn)行查看。

hype官網(wǎng)地址：http://tumult.com/hype/

很不幸的這款非常棒的工具只能在MAC版電腦上使用。

25學(xué)堂想作為一名優(yōu)秀的APP設(shè)計(jì)師，肯定特別希望自己能夠真正獨(dú)立“精益”一把，不需要依賴開發(fā)，能夠把你的設(shè)計(jì)原型100%還原成產(chǎn)品，哪怕只是一個(gè)細(xì)微的動(dòng)效。

而且非?？春肏YPE這個(gè)軟件，配上Sketch簡直可以說無敵（當(dāng)然還有一些bug希望在后續(xù)版本中能夠改善），最后，這個(gè)軟件是付費(fèi)的，專業(yè)版要人民幣600多，暫時(shí)沒看到破解的方法，不過作為有節(jié)操的設(shè)計(jì)師，在用完試用期之后，我想我會(huì)付費(fèi)去繼續(xù)使用的。

當(dāng)然也有破解版：http://www.xdowns.com/soft/184/apple/2015/Soft_139362.html

APP設(shè)計(jì)師最愛的HTML5制作工具和動(dòng)效神器—HYPE的好處有：

1、無需代碼，像AE一樣使用時(shí)間軸就做可互動(dòng)的動(dòng)畫（如上圖）

2、PC、手機(jī)、pad端都可以直接訪問（以web的形式），也可以導(dǎo)出視頻或者GIF

3、3.0版還有物理特性和彈性曲線，可以發(fā)揮更強(qiáng)大的動(dòng)畫效果

4、對(duì)中國人來講，它原生支持中文這一點(diǎn)也非常棒！

5、所見即所以及手機(jī)移動(dòng)需求的完美支持。

下面我們就來跟隨木木Hype教室 的3節(jié)課來認(rèn)真的進(jìn)行HYPE入門學(xué)習(xí)吧！

第一期：零代碼搞定H5動(dòng)畫【木木Hype教室】 ?初遇Hype3

第二期：零代碼搞定H5動(dòng)畫【木木Hype教室】 ?熟悉Hype3

第三期：零代碼搞定H5動(dòng)畫【木木Hype教室】 ?Hype3 深入進(jìn)階

在此25學(xué)堂也非常感謝靜電和木木兩位老師的辛勤奉獻(xiàn)！希望這3個(gè)非常棒的Hype3入門教程是各位APP設(shè)計(jì)師新的征程!