英文：ackmanndickenson
譯者：攜程設(shè)計(jì)委員會(huì) - 許嘉智
隨著“響應(yīng)式Web設(shè)計(jì)”以及“Google提升移動(dòng)友好性設(shè)計(jì)” 持續(xù)升溫，在過(guò)去的一年開(kāi)始流行的一些UI/UX設(shè)計(jì)趨勢(shì)，將會(huì)在新的一年里繼續(xù)流行下去。鑒于此，我總結(jié)了一下在2016年仍會(huì)持續(xù)大熱的一些UI/UX設(shè)計(jì)趨勢(shì)。
1. 動(dòng)畫(huà)
動(dòng)畫(huà)的使用效果是提升用戶(hù)體驗(yàn)并且彰顯網(wǎng)站/應(yīng)用的個(gè)性，但是要把握好動(dòng)畫(huà)如何表達(dá)和何時(shí)使用動(dòng)畫(huà)，倆者之間的平衡是很難去區(qū)分的。千萬(wàn)不要為了要有動(dòng)畫(huà)而做動(dòng)畫(huà)；要有一個(gè)目標(biāo)，使動(dòng)畫(huà)能夠真正的增強(qiáng)內(nèi)容的展現(xiàn)效果。在我的經(jīng)驗(yàn)里面，好的動(dòng)畫(huà)是細(xì)小而微妙的。一個(gè)有愛(ài)的動(dòng)畫(huà)，能夠讓用戶(hù)明白設(shè)計(jì)師是為了他們而去想的，以及知道設(shè)計(jì)師花了時(shí)間，只為創(chuàng)造一個(gè)獨(dú)特而個(gè)性化的體驗(yàn)。
下圖便是一個(gè)好例子印證了適當(dāng)?shù)募虞d動(dòng)畫(huà)如何提升用戶(hù)體驗(yàn) (via the Slack app)：
2. Material Design-比扁平化更具沉浸感的體驗(yàn)
Material design是一個(gè)UI界的后起之秀，它沿襲了扁平化設(shè)計(jì)的一些設(shè)計(jì)原則，比如鮮明的色彩搭配、簡(jiǎn)潔、大字體、簡(jiǎn)約等等，然后在此基礎(chǔ)上增加了陰影、模糊、覆蓋和深度等元素。這種設(shè)計(jì)給人一種更輕便且舒暢的感覺(jué)，并進(jìn)一步增強(qiáng)了用戶(hù)的交互體驗(yàn)。谷歌就是用這個(gè)原理打造他們的整個(gè)平臺(tái)的產(chǎn)品和app。以下這個(gè)網(wǎng)站就是個(gè)好例子印證了這個(gè)UX設(shè)計(jì)趨勢(shì)。
3. Web應(yīng)用無(wú)差別的感官體驗(yàn)
用戶(hù)在用不同的平臺(tái)想要體驗(yàn)的是統(tǒng)一的界面元素。當(dāng)越來(lái)越多的原生應(yīng)用出現(xiàn)，讓?xiě)?yīng)用無(wú)論基于Web還是基于原生iOS/Android都能交付無(wú)差別的用戶(hù)體驗(yàn)就變得越來(lái)越重要。著名圖片分享站Pinterest為我們提供了一個(gè)完美的范例：
4. 穩(wěn)健的用戶(hù)透明度
IE的透明性從一開(kāi)始就做得比較好，尤其是針對(duì)C-Suite、營(yíng)銷(xiāo)人員以及利益相關(guān)者。他們給客戶(hù)一個(gè)能更好地了解如何使用的外觀(guān)和感覺(jué)。創(chuàng)建介于用戶(hù)界面和用戶(hù)體驗(yàn)之間的內(nèi)部線(xiàn)框圖能夠從開(kāi)始階段起就為客戶(hù)提供更加豐富和準(zhǔn)確的線(xiàn)框。當(dāng)然你可以說(shuō)它們只是半成品，并不能代表完全的成品。我認(rèn)為這樣將會(huì)誤導(dǎo)你的客戶(hù)，使他們對(duì)設(shè)計(jì)變得迷惑。
5. 高保真線(xiàn)框
要想打動(dòng)你的用戶(hù)，以下是幾種可以增加你的UI/UX體驗(yàn)的表達(dá)手法：
使用真實(shí)圖像而不是灰框（即使不是完全真實(shí)的圖像）
使用最終要用的字體效果
讓標(biāo)題和尺寸和最終效果一致
在用戶(hù)界面上你不需要想太遠(yuǎn)，把這些元素?cái)U(kuò)大是一個(gè)好方法，利用原本元素，做成能夠向客戶(hù)表達(dá)的效果。
當(dāng)然，并不是說(shuō)你遵循了上面的原則就一定能打動(dòng)你的用戶(hù)，你還需要具備額外的技能，而不是一步登天；無(wú)論面對(duì)何種項(xiàng)目，用你的最佳判斷和對(duì)用戶(hù)需求的理解都是最最重要的。
本文分享自攜程設(shè)計(jì)委員會(huì)
聯(lián)系客服
