網站首頁 學習教育 IT科技 金融知識 旅遊規劃 生活小知識 家鄉美食 養生小知識 健身運動 美容百科 遊戲知識 綜合知識
當前位置:趣知科普吧 > 綜合知識 > 

ui介面設計技巧

欄目: 綜合知識 / 發佈於: / 人氣:3.22W

1、清晰的佈局,稍顯錯落的排版

佈局設計的時候,圖片、文字、按鈕等元素,需要遵循“相關靠近”的規則來分組排布,這樣的佈局會顯得邏輯清晰,易於理解。不過,在保持這樣的視覺關係的同時,讓排版稍微錯落一點,能夠讓頁面優雅而又足夠活潑生動,不會顯得太簡單呆板。

2、保持一致的光源

確保您的陰影始終僅來自一個光源。如下圖所示,右側日曆投影就存在光源不一致,一些剛開始學設計的小夥伴可能就會忽略這種細節問題!因此一定要注意。

3、全屏大圖,兼顧功能線性元素

高清大圖撐滿全屏,加上展示性比較強的字型作爲標題也是經典的搭配,但是在很多時候依然會讓人覺得單調。線性元素的加入,不僅不會遮蓋住作爲視覺主體的圖片,而且能夠強化形式感,如果運用得當的話,還能作爲視覺引導,強化交互,引導用戶點擊,非常有用。

4、高清大圖,超出邊界的佈局

使用佔據整個屏幕的高清大圖固然賞心悅目,但是更多的圖片在邊界露個頭,能夠更好地吸引用戶的好奇心,這比起單純的左右翻頁按鈕更能夠促進交互。這種不對稱的佈局,結合形式感極強的標題和數字元素,整體會顯得更加優雅。

5、保持元素清晰

在設計過程中可以稍微使用一些恰當合適的陰影,來保證當前設計與背景能夠清晰可見,但是一定要避免複雜的陰影,這會起到反作用。

陰影可以增加元素的深度,引起用戶的注意力,同時也能增強畫面的視覺層次感。

ui介面設計技巧

6、經典佈局,錯落的交互元素

打破規則,或者說打破常規是經常用到的一種設計思路,但是通常只能打破一種常規,打破太多的規則和習慣會帶來混亂。在經典的左右佈局之下,加入不那麼規則、整齊的交互元素,能夠讓設計維持經典的外觀的同時,顯得更加活潑有趣,又不會讓人覺得太過跳脫。

7、統一色彩,明確的視覺焦點

凝聚力是這種設計組合的主題。統一的色彩讓整個頁面顯得非常的集中,而聚焦的元素讓所有的視覺內容都圍繞着它來進行設計,標題、輔助性的說明文字、交互按鈕等都在一個統一的設計想法和目標之下得到了統一性的規劃和設計。

8、單色網站,突出全綵圖片

單色網站通常會以一種色彩爲主,但是如果在單色網站中再加入幾張明顯是全綵的圖片,會顯得非常「扎眼」的,但是這也會讓它們非常明顯地吸引用戶的注意力。這種設計同樣是秉承「打破一條規則」的設計策略,當然前提是你的設計目標就是要凸顯這寫圖片內容。

9、單色配色,打破常規的排版

單色配色也是最近幾年比較流行的配色方式,這樣的配色簡單直觀,更重要的是能夠突出排版。這種情況下,非常規的排版能夠得到增益和凸顯。縱向排布的標題,被邊緣遮擋的作者名稱,用來視覺引導的細線,左下方用來強調的裝飾性色塊,都很好的強化頁面的排版形式感。

10、高雅中性色,明快提亮色

色彩通常是抓人眼球的設計元素。黑白灰這樣的中性色,不論是圖片和色塊常常能創造沉靜的氛圍,而精選一種明快的提亮色,比如明黃,能夠打破這種氛圍,增加一個層次,如果用來承載核心的資訊,能夠讓用戶更快搞清主次。這樣的設計不僅高效,而且優雅。

11、簡約風格,沿中線錯開佈局

這同樣是在常見的基礎上,稍加調整就能做出來的好設計。在純白背景下的簡約風格之下,沿着中線的左右兩側來排布文字和圖片內容,沒必要刻意保證左右兩側的準確對齊,只需要保證中線,上整個視覺路徑的清晰規整,同樣可以做到清晰而不拘一格。

12、使用一種字型

在設計一套新的UI介面時候,最好能保持一種字型,這樣能夠讓介面更加輕量化的同時,也能保持和好的品質感。

儘量避免使用2種以上的字型,你可以透過粗細、大小、或者顏色來區分層級!

Tags:ui 介面設計