運(yùn)動(dòng)設(shè)計(jì)如何應(yīng)用于UI設(shè)計(jì)

一些聽起來很聰明的人會(huì)告訴你，動(dòng)畫是對(duì)靜止圖像的開發(fā)和管理，以產(chǎn)生運(yùn)動(dòng)的錯(cuò)覺。
用簡單的英語來說，它是在空間和時(shí)間中移動(dòng)的視覺元素的組合。

運(yùn)動(dòng)設(shè)計(jì)

自智能手機(jī)問世以來，動(dòng)作設(shè)計(jì)已成為至關(guān)重要的 UX 工具。如果使用得當(dāng)，它會(huì)讓使用技術(shù)感覺自然、反應(yīng)靈敏且更愉快。
向用戶界面添加動(dòng)作意味著做的不僅僅是裝飾。
動(dòng)畫是一種功能元素，用于為操作提供反饋并幫助用戶了解應(yīng)用程序的層次結(jié)構(gòu)和信息流。不用說，好的動(dòng)作設(shè)計(jì)可以讓你的應(yīng)用或網(wǎng)站在競爭中脫穎而出。

動(dòng)效設(shè)計(jì)在UI設(shè)計(jì)中的多功能應(yīng)用

用戶和界面之間的關(guān)系，無論是人類的還是數(shù)字的，總是結(jié)合一組動(dòng)作和反應(yīng)。
運(yùn)動(dòng)設(shè)計(jì)增強(qiáng)并促進(jìn)了這些動(dòng)作與用戶端預(yù)期反應(yīng)之間的聯(lián)系。

輕松過渡

如果屏幕之間的轉(zhuǎn)換需要很長時(shí)間，用戶就會(huì)開始失去焦點(diǎn)。
動(dòng)效設(shè)計(jì)幫助用戶了解屏幕之間的應(yīng)用流程，使導(dǎo)航更輕松、更吸引人。
在過渡中使用運(yùn)動(dòng)設(shè)計(jì)的另一種方法是在加載期間。為什么不用有趣的動(dòng)畫來縮短等待時(shí)間呢？當(dāng)設(shè)備下載必要的數(shù)據(jù)時(shí)，動(dòng)畫有助于保持用戶的注意力。

參與微交互

微交互是用于與用戶創(chuàng)建互動(dòng)時(shí)刻的事件。
您可以在所有應(yīng)用程序和網(wǎng)站上找到這些微交互。大多數(shù)情況下，動(dòng)畫以引發(fā)反應(yīng)的觸發(fā)器（用戶操作）開始，讓用戶知道發(fā)生了什么，從而使應(yīng)用程序或網(wǎng)站內(nèi)的導(dǎo)航更容易。
這些微交互可以在沒有任何動(dòng)畫的情況下發(fā)生，但運(yùn)動(dòng)設(shè)計(jì)在這里出現(xiàn)的目的是使這種交互更加有趣和引人入勝。

俏皮的品牌

在動(dòng)畫的幫助下，我們可以為品牌的形象定下基調(diào)——有趣、好玩、專業(yè)等。動(dòng)畫的作用是成為個(gè)性的助推器。
通過動(dòng)畫，設(shè)計(jì)師可以喚起情感。 當(dāng)我們想到一個(gè)人時(shí)，我們會(huì)自動(dòng)將他們與他們說話、走路、笑的方式等聯(lián)系起來。正是這個(gè)人的個(gè)性讓他們難忘。 同樣的邏輯也適用于品牌。

只是為了好玩的動(dòng)畫

當(dāng)然，動(dòng)畫也可以只是裝飾性的——只要它們不會(huì)對(duì)用戶體驗(yàn)產(chǎn)生負(fù)面影響。

何時(shí)（不）使用動(dòng)畫？

從我們開始看到構(gòu)成應(yīng)用程序或網(wǎng)站的元素的那一刻起，我們的第一直覺可能就是為所有內(nèi)容設(shè)置動(dòng)畫！ 這行不通。我再說一遍：這行不通。
運(yùn)動(dòng)設(shè)計(jì)出現(xiàn)在界面設(shè)計(jì)中，是一種增強(qiáng)用戶體驗(yàn)的工具，而不是一種分散注意力的策略。 作為第一步，了解動(dòng)畫在哪些情況下可能有用很重要，因此首先要確定主要問題。

提高可用性

使用動(dòng)畫的應(yīng)用程序和網(wǎng)站通常感覺復(fù)雜且質(zhì)量更高。
單擊按鈕時(shí)，用戶希望看到該操作的確認(rèn)。 動(dòng)態(tài)設(shè)計(jì)將這種期望實(shí)現(xiàn)帶入了數(shù)字領(lǐng)域，增強(qiáng)了可用性，讓用戶真正感受到他們正在與應(yīng)用程序交互。

增加交互速度

現(xiàn)代用戶正在尋求快速高效的信息消費(fèi)，并沒有準(zhǔn)備好等待。 運(yùn)動(dòng)可以作為立即傳遞信息的解決方案——或者至少給用戶留下印象。

正如我們之前所說，加載時(shí)間會(huì)破壞用戶體驗(yàn)，而動(dòng)畫過渡可以幫助解決問題。 借助引人入勝的動(dòng)畫加載器，您可以營造一種用戶正在節(jié)省時(shí)間、吸引他們的注意力并專注于動(dòng)畫的印象。

如果我們?cè)谶@段時(shí)間內(nèi)取悅用戶，我們實(shí)際上是在加快交互速度，讓用戶更有耐心。

提供獨(dú)特體驗(yàn)

運(yùn)動(dòng)設(shè)計(jì)是提供獨(dú)特體驗(yàn)的有用資源。 流暢的動(dòng)畫和歡樂的動(dòng)畫可以讓你的應(yīng)用脫穎而出，提高用戶的滿意度。
最后，一切都關(guān)乎用戶的幸福。 如果您可以借助動(dòng)作設(shè)計(jì)讓他們更快樂，那么您就做對(duì)了。

好用的運(yùn)動(dòng)設(shè)計(jì)工具

就像動(dòng)作設(shè)計(jì)作為創(chuàng)建用戶界面設(shè)計(jì)的重要組成部分不斷發(fā)展一樣，創(chuàng)建它的軟件也在不斷發(fā)展。
這些是創(chuàng)建運(yùn)動(dòng)設(shè)計(jì)的幾個(gè)選項(xiàng)，根據(jù)我在 Infinum 所做的項(xiàng)目，這些對(duì)于創(chuàng)建最佳交互是最重要的。