隨著移動優(yōu)先的趨勢，APP設(shè)計越來越受到公司的重視。不斷提高APP的設(shè)計質(zhì)量是每一個設(shè)計師的追求。你忽略了哪些設(shè)計細(xì)節(jié)？看看你是否掌握了所有這些細(xì)節(jié)。

　　視覺表型問題

　　1.統(tǒng)一圖標(biāo)設(shè)計風(fēng)格

　　圖標(biāo)設(shè)計是整個APP設(shè)計中最重要的一個環(huán)節(jié)。圖標(biāo)設(shè)計樣式包括線性圖標(biāo)、填充圖標(biāo)、平面圖標(biāo)、平面圖標(biāo)、手繪樣式圖標(biāo)和模擬對象圖標(biāo)。無論我們選擇什么樣的圖標(biāo)，請保持統(tǒng)一。同一模塊采用一種表達方式。如果是線性圖標(biāo)，會保持一致的筆畫值。

　　圖標(biāo)在配色上要有規(guī)律的統(tǒng)一，采用同色是常見的配色方法。如果使用不同的色相配色方法，要保持整體的配色協(xié)調(diào)性，不要有飽和度和亮度反差過大的配色，這樣會影響整體的視覺協(xié)調(diào)性。

　　2.圖標(biāo)大小的視覺平衡

　　當(dāng)多個圖標(biāo)出現(xiàn)在同一個界面時，我們需要保持整體的視覺平衡。不是所有的圖標(biāo)都可以用同樣的尺寸達到平衡。由于圖標(biāo)的大小不同，相同大小下不同大小的圖標(biāo)視覺平衡是不同的。例如，一個相同大小的正方形會比一個圓大。因此，我們需要根據(jù)圖標(biāo)的大小來調(diào)整圖標(biāo)的大小。

　　3.優(yōu)化你的分割線

　　在界面設(shè)計中，細(xì)節(jié)往往最容易被忽略。根據(jù)不同的界面顏色，在分割線顏色的選擇上要做相應(yīng)的調(diào)整。因為分割線的作用是區(qū)分上下信息層次和界面裝飾，所以配色的表現(xiàn)力低于文字信息，所以我們通常選擇淺色而不是深色，這樣界面會更簡潔透明。除非在某些特定的產(chǎn)品場景中，否則應(yīng)謹(jǐn)慎使用深色分界線。

　　4.合理使用投影的顏色和透明度

　　通過突出按鈕、卡片等?？梢栽鰪娏Ⅲw感和層次感。做投影的時候需要根據(jù)不同的背景改變投影的顏色和透明度。

　　燈光背景下的投影顏色將通過選擇左上角拾色器的位置和10%到40%之間的透明度(個人經(jīng)驗)來調(diào)整。深色背景下的投影顏色將通過選擇拾色器右下角的位置和20%至40%之間的透明度(個人經(jīng)驗)來調(diào)整。

　　投影的權(quán)重符合頁面設(shè)計的氛圍，投影的應(yīng)用是為了增強元素的立體感和層次感，而不是影響整個頁面的視覺平衡。

　　5.不要過度修飾，讓界面更簡潔

　　設(shè)計需要準(zhǔn)確把握“度”，過度的設(shè)計會干擾信息的傳遞。通過減少不必要的設(shè)計元素，讓信息出來，整個界面會更加簡潔、清爽，不會讓用戶分心。6.畫面比例視在地平線的統(tǒng)一

　　在字符顯示的設(shè)計中，如果多個字符并排出現(xiàn)，為了保持視覺平衡，我們需要調(diào)整并排圖片的大小比例，就像所有字符都是以相同的焦距拍攝一樣。在調(diào)整人物的上下位置時，我們應(yīng)該盡量控制視在地平線的方向，使他們的眼睛處于同一位置左右。

　　7.控制界面中的配色數(shù)量

　　在一個界面中控制三種顏色相對容易。如果超過三種顏色，就考驗設(shè)計師的基本功了。如果色彩處理不到位，就會出現(xiàn)五彩繽紛的“視覺盛宴”。

　　在選擇顏色組合時，使用顏色相近的配色方案，可以使顏色更加和諧、交融；如果你想更清晰地突出一些元素，對比色是一個很好的選擇。無論選擇什么配色方案，都要控制界面中配色的比例，這樣才不會干擾信息傳遞。

　　8.合理的設(shè)計比較

　　相比之下，信息模塊可以更加獨立，界面層次更加豐富。在這種情況下，不同的信息模塊通過不同的背景顏色來區(qū)分，提高了整個界面的節(jié)奏。顏色的選擇可以是同一顏色體系中不同明度的漸變表達，也可以選擇不同色調(diào)的穿插搭配。

　　9.提高地圖的質(zhì)量

　　圖片質(zhì)量影響整個界面的風(fēng)格。如今，越來越多的產(chǎn)品將圖片美化后展示給用戶，以增強產(chǎn)品在用戶心目中的印象。我們在設(shè)計方案的時候，也要精心挑選搭配圖片，通過后期裁剪、曲線調(diào)整、色彩調(diào)整等手法，讓同一個模塊的搭配圖片視覺效果更加和諧。

　　信息傳遞問題

　　10.清楚地表達圖標(biāo)的含義

　　移除圖標(biāo)副本后，界面會更加“強迫”，但你確定用戶能理解圖標(biāo)所表達的意思嗎？當(dāng)我們設(shè)計界面時，圖標(biāo)是為了幫助解釋副本傳達的信息。如果刪除復(fù)制信息，圖標(biāo)本身需要有很強的信息傳遞能力，以保證用戶能夠正確識別。

　　11.正確表達按鈕屬性

　　按鈕的設(shè)計必須清晰準(zhǔn)確地傳達當(dāng)前狀態(tài)，不能給用戶帶來對視覺效果的錯誤判斷。比如深灰色按鈕的用戶會明白自己被禁用，放棄點擊。

　　按鈕的顏色、大小和樣式用于指導(dǎo)用戶操作。需要加強的地方要做的突出，整個界面不要處于優(yōu)先級不明確的狀態(tài)，分散了用戶的注意力，削弱了界面需要傳達的主旨。

　　12.正確處理文字排版的層次關(guān)系

　　我們在工作中得到的需求中總會有一大份，不能像概念設(shè)計那樣隨意刪減。排版時，正確處理信息之間的層次關(guān)系，會提高用戶對信息的識別度。我們通常通過字號、顏色、空格、層次分割等技術(shù)進行處理，對屬性相同的信息進行分類設(shè)計，通過不同的空格實現(xiàn)層次分化，使整個信息排列的順序清晰。13.線條和顏色塊分割的合理應(yīng)用

　　線通常用于劃分相同類別或具有相同屬性的元素；而色塊更多的是用來劃分不同的類別或者區(qū)分不同的屬性，從而達到層次清晰、分類清晰的目的。在選擇分割形式時，要根據(jù)信息之間的關(guān)系表達清楚，不能為了視覺效果而盲目使用。

　　14.提前估計信息呈現(xiàn)的最大價值

　　在界面布局中，應(yīng)該定義信息呈現(xiàn)的最大值，而不是取最小值進行設(shè)計。如果長度范圍太理想，界面風(fēng)格可能會更美觀，但落地后會給用戶帶來非常不好的體驗。

　　15.使用提示提高用戶閱讀效率

　　在大文本信息的布局中，合理使用提示會提高用戶對信息的理解，快速找到需要的信息。提示可以是數(shù)字、字母、圖形、色塊等。只要他們能有效區(qū)分信息等級。

　　16.布局清晰而集中

　　好的界面布局是為了引導(dǎo)用戶更好的閱讀和操作，界面布局要有層次和重點，而不是簡單的羅列信息。通過卡模塊的差異化和尺寸變化，可以很好地進行視覺引導(dǎo)，大大提高了用戶對界面的理解，從而提高了用戶的操作效率。

　　17.信息布局符合閱讀習(xí)慣

　　從左到右，從上到下閱讀是我們現(xiàn)有的習(xí)慣。如果你想打破這種習(xí)慣，用視覺來表達，你將面臨巨大的挑戰(zhàn)用戶體驗的壓力。

　　概念表達問題

　　18.同一界面下圓角直角的統(tǒng)一

　　在同樣的界面設(shè)計中，圓角和直角的選擇要在界面上顯得更加均勻，視覺表達不能因為混合應(yīng)用而不一致。如果選擇圓角作為視覺語言，同一模塊下圓角的大小應(yīng)該統(tǒng)一，這樣整個界面設(shè)計的視覺語言就更加規(guī)范統(tǒng)一。

　　19.設(shè)計元素的表達符合用戶的心理

　　設(shè)計的目的是幫助用戶更好的理解界面的操作邏輯。如果你的設(shè)計改變了用戶的心理和習(xí)慣，可能會增加用戶的學(xué)習(xí)成本或者被用戶拋棄。我們在設(shè)計界面的時候，如果要設(shè)計一些創(chuàng)新的操作規(guī)則，就需要做更多的研究和測試，確保規(guī)則符合用戶的心理。

　　20.設(shè)計表達的一致性

　　同一個信息模塊用統(tǒng)一的設(shè)計表達，不應(yīng)該為了改變而加強用戶的理解。前后信息設(shè)計的多樣性在視覺上可能更豐富，但用戶會明白這是兩個不同的模塊，操作會有所不同，無形中增加了用戶的思考時間和學(xué)習(xí)成本。

　　21.不要把網(wǎng)頁的習(xí)慣帶入APP設(shè)計

　　網(wǎng)頁和APP的設(shè)計本質(zhì)上有很多不同的視覺表達規(guī)則。在設(shè)計APP界面時，要脫離網(wǎng)頁的一些交互習(xí)慣，回歸移動用戶的習(xí)慣，使界面的操作邏輯更加流暢。22.使表單設(shè)計更加簡潔

　　表單設(shè)計在界面上隨處可見，用戶總是不愿意看到無盡的表單。為了緩解用戶的心理活動，我們通常會對屬性相同的表單進行組合匯總，一步一步填寫，讓用戶覺得內(nèi)容很少。通過這種視錯覺，用戶可以完成表單。

　　23.空界面中插圖的使用

　　為了提高APP的情感設(shè)計，插畫越來越受歡迎。在空界面的一些設(shè)計中，也從以前的純文字變成了一些插圖，給用戶帶來了更多的樂趣。

　　24.用真實的信息填充你的設(shè)計

　　經(jīng)常看到一些設(shè)計稿的整個界面都是一樣的有圖，隨意輸入的文案看起來很不專業(yè)。為了減少視覺著陸的差異，我們在設(shè)計時試圖用真實有效的信息填充我們的設(shè)計草稿，以便在提出時給決策者一個恢復(fù)真實場景的有效解決方案。

　　總結(jié)

　　APP設(shè)計中有很多細(xì)節(jié)需要設(shè)計師注意，這里就不一一列舉了。很多理論來源于書本和項目經(jīng)驗，希望與大家分享。

　　設(shè)計是一條漫長的路，沒有一成不變的結(jié)論。作為互聯(lián)網(wǎng)時代的設(shè)計師，我們要不斷反思和總結(jié)，打破常規(guī)和束縛，接受更多的新元素，讓設(shè)計作品更符合這個時代。