最近看到這一篇針對ui設計初學者的文章，講得比較細節，感覺不錯。文章寫的比較細，也比較散，適合初學者對于ui設計有一個初步的了解。UI初學者的福音千萬不要錯過哦。

頁面設置

1.按鈕的周圍要留出足夠的空間

如果不同按鈕之間距離太近，用戶就容易誤操作。

2.相關性高的元素挨得近些

3.相關性低的元素離得遠些

與上一條相對應，相關性低的元素之間需要留出間隔。如果相關性低的元素排列的比較近，會讓用戶對信息層級產生誤解。

4.界面元素要對齊

5.同類型頁面布局要一致

同一產品中，如果界面之間的布局差異很大，用戶在使用過程中會容易產生困擾。同類型頁面使用同樣的布局方式，可以減少用戶認知成本，使用戶在新的頁面也可以憑以往的經驗很快找到自己想要的內容。

6.要有足夠的留白

元素之間不要離得太近，要留出足夠的空間。留白不足夠會顯得頁面非常擁擠，用戶可能會被嚇跑哦!

7.考慮視線的走向

在設計橫向的頁面布局時，需要更多考慮用戶視線的方向。

8.返回按鈕放在左上角

用戶會根據自己以往的經驗判斷按鈕位置。用戶在使用瀏覽器和手機中的app時，已經習慣了返回按鈕在左上角，不要輕易挑戰用戶的使用習慣哦!

9.可以滾動的頁面要明確提示

在設計網頁和app界面的過程中，出現需要用戶滾動才能出現更多內容時，需要明確的表現出頁面可以滾動。

10.常用按鈕放在容易操作的位置

11.點擊后彈出的元素要離點擊的位置近一些

比如說，點擊界面中的按鈕彈出的菜單通常會出現在按鈕旁邊，這樣就很好理解。如果反過來，點擊頁面中間，菜單卻從右下角跑了出來，這就會讓用戶感覺很奇怪了。

易用性

12.常用功能容易找

13.不要自動播放視頻

自動播放視頻的行為，不僅影響用戶的觀賞感受，而且在手機瀏覽時還會消耗額外的流量，簡直是慘無人道的掠奪行為。還是應該把選擇權交給用戶，點擊播放按鈕之后再播放吧!

14.不要突然發出聲音

用戶可能在任何的環境下打開頁面，可能是熱鬧的地鐵中，也可能是安靜的醫院里。用戶在打開頁面之前，沒有預想到它可能會發出聲音，突然發出聲音可能會嚇到用戶。所以還是盡量不要使用一打開頁面就發出聲音的這種設計吧!

15.在web設計中減少頁面跳轉

在瀏覽網頁時，頁面跳轉會增加用戶的負擔，因為頁面加載會耗費時間，跳轉時還有可能出現廣告，甚至有可能跳出完全不相關的頁面，要返回原來的頁面也同樣耗費時間。

由此，在進行網頁設計時，不要讓用戶進行多次點擊，盡量在同一個網頁提供盡可能多的信息。

在app界面設計時則有些不同，因為大多數頁面都可以緩存，返回相對容易很多，頁面跳轉的成本也相對小一些。

16.操作可撤銷

17.懸浮顯示的元素不要太搶眼

18.不要拉伸圖片

19.適當時候給予進度展示

20.將結論寫在前面

隨著人們生活節奏的加快，用戶在訪問頁面時需要更快的獲取信息。頁面中的結論類型的信息可以優先顯示，詳細的解釋類的內容可以放在后面顯示。盡可能的縮短用戶獲取信息的時間，節省用戶的時間。

21.不要為了縮短頁面長度而增加跳轉

同類內容盡量在同一頁面顯示，不要為了縮短頁面長度而無端增加分頁或跳轉，當然，“圖片太多、加載較慢”這種情況除外。畢竟跳轉頁面對于用戶來說，成本還是很大的(見第15條)。

22.不要單獨使用意義不明確的圖標

大多數用戶已經對很多圖標的含義已經達成共識。例如，≡表示“菜單”，“感嘆號”表示“注意事項”，“垃圾桶”表示“刪除”，“齒輪”表示“設置”。類似這樣的圖標，可以單獨使用。

23.不要使用長而無意義的動效

大多數用戶在頁面出現動效時通常會中斷操作。為了節約用戶的時間，動效盡量簡潔些，可以省去一些無意義的單純炫技的動效。

24.復雜的使用說明分步講解

在必要的場合出現比較的新手提示，這一點可以像一些手機游戲學習。

25.不要試圖讓用戶“學習”使用說明

如果一個頁面需要用戶來“學習”才能夠使用，那么它就談不上“易用”了。

26.盡量減少加載時間

減少加載時間，可以通過以下兩種方式。

1.延遲加載：配合頁面滾動，逐步加載頁面內容。

2.壓縮圖片：png格式的圖片文件通常比較大，使用時注意壓縮。

27.有效信息優先展示

雅虎問答優先展示被設置為“最佳答案”的回答，這可以使用戶更快的獲取更有效的信息。在其他頁面的設計中也是同樣的道理，優先展示更有效的信息，可以讓用戶更有效率的獲取信息。到這里今天的教程UI初學者必備之提升用戶體驗的小方法就結束了，喜歡的可以多多關注我們哦。

資源地址: http://blog.silucg.com/UI/jc/7032.html(分享請保留)