12 UI設計規則:
1.連續性規則。
元素的連續排列構成了有組織的結構,可以使閱讀更有條理。這樣做的目的是督促用戶完成我們想要的動作,比如向左滑動可以看到更多的卡片。以連貫的方式通知用戶,讓用戶隱藏該部分。
2.類似的法律。
人的視覺會把相似的元素聯系起來,主觀認為它們有相同的意圖。因此,在設計相同的狀態或功能元素時,我們需要保持視覺上的統壹性,讓用戶認為它們是具有相同功能的按鈕或模塊。
3.封閉規則。
當我們看到壹個破碎的圖像時,我們會用大腦組成整個畫面。這樣的表達經常用在LOGO設計中,也用在界面設計中。
4.鄰近定律。
眼睛可以看到相鄰的內容,可以減輕閱讀內容帶來的壓力。在設計中,這種排版方式非常重要,尤其是對於復雜的信息流頁面,往往采用鄰近法設計,以保證更合理的信息傳遞。
設計時,間距是用來組合元素的,常用於內容信息、卡片、橫幅等。
5.對稱定律。
對稱的圖形讓我們覺得穩定可靠。為了提高界面的穩定性,我會用對稱法來設計。但是過度使用對稱會讓人感覺單調,所有的對稱定律都需要在合適的時候合理應用。
這種方法常用於焦點圖、產品展示、列表和導航。
6.總體規劃規則。
為了改善頁面中的內容關系,對視覺進行分組。通過卡盒的形狀來區分,讓各種元素融合在壹起,布局可以更有規律。
組合規則通常用於內容和列表的設計。
7.相同的屬性規則。
向壹個方向移動的元素可以感覺到它們是相連的。比如,當妳點擊折疊菜單時,同時出現多個元素,這些元素是相互關聯的。這些規則可以有效地建立元素之間的關系,這在心理學上是壹致的。這種方法經常出現在導航、下拉菜單、折疊菜單中。
8.焦點規則。
突出重點的方法是增強對比,或者增加元素的對比,從而吸引註意力。這樣做可以讓用戶專註於我們希望他們看到的信息,從而引導用戶關註焦點信息。特別是在詳情頁或提示框中,會采用“焦點法”進行設計。
9.生理規律。
感覺越真實,就越容易被接受,吸引眼球。就像文字不像圖片那麽好讀壹樣,圖片也不像視頻那麽直觀。有了圖片,更有信息傳遞感,很多產品都是用來刺激用戶購買圖片或者視頻。同時,通過振動或聲音效果增強感知,使體驗更加有趣。
10.隔離規則。
視覺很容易被不同的元素或突出的元素吸引,很快就能記住。這個規則很容易與焦點定律混淆。不同之處在於,應用該規則的元素通常是獨立的,並且不需要額外的功能和信息。
11.色彩心理定律。
顏色尤其影響我們的潛意識。顏色方面,有性別、宗教、文化的差異。例如,紅色表示錯誤,綠色表示成功,藍色表示正在進行,黃色表示活力,暗示危險。
12.身體心理學原理。
在所有的設計中,形狀是不可忽視的。調查顯示,每種形狀都有自己的含義。就像顏色壹樣,人的潛意識對不同的形狀會有不同的反應。
以上12規則是UI設計中常用且有效的。大家趕緊收藏起來,以後應用到自己的UI設計中吧~