幾年前隨著國內(nèi)移動互聯(lián)網(wǎng)的瘋狂式發(fā)展，催生了不勝其數(shù)的移動互聯(lián)網(wǎng)平臺，平臺類別涵蓋了生活的各方各面，有社交的、電商的、金融的、資訊的等等。在每個垂直領(lǐng)域下，都有N多個平臺之間相互競爭，這使得每個平臺都面臨著巨大的生存壓力，時刻逼迫著平臺經(jīng)營者們在其平臺的功能上進(jìn)行求同存異的掙扎。

 

在這種大環(huán)境下，設(shè)計師所要解決的需求越來越復(fù)雜，傳統(tǒng)的靜態(tài)頁面設(shè)計已無法引導(dǎo)越來越“不聽話”的用戶，我們需要在這種形勢中求變，才能時刻保持住設(shè)計師本該有的價值。而動效設(shè)計的運(yùn)用，可以較好的解決部分問題。那么，動效設(shè)計在實(shí)際工作中，究竟有哪些作用？我在自己的實(shí)際動效設(shè)計工作中，總結(jié)出了使用動效的6個實(shí)用之處：

以下再結(jié)合案例進(jìn)行較為詳細(xì)的說明

 

作用1

 

案例1：UC瀏覽器2018世界杯活動頁面

 

下圖為UC瀏覽器2018世界杯活動頁面，一般活動頁面會為了營造氛圍而把大感覺做的熱烈一點(diǎn)，在這種情況下就免不了會使用較多的暖色（暖色比冷色突出，一般會用暖色來突出重點(diǎn)），在一屏頁面暖色使用較多的情況下，如果想要突出【開寶箱區(qū)域】，且保證在「極短時間內(nèi)」能夠有效吸引到用戶注意顯得并不容易。因?yàn)橐粋€用戶留給一個頁面的時間往往只有苛刻的幾秒時間，如果不能在短短的兩三秒時間內(nèi)快速抓住用戶的眼球，讓用戶關(guān)注到我們?yōu)榱肆糇∷麄兌O(shè)計的功能點(diǎn)，那很可能就會流失掉這個用戶。

使用動效，可以有效的突出【開寶箱區(qū)域】，讓用戶能夠聚焦到我們想要讓他注意到的地方，讓用戶產(chǎn)生注意是第一步，只有用戶先注意到了，才能產(chǎn)生下一步的查看操作，誘其深入。

 

作用2

 

 

案例2：一般APP彈窗關(guān)閉
 

 

關(guān)于APP的彈窗，你可能會遇到這樣一個場景：在開啟APP之后的第一時間突然有一個彈窗出現(xiàn)在你的眼前，這種突如其來的“煩人”提示，會打斷你的思緒或操作，這會導(dǎo)致你的反感，你可能會無意識的「立刻」點(diǎn)擊關(guān)閉按鈕，但有時在關(guān)閉的瞬間又注意到了彈窗的內(nèi)容對你來說是有吸引的，如果這個時候因?yàn)檎`點(diǎn)關(guān)閉彈窗而不知道去哪里找彈窗內(nèi)容的鏈接入口，你是否會感到非常懊惱？

 

下圖為我在做平臺設(shè)計改版提案的時候提出的解決方案，當(dāng)彈窗關(guān)閉時，縮放成一個小點(diǎn)之后有一個路徑動畫，可以告知用戶彈窗關(guān)閉之后去了哪里，暗示用戶如果想找回彈窗內(nèi)的活動可以點(diǎn)擊哪里能找到。因此使用動效可以將兩個元素之間的關(guān)系進(jìn)行直觀的關(guān)聯(lián)演示，用最簡單的視覺表現(xiàn)方式說明其中的關(guān)系，增加產(chǎn)品易用性。（動效為我本人所做，但彈窗圖片“生活繳費(fèi)...”為網(wǎng)絡(luò)搜的替代圖，侵刪）

作用3：

 

案例3：淘寶首頁金剛區(qū)圖標(biāo)

 

對于寸土寸金的手機(jī)屏幕來說，思考著如何能在局限的區(qū)域范圍內(nèi)去展示更多的信息，一直是平臺運(yùn)營者們想要攻克的難題，也是設(shè)計師們需要幫助解決的難題。拿淘寶APP的首頁來說，其首頁金剛區(qū)的每一個入口，里面所承載的功能，單拎出來都可以作為一個功能完整的APP來使用。由此可見其中所投入的人力物力，如果入口無法得到點(diǎn)擊，那將會是多么巨大的資源浪費(fèi)，因此引流這件事就顯得尤為重要。但是單單一個入口圖標(biāo)+入口名稱，如何才能明白地將入口的誘人亮點(diǎn)告知用戶來吸引點(diǎn)擊？

 

使用動效可以在有限的區(qū)域面積內(nèi)，展示盡可能多的信息內(nèi)容，節(jié)約空間。如飛豬旅行的活動“送500券”，在這么狹小的空間無法將信息展示完全，使用動效可以解決信息展示問題，動效在吸引用戶注意力的同時，也將亮點(diǎn)信息進(jìn)行了展示。

作用4
 

 

案例4：天貓超市首頁

 

“生活家”整個模塊里的6個小模塊的信息是屬于同一層級的。因此在設(shè)計的時候，會選擇將信息進(jìn)行平鋪，因?yàn)闆]有哪一個小模塊是重點(diǎn)，所以在視覺上就沒有重點(diǎn)，這會導(dǎo)致很難引起用戶的注意，可能整個模塊都會被用戶直接忽視，或者視線只飄過其中某一個小塊，然后眼球又快速的移動離開去了其他的大模塊，不會完整的瀏覽完這個大模塊里的信息，這是我們運(yùn)營者所不希望發(fā)生的。那么我們是否能通過設(shè)計的手法去引導(dǎo)用戶看完整個模塊的信息？

 

使用動效在吸引用戶注意的同時，設(shè)定動效的播放順序，可以引導(dǎo)用戶逐個瀏覽完整個模塊，增加用戶在此處的停留時長。

作用5

 

案例5：加油寶APP

 

關(guān)于情感化設(shè)計，我一直在不斷的思考一個問題，情感化設(shè)計究竟能給產(chǎn)品帶來什么「實(shí)際」且「有效」的價值，能否真正的對數(shù)據(jù)轉(zhuǎn)化產(chǎn)生影響？在平時的工作中，我也在不斷的嘗試將情感化設(shè)計融入產(chǎn)品設(shè)計中，探索情感化設(shè)計對產(chǎn)品的真實(shí)價值。

 

下圖是我在之前求職一個金融平臺時所做的面試題，對“我的”頁面進(jìn)行改版設(shè)計。對于一般的金融平臺，用戶一般進(jìn)入“我的”頁面都是想要查看收益，針對這一個用戶需求點(diǎn)，我嘗試著將動效和情感化結(jié)合起來，讓數(shù)字快速翻滾，給用戶營造一種“豐收感”，加以情感化的設(shè)計，用動態(tài)的笑臉表情給予用戶一個正向積極的反饋，引導(dǎo)用戶的情緒讓其能更為強(qiáng)烈的感受到獲得收益的喜悅，讓用戶在投資收益的過程中感受到“愉悅”以鼓勵他們能夠持續(xù)甚至加大投入來享受更多的這種愉悅感。

 

作用6

 

案例6：花椒直播間

 

對于一些有用戶VIP體系的平臺來說，一般的VIP用戶都是平臺的高價值用戶人群，可以直接對平臺的營收產(chǎn)生轉(zhuǎn)化。在一些直播平臺里，VIP是一個非常重要的功能體系，因?yàn)閂IP較高的付費(fèi)率直接影響到整個平臺的營收，說是關(guān)乎直播平臺的生死存亡是一點(diǎn)都不為過，那么對于這部分高價值人群，我們又該如何鼓勵他們繼續(xù)保持這份「價值」？

 

一般來說，我們會給予高級用戶「特殊性」。什么是特殊性？即高級用戶的行為和一般用戶的行為區(qū)分開來，做特殊的處理。就好比坐飛機(jī)的頭等艙和經(jīng)濟(jì)艙，待遇是有差別的。下面舉的例子是花椒APP的直播間，高級用戶“小苔菜”進(jìn)場時，其名字入場提示以動效的方式進(jìn)入（普通用戶入場提示則是在彈幕里和普通發(fā)言一樣，很快被刷掉），這種特殊的對待方式可以讓高級用戶感受到其行為與普通用戶的差別，讓高級用戶感受到自己的獨(dú)特性，從而激勵他們持續(xù)在平臺進(jìn)行消費(fèi)以保持其高級的屬性。

 

結(jié)語

 

正如前面所說的，對于一些平臺來說，現(xiàn)在越來越繁雜的界面信息及功能架構(gòu)給設(shè)計師帶來了越來越多的設(shè)計難題，通過設(shè)計師的手段如何更好的解決這些問題，將復(fù)雜的問題簡單化的呈現(xiàn)在用戶面前，給用戶帶來更好的體驗(yàn)，為平臺轉(zhuǎn)化出更多的價值，是現(xiàn)在的設(shè)計師需要深入思考的問題。雖然動效設(shè)計可以一定程度上的解決某些問題，但請不要濫用，記住動效的使用原則應(yīng)當(dāng)是克制的，滿屏的動效亂飛，只會帶來適得其反的效果。