隨著技術(shù)的快速發(fā)展,動(dòng)畫不僅視覺奢華士骤,更是用戶期望的功能需求范删。動(dòng)畫解決了界面中的許多功能問題,使交互生動(dòng)起來拷肌,真正地響應(yīng)用戶到旦。
下面讓我們來探索下提高移動(dòng)界面功能和情感力量的關(guān)鍵動(dòng)畫策略。
1巨缘、系統(tǒng)狀態(tài)
在應(yīng)用后臺(tái)通常都會(huì)有很多進(jìn)程添忘,例如正在從服務(wù)器下載數(shù)據(jù),正在進(jìn)行計(jì)算等等若锁。這樣的進(jìn)程總是需要一定時(shí)間搁骑,所以你要讓你的用戶知道應(yīng)用沒有卡住,并且顯示出它正在處理的狀態(tài)。這種視覺信號(hào)能夠給用戶一種正在控制應(yīng)用的感覺仲器。
加載狀態(tài)
每個(gè)應(yīng)用的加載時(shí)間都不可避免煤率。雖然動(dòng)畫不能解決這個(gè)問題,但是它們能夠可以讓等待變得沒那么無聊乏冀。
“當(dāng)我們不能縮短距離時(shí)涕侈,我們可以讓等待更加愉快∶罕妫”
有創(chuàng)意的進(jìn)度顯示能夠減輕用戶對(duì)等待的感覺。動(dòng)畫會(huì)影響用戶對(duì)你產(chǎn)品的看法木张,使它看起來比實(shí)際上要好众辨。
下拉刷新
大家應(yīng)該都知道“下拉刷新”這個(gè)動(dòng)畫,它啟動(dòng)了移動(dòng)設(shè)備上的內(nèi)容更新過程舷礼。
提示:下拉刷新動(dòng)畫應(yīng)該符合應(yīng)用設(shè)計(jì)規(guī)范鹃彻,如果應(yīng)用程序最小,那動(dòng)畫也要妻献。
通知
移動(dòng)的物體很容易吸引你的注意蛛株,所以在通知上加動(dòng)畫是一種友好的通知方式
2.導(dǎo)航和過渡狀態(tài)
動(dòng)畫最基本的使用時(shí)轉(zhuǎn)換。這種類型的動(dòng)畫背后的邏輯是幫助用戶了解頁面布局剛剛發(fā)生的變化育拨,觸發(fā)更改的內(nèi)容以及如何再次啟動(dòng)更改谨履。一個(gè)典型的例子是一個(gè)抽屜導(dǎo)航來切換隱藏的內(nèi)容。
抽屜導(dǎo)航可能是這種場(chǎng)景下最好的選擇熬丧,但其實(shí)還有很多種導(dǎo)航動(dòng)畫笋粟、
傳遞導(dǎo)航的上下文
設(shè)計(jì)師用動(dòng)畫來平滑地切換導(dǎo)航,并解釋屏幕上元素的排列的變化
元素之間的視覺分層和連接
動(dòng)畫非常適合描述界面的對(duì)象析蝴,并說明它們之間的相互作用
功能改變
在某些情況下害捕,設(shè)計(jì)師被迫設(shè)計(jì)一個(gè)在特定條件下其功能發(fā)生變化的動(dòng)作按鈕。我們經(jīng)常在整體空間有限的移動(dòng)設(shè)計(jì)中看到這一點(diǎn)闷畸。
這種類型的動(dòng)畫顯示了當(dāng)用戶與其進(jìn)行交互時(shí)元素如何更改尝盼。在下面的例子中,當(dāng)用戶按浮動(dòng)動(dòng)作按鈕時(shí)佑菩,加號(hào)轉(zhuǎn)換成鉛筆盾沫。這表明鉛筆是主要的創(chuàng)作方法。這么小的細(xì)節(jié)意味著不得不猜測(cè)接下來會(huì)發(fā)生什么殿漠,并知道這個(gè)圖標(biāo)在任何一個(gè)狀態(tài)下是什么意思疮跑。
3.視覺反饋
視覺反饋對(duì)于任何用戶界面至關(guān)重要。它使用戶感覺到控制凸舵,對(duì)于用戶來說祖娘,控制意味著在任何給定的時(shí)間知道和理解系統(tǒng)中的當(dāng)前上下文。
識(shí)別性
用戶界面元素(如按鈕和控件)應(yīng)顯示為實(shí)體,即使它們位于一層玻璃幕后面渐苏。
“在物理世界中掀潮,按鈕,控件和其他對(duì)象根據(jù)我們與他們的交互響應(yīng)琼富。人們期望用戶界面控件具有類似的響應(yīng)能力仪吧。”
為了彌合差距鞠眉,視覺和運(yùn)動(dòng)應(yīng)該立即反饋薯鼠,并以直觀的動(dòng)畫顯示。
可視化操作的結(jié)果
動(dòng)畫可以增強(qiáng)每個(gè)交互點(diǎn)械蹋,并加強(qiáng)用戶執(zhí)行的動(dòng)作出皇。
在Stripe的示例中,當(dāng)用戶點(diǎn)擊“付款”時(shí)哗戈,會(huì)在應(yīng)用程序顯示成功狀態(tài)之前短暫顯示一個(gè)微調(diào)郊艘。復(fù)選標(biāo)記動(dòng)畫使用戶感覺到他們很容易完成付款,用戶也很喜歡這樣重要的細(xì)節(jié)唯咬。
結(jié)論
當(dāng)以復(fù)雜的方式使用時(shí)纱注,動(dòng)畫是強(qiáng)大的。它把設(shè)計(jì)帶進(jìn)生活里胆胰,甚至使用戶進(jìn)行最常規(guī)的任務(wù)狞贱,當(dāng)然也可以讓您從人群中脫穎而出。精心設(shè)計(jì)的動(dòng)畫能提升用戶體驗(yàn)蜀涨。
——————