APP軟件UI設(shè)計(jì)中注意的10個(gè)設(shè)計(jì)誤區(qū)

無論你所設(shè)計(jì)的 APP 是哪種類型，設(shè)計(jì)上的錯(cuò)誤一旦被采用，會(huì)對產(chǎn)品導(dǎo)致致命的結(jié)果。用戶始終希望他們所下載的應(yīng)用是有趣而好用的，希望它美觀，同時(shí)能提供優(yōu)秀的交互體驗(yàn)，也正是在這樣的期待下，任何錯(cuò)誤都會(huì)被明顯放大。

正是作為設(shè)計(jì)師的我們太過于接近每一個(gè)設(shè)計(jì)項(xiàng)目，我們熟知每一個(gè)設(shè)計(jì)背后的原理和規(guī)則，反而更容易忽略那些普通用戶更在意的問題和痛點(diǎn)。今天的文章我們來聊聊那些 APP 設(shè)計(jì)過程中最常見的錯(cuò)誤和尷尬，讓UI和UX設(shè)計(jì)師們真正規(guī)避開這些雷區(qū)。

1、糟糕的第一印象

好的應(yīng)用應(yīng)當(dāng)給人以良好的第一印象。毫無疑問，如果用戶在APP的下載頁或者第一次打開APP的時(shí)候，就覺得這個(gè)APP 看起來不舒服、不符合預(yù)期或者用起來不爽，用戶自然是不會(huì)再打開，甚至?xí)⒖虅h除的。第一印象至關(guān)重要。

設(shè)計(jì)和開發(fā)應(yīng)當(dāng)確保主屏加載速度足夠快，而且UI設(shè)計(jì)也應(yīng)該讓用戶容易理解，用色彩也控件告訴他們，這里都有啥，他們能干啥。盡量在一開始就展現(xiàn)出APP的特色，讓用戶看到讓他們繼續(xù)使用的理由。

APP最主要的交互應(yīng)當(dāng)簡單且易于操作的，應(yīng)用內(nèi)的控件和細(xì)節(jié)也應(yīng)足以反映品牌視覺的特征，并且以整齊有序的方式展現(xiàn)出來。

2、沒有有效的引導(dǎo)和線索

你的APP是用來干什么的？你的APP是如何同用戶進(jìn)行交流和溝通的？

每個(gè)APP中，視覺線索是重要的組成部分，它們告訴用戶應(yīng)該如何操作，應(yīng)該向哪里瀏覽，哪些控件可以操作，甚至哪些操作可能會(huì)帶來在哪些結(jié)果。所以，這里一定會(huì)涉及到信息的視覺化，所以這些視覺線索的設(shè)計(jì)應(yīng)當(dāng)遵循一定的規(guī)則：

·色彩：鮮艷的色彩更抓眼球，適宜于可點(diǎn)擊的元素使用

·空間：在關(guān)鍵元素周圍留下足夠的空間，讓用戶更容易發(fā)現(xiàn)，也更容易操作

·排版：使用簡單干凈的字體（盡量使用筆畫粗細(xì)統(tǒng)一的字體），并且挑選適合屏幕的字體，確保整體可讀性。

3、雜亂的設(shè)計(jì)

許多應(yīng)用最大的敗筆就是混亂。而這種混亂最常見的形態(tài)，就是設(shè)計(jì)師將這個(gè)應(yīng)用中幾乎所有的組件都塞到同一個(gè)界面中，無論它是一款游戲、工具或新聞?lì)惖膽?yīng)用。

所以，別這么做。

APP 主要還是為小屏幕所設(shè)計(jì)的，試圖在一個(gè)界面上承載過多類型的內(nèi)容，對于用戶而言是極大的負(fù)擔(dān)。

將每一屏都視作一個(gè)單獨(dú)的容器，每個(gè)容器承載不同的內(nèi)容，切換界面，呈現(xiàn)不同的內(nèi)容。當(dāng)內(nèi)容足夠引人入勝的時(shí)候，用戶會(huì)不自覺的滑動(dòng)，切換，干凈整潔、組織完善的布局則確保了整體體驗(yàn)的一致和便捷性。

4、小而密集的元素

元素靠的太近，或者過小了會(huì)讓手指粗壯的用戶非常難于操作。從某種意義上來說，巨屏手機(jī)的出現(xiàn)和這種體驗(yàn)訴求不無關(guān)系。

確保每個(gè)元素周圍保留足夠的空間和間隙，不僅僅方便用戶點(diǎn)擊，而且能夠消除誤觸的情況。并沒有一個(gè)萬能的公式來幫你控制控件和間隙的比例，不過當(dāng)你注意到這個(gè)問題的時(shí)候，通常不會(huì)犯錯(cuò)。

我通常會(huì)找一個(gè)手大的朋友，把他的食指按在屏幕上劃出區(qū)域。按鈕并不一定必須同這個(gè)區(qū)域一樣大，但是觸發(fā)按鈕的范圍不能比這個(gè)區(qū)域小，接近就好了。

也正是因此，卡片式設(shè)計(jì)對于用戶而言是相當(dāng)友好的設(shè)計(jì)。只需要點(diǎn)擊卡片所在的區(qū)域范圍內(nèi)，就能觸發(fā)其中的內(nèi)容。

5、非標(biāo)準(zhǔn)的圖標(biāo)或操作

對于許多設(shè)計(jì)項(xiàng)目而言，重新設(shè)計(jì)圖標(biāo)并沒有那個(gè)必要。Facebook 的藍(lán)色F圖標(biāo)，推特圖標(biāo)內(nèi)的小鳥，這些都已經(jīng)成為約定俗成的存在了，用戶都了解它們的含義，改變它只會(huì)讓用戶感到迷惑。

使用標(biāo)準(zhǔn)化的按鈕和操作，對于你的設(shè)計(jì)項(xiàng)目和用戶而言都是省心省力的選擇。

6、設(shè)計(jì)不一致

一個(gè)APP內(nèi)所有的元素應(yīng)當(dāng)看起來一致，交互和運(yùn)作方式也應(yīng)當(dāng)統(tǒng)一。一致的設(shè)計(jì)讓用戶能夠更快適應(yīng)產(chǎn)品，統(tǒng)一的設(shè)計(jì)讓用戶對于不同的界面有了預(yù)期。

當(dāng)用戶在學(xué)習(xí)使用新的APP之時(shí)，他們對于APP本身的設(shè)計(jì)、體驗(yàn)也有著基本的期望，從色彩到樣式，從交互到運(yùn)作模式。當(dāng)不一致的細(xì)節(jié)出現(xiàn)他們面前的時(shí)候，基本的預(yù)期被打破，自然會(huì)帶來不好的印象。

7、不完整的反饋機(jī)制

每一個(gè)交互都應(yīng)當(dāng)帶來相應(yīng)的反饋，就像物理學(xué)中的作用力和反作用力是成對出現(xiàn)的一樣。

APP給予用戶的反饋機(jī)制，賦予用戶以參與感和操控感，它給用戶提供了有價(jià)值的信息，甚至幫助用戶做合理的決策。正確的反饋機(jī)制應(yīng)當(dāng)這樣設(shè)計(jì)：

·告知用戶他們所處的位置，或者顯示當(dāng)前狀態(tài)（比如光標(biāo)懸停色彩改變等）

·當(dāng)某個(gè)動(dòng)作執(zhí)行的時(shí)候，應(yīng)當(dāng)給出相應(yīng)反應(yīng)（比如提交表單完成之后給予成功提交的提示）

·告訴用戶發(fā)生了什么，以及接下來將會(huì)發(fā)生什么（比如加載中的進(jìn)度條）

8、與系統(tǒng)不同步

你所設(shè)計(jì)的APP應(yīng)當(dāng)和整個(gè)操作系統(tǒng)有著相似甚至相同的美學(xué)標(biāo)準(zhǔn)，這也是iOS和 Android 設(shè)計(jì)規(guī)范最重要的作用之一。想想看，整個(gè)扁平風(fēng)界面上一個(gè)擬物化的圖標(biāo)，這是有多么出戲啊。這也是Instagram 近期圖標(biāo)改版的最重要的原因之一。

9、界面太復(fù)雜

界面過于復(fù)雜也許是游戲類APP最常見的問題了。當(dāng)你完全熟悉整個(gè)界面的時(shí)候，也許你都不想再玩它了。

界面設(shè)計(jì)應(yīng)當(dāng)是簡單直觀的，一眼能看明白的界面是好界面，當(dāng)界面需要一份說明書來說明的時(shí)候，它的設(shè)計(jì)就算得上是失敗了。

對于用戶而言，每一個(gè)下載下來的APP都是用來解決問題的，每一個(gè)應(yīng)用都是一個(gè)給用戶的解決方案，千萬不要讓這個(gè)解決方案成為問題本身。

那么你的APP是給用戶解決什么問題的呢？

10、忘記默認(rèn)設(shè)定

在界面中，尤其是在表單類的元素中，默認(rèn)的設(shè)定值對于用戶而言有很重要的參考價(jià)值。這些預(yù)設(shè)的默認(rèn)值根據(jù)不同類型的表單、控件而有著不同的展現(xiàn)形式，有的可以顯示為空讓用戶選擇，而有的則需要顯示一個(gè)基本的數(shù)值，讓用戶后續(xù)調(diào)整，而一些文本輸入框則需要在其中預(yù)先填入示例。

默認(rèn)設(shè)定讓用戶明白如何使用這些設(shè)置、表單和控件，提供模板和參考，甚至讓整個(gè)交互更易懂。默認(rèn)設(shè)定對于反饋也有著重要的作用。許多表單用戶是如何填寫的，設(shè)置是如何選取的，最終都會(huì)反饋回來，從而讓設(shè)計(jì)者更容易明白用戶是怎么做的。