PIXATE是一款全平臺的動效設(shè)計神器,這款軟件可以幫助設(shè)計師和開發(fā)者方便開發(fā)出動感、漂亮的原生移動界面。Pixate能通過簡單的方式實現(xiàn)基本動畫,和工程師可以通過具體的數(shù)值對接,能滿足大部分的業(yè)務(wù)需求。但對于較復(fù)雜的非圖片式動畫還是力不從心。對于不追求更復(fù)雜動畫和交互的設(shè)計師可以考慮嘗試~
軟件介紹:
利用這款純原生移動應(yīng)用原型開發(fā)和測試工具,設(shè)計師可以在瀏覽器上模擬復(fù)雜交互,包括拖放、滾動、長按、點擊等,同時通過移動端的 app 可以實時觀看原型的交互效果。由于 CSS 技術(shù)的配置靈活性,開發(fā)者不必每次在添加新的圖形元素時都要對應(yīng)用進(jìn)行重建,從而極大地方便了界面的開發(fā)和應(yīng)用部署。通過這種原型開發(fā)方式設(shè)計師可以實現(xiàn)快速迭代開發(fā),及時將原型提交給項目經(jīng)理等相關(guān)人員審核修改,從而縮短了交付給工程團(tuán)隊進(jìn)行下一步開發(fā)的時間。
因此可以用說 Pixate 是一個面向設(shè)計師的原型設(shè)計平臺。近期其主要工作仍聚焦在原型開發(fā)上。但是未來有計劃去改進(jìn)設(shè)計與工程的交接流程,從而令設(shè)計師的工作更加順暢。
PIXATE優(yōu)勢:
優(yōu)點1:適合設(shè)計師的思維方式
QC的好處是可以比較方便的和程序猿對接,很多動效的實現(xiàn)邏輯和前端的代碼邏輯是相通的。也就是說,使用QC雖然不需要寫代碼,但歸根結(jié)底還是猿類的思維方式,對于我們這些一點代碼不懂,邏輯能力又不是特別好的小小設(shè)計師來說,還是有些門檻的?吹綕M屏的連接線,就讓人有點望而卻步,搞不清其中的邏輯。
作為設(shè)計師,無論是交互還是視覺,無論是用PS、AI還是用Axure、Sketch,我們最最熟悉的一個概念,就是圖層了。而Pixate的操作方式,同樣也是圖層的概念。Pixate的界面,乍一看有點像PS呢。
如上圖所示,左上角是圖層區(qū),我們可以將視覺稿或是高保真的交互稿切圖后導(dǎo)入Pixate中,所有的圖層按照前后順序出現(xiàn)在圖層區(qū)中,與PS一樣,上層的圖片會覆蓋在下層的圖片上,圖層還可以設(shè)置成組。歷史記錄區(qū)域也與PS很相似,記錄最近的20步操作。值得注意的是,Pixate是隨時保存的,如果操作了一堆之后,想要退回到20步以后,就再也回不去了…左下角是手勢交互和動畫區(qū)域,包括常用的手勢操作(拖拽、單擊、雙擊、長按、旋轉(zhuǎn)、縮放、滾動)和常見的動效(移動、縮放、旋轉(zhuǎn)、漸隱漸顯、變色、改變圖片、重復(fù)),我們可以將這些手勢或是動效直接拖拽到圖層上,圖層就會實現(xiàn)相應(yīng)的效果。界面右側(cè)則是對圖層屬性和交互和動畫屬性的設(shè)置。圖層屬性可以用來設(shè)置圖片的大小、位置、透明度等。重頭戲是右下角的交互和動畫屬性設(shè)置,通過設(shè)置這些參數(shù),可以將手勢和相應(yīng)的動畫連接起來,連接完成后,一個可以操作、可以交互的原型就制作好了。
那這些參數(shù)該如何調(diào)呢?這里給出幾個練習(xí)的鏈接,大家做幾個實例之后,就會得心應(yīng)手了。
優(yōu)點2:實時預(yù)覽,可交互
Pixate的另一個優(yōu)點就是可以實時預(yù)覽,并且是可以在手機(jī)上實時操作和預(yù)覽。只需在手機(jī)上下載Pixate的app,iOS和Android都可以下載,通過wifi或是數(shù)據(jù)線連接電腦,就可以實時看到預(yù)覽效果了。如果懶得連手機(jī),也可以在模擬器上預(yù)覽效果。
優(yōu)點3:全平臺
你可以online使用,也可以在Mac或是Windows上下載使用。Pixate支持多款iOS和Android機(jī)型,甚至支持Apple Watch、LG G Watch和Moto 360三款智能手表,可以說是全平臺覆蓋。
說了那么多優(yōu)點,Pixate也有一些缺點。它還是更適合做頁面級的動畫,對于需要形變、非常細(xì)膩的復(fù)雜動畫,有些無能為力。所以Pixate更適合交互設(shè)計師來表達(dá)界面邏輯,而更加生動有趣的loading或是彩蛋,還是交給視覺大神們,用Flash或是AE來做吧。