最初,動(dòng)畫(huà)被認(rèn)為是一種美,但是現(xiàn)在,它們已成為使用戶交互變得流暢的非常強(qiáng)大的工具。 但是,基本原理沒(méi)有改變,并且隨著技術(shù)的進(jìn)步,我們有了更好的實(shí)現(xiàn)。 創(chuàng)建動(dòng)畫(huà)一直被認(rèn)為是網(wǎng)頁(yè)設(shè)計(jì)中最復(fù)雜的方面之一。
1.動(dòng)畫(huà)的主要目的是提高可用性
一個(gè)簡(jiǎn)單的動(dòng)畫(huà)實(shí)際上可以是一個(gè)很好的指導(dǎo)工具,可以幫助人們理解他們應(yīng)該單擊哪個(gè)按鈕,或者應(yīng)該在網(wǎng)頁(yè)設(shè)計(jì)中處于下一個(gè)位置。 許多設(shè)計(jì)師將簡(jiǎn)單的動(dòng)畫(huà)與用戶工具配對(duì)以單擊或滾動(dòng)。 如果正確使用動(dòng)畫(huà),則可以向用戶提供有價(jià)值的反饋。 您以錯(cuò)誤的方式多次填寫(xiě)了表格,并顯示一個(gè)消息框,突出顯示您的錯(cuò)誤并告訴您如何解決它們? 在經(jīng)過(guò)深思熟慮的操作可以指導(dǎo)用戶并向他們提供背景信息之后,您甚至有機(jī)會(huì)給用戶一個(gè)驚喜,使事情變得更加有趣和引人入勝。 在網(wǎng)頁(yè)設(shè)計(jì)中,如果您不以純粹的裝飾方式使用動(dòng)畫(huà),則動(dòng)畫(huà)實(shí)際上非常有用。 優(yōu)秀的UX和UI設(shè)計(jì)人員經(jīng)常使用動(dòng)畫(huà)來(lái)改善整個(gè)工作流程。
2.動(dòng)畫(huà)的第二種用途是美學(xué)
動(dòng)畫(huà)可以用作很好的裝飾。 動(dòng)畫(huà)的目標(biāo)通常是純視覺(jué)目標(biāo),在一定程度上是可以接受的。 裝飾性動(dòng)畫(huà)可以幫助在用戶和界面之間建立情感聯(lián)系。 動(dòng)畫(huà)還可以激發(fā)視覺(jué)吸引力,并確保您的用戶與您的網(wǎng)站保持較長(zhǎng)時(shí)間的聯(lián)系。 在創(chuàng)建具有純視覺(jué)效果的動(dòng)畫(huà)時(shí),請(qǐng)考慮該怎么做。 考慮您希望用戶具有哪種連接。 是有趣還是令人驚訝? 您是否要放置一些應(yīng)該共享的獨(dú)特內(nèi)容? 即使是純粹視覺(jué)的東西也應(yīng)該有一定的用途。
3.使用動(dòng)畫(huà)的另一個(gè)原因是傳達(dá)某種功能
動(dòng)畫(huà)可以是一個(gè)很好的工具,可以以直觀的方式向用戶顯示特定內(nèi)容的工作方式。 不要無(wú)緣無(wú)故地使用視差滾動(dòng)效果來(lái)犯一些錯(cuò)誤。
4.動(dòng)畫(huà)還可以幫助指導(dǎo)用戶
動(dòng)畫(huà)不僅用于動(dòng)畫(huà),而且還用于轉(zhuǎn)換。 它們可以幫助您的用戶理解該頁(yè)面,并引導(dǎo)他們到應(yīng)單擊的特定位置。
5.您可以使用它們顯示信息
除了提示功能外,您還可以使其成為顯示輔助信息的好工具。 例如,您可以讓用戶將鼠標(biāo)懸停在內(nèi)容上并顯示其他選項(xiàng)。 并且由于懸浮內(nèi)容的“隱藏”默認(rèn)狀態(tài),您只想將其用作輔助信息,對(duì)于想要瀏覽您的網(wǎng)站的用戶來(lái)說(shuō),沒(méi)有什么是真正重要的。 另外,請(qǐng)記住,在移動(dòng)設(shè)備上懸停不起作用。