Loading作為一個常見，并且?guī)в信潘缘膭赢?，已?jīng)被各路大神表現(xiàn)的淋漓盡至。那么如何在眾優(yōu)秀作品下，做出一個性化的Loading動畫？
Loading種類：
1.狀態(tài)類（進(jìn)度條）：通常數(shù)據(jù)量很大，客戶端已知加載量，并能根據(jù)當(dāng)前加載速度計算出何時加載完成。
狀態(tài)型的Loading以進(jìn)度條類為基準(zhǔn)，可以為用戶提供預(yù)期時間，多伴隨百分比進(jìn)度出現(xiàn)。進(jìn)度條的形式以線性的形式出現(xiàn)，已知總量，降低用戶對期待時間的感受。無聊的等待會讓人厭煩，作為一個UI設(shè)計師需要關(guān)注每一個細(xì)節(jié)，尤其是用戶的情緒并將引導(dǎo)到加載后的頁面。
By Piotr Adam Kwiatkowski
2.無狀態(tài)類（菊花）：通常數(shù)據(jù)量比較小，客戶端無法預(yù)知加載量。
無狀態(tài)類的Loaing以菊花為代表，通常都是一組可以無限循環(huán)播放的動畫。
無狀態(tài)類的Loaing如有需要可以做的特別一些：https://dribbble.com/search?q=loading
我們的App需要一個無狀態(tài)的Loading。
我始終相信設(shè)計的直覺很重要，抓住直覺的爆發(fā)點(diǎn)，是一個成熟設(shè)計師必備的素質(zhì)。于是先按照最初的想法快速做了一版。
相信很多人對這個Loaing眼熟，當(dāng)然，這肯定不是我們要的效果，不過在制作這Loading的時候不斷的推翻自己的想法，時而清醒時而模糊，感覺突然找到了方向但瞬間也可能煙消云散。這種不斷反復(fù)的過程中還是收獲了很多。
既然是無限，循環(huán)，表現(xiàn)上就不能過于缺乏趣味，這個度很難把握。形式感上面設(shè)計要簡單，又要通過最直接的方法創(chuàng)造空間感，偶然間發(fā)現(xiàn)馬戲團(tuán)的拋球表演。突然間有了靈感，于是就沿著這個思路開始動手設(shè)計：
我嘗試去直接模仿拋棄的運(yùn)動，但是效果并不是很好，但是從Demo中可以看出，值得很入研究。
為此我們搜索了一下現(xiàn)實(shí)中的扔球效果：
經(jīng)過分析我們得出了第一條小球的運(yùn)動路經(jīng)是一個無限的符號。
工作路經(jīng)確定后，導(dǎo)入C4D中進(jìn)行單球運(yùn)動軌跡測
由于實(shí)例中，小球會受到重力以及加速度的影響，并非勻速運(yùn)動，但在實(shí)際Loading制作過程中，為了視覺效果，我們希望小球做勻速運(yùn)動
發(fā)現(xiàn)問題：小球在中心焦點(diǎn)位置出現(xiàn)明顯卡頓
起初我們認(rèn)為是速度曲線沒有調(diào)整好所導(dǎo)致的，但我們嘗試幾版后發(fā)現(xiàn)并不是這樣，最后我們發(fā)現(xiàn)導(dǎo)致這個問題的原因是路經(jīng)節(jié)點(diǎn)問題。
調(diào)整節(jié)點(diǎn)
通過調(diào)整節(jié)點(diǎn)后，不難發(fā)現(xiàn)，中心焦點(diǎn)處的卡頓明顯不見了
為了加強(qiáng)透視效果，我們將球的大小和顏色進(jìn)行了關(guān)鍵幀處理，這已處理增加的景深對視覺的沖擊，使得空間感更強(qiáng)了。
看起來怪怪的。。。。。
為了使整個運(yùn)動規(guī)律更加精準(zhǔn)，我們發(fā)現(xiàn)運(yùn)動的起點(diǎn)距離是關(guān)鍵，不懈的追求完美的情況下，總是會有頓悟的時刻，幸運(yùn)的是找到了問題的所在
三個球勻速運(yùn)動的情況下，應(yīng)該保證每相鄰兩個球之間路經(jīng)上的距離是相同的。
藍(lán)藍(lán)設(shè)計( www.cqzjtgb.com )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)