你與優秀的UI設計師之間可能隻差這麼幾個小細節。作為一個初級UI設計通常我們的關注點都會放在整體風格的把控,色彩的選擇還有頁麵的規範性。而除了這些我們還需要注意的就是細節的表現。而這些細節恰恰是我們容易忽略的地方。掌控全局,把握細節,這才是一個優秀的UI設計師需要做到的。那麼,今天我們就來聊聊細節表現。
一、統一性和一致性
設計語言的一致性能夠使用戶在熟悉的環境中進行操作。讓產品給用戶留下更深刻的印象。頁麵風格、配色、裝飾元素、icon等都應該保持一致性。同時加強統一性和一致性的表現也是近一步加深用戶對於品牌的印象。
以想去APP為例,從啟動圖標到啟動頁麵,再到首頁的一級導航的icon,延續使用時尖頭元素。在設計元素上統一性做得非常好。同時讓用戶對於這個元素印象深刻,從而到達加深品牌在用戶心目中的印象。
除了裝飾元素以外,在設計風格上也保持著統一的簡約風,以黑白色調為主,無論是啟動圖標,或者功能頁麵,整體性非常強。
二、讓每一個像素都清晰
你以為你在ps裏繪製的矢量控件就是矢量嗎?
放大後很多時候會發現有虛邊的情況,我們必須要檢查每一個控件的邊緣,不要出現半像素的情況。首先在繪製矢量圖形時盡可能保證偶數,同時避免多次縮放。同時我們還要記得勾選#對齊像素#並放大後檢查。
左側圓角矩形在放大後垂直方向線條有很明顯的虛邊,右側圓角矩形則是清晰的。當我們設計icon或矢量元素時也要做到每一條直線都是清晰可見的。
三、頁麵信息的層級關係
初級設計師最容易忽略的問題就是頁麵的層級表現,這直接導致用戶在閱讀信息和使用產品時體驗感降低。
作為設計師,我們需要考慮所呈現的內容的優先級,通過大小、粗細啊、顏色、形式感的區分來體現。讓用戶先看到它最關注的信息,而不是讓用戶在海量信息裏尋找有用的信息。
同時我們還需要考慮用戶的交互習慣,例如按鈕的設計就需要有點擊感,識別度要高。
當我們去對比前程無憂和智聯招聘的頁麵時可以非常清晰的感受到信息層級帶給用戶的最直觀的體驗。很明顯,智聯招聘的信息層級劃分更為清晰。用戶可以非常快的從中得到自己最關注的信息。
而不需要在頁麵中停留太多時間去找尋自己需要的信息。通過文字的粗細變化,顏色變化,重點文字顏色的變化等方式把簡單的文字內容劃分清晰。
前程無憂的頁麵設計裏,雖然也通過不同的形式劃分也內容層級,但是很明顯,層級沒有拉開,微弱的層級變化很難讓用戶分辨信息內容。所以在處理細節時我們不僅要注意拉開層級,同時也要敢於使用高對比的形式去表現頁麵層級。
除了以上幾點外,我們元素的對齊、分布、文字字體的統一等都是我們設計頁麵時需要注意的細節。做好這些是作為一個優秀的UI設計師的前提。優化細節,讓細節中閃現出更多精彩,讓我們設計的頁麵脫引而出。
作者:程瑩
來源:視覺半徑公眾號
上一篇 如何做出好的交互設計方案?
下一篇 UI設計師都會用的圓角插件
熱門課程
專業講師指導 快速擺脫技能困惑相關文章
多種教程 總有一個適合自己專業問題谘詢
你擔心的問題,火星幫你解答介紹網上下載的字體如何安裝。Windows係統下安裝字體教程,mac係統下安裝字體教程,ipad係統下安裝字體教程,
火星瑪雅影視培訓,專業的影視技能提升路徑,持續改進影視製作技能,開啟全新的影視製作職業機會。
本文詳細介紹了場景原畫培訓哪家便宜且優質,最後為大家推薦火星時代教育,為您提供性價比最高的場景原畫培訓服務。
深入了解火星時代Zbrush課程的報名步驟,掌握報名要點,提前了解火星時代教育的相關信息。
詳細介紹火星CG原畫插畫培訓的專業課程內容,闡述火星時代教育如何通過科學的教學方法,幫助學員全麵提升原畫插畫技能,塑造全新的藝術世界
尋找最優質的火星好原畫設計培訓? 火星時代教育為您提供高質量的原畫設計課程,幫助您成為專業藝術家!
1. 打開微信掃一掃,掃描左側二維碼
2. 添加老師微信,馬上領取免費課程資源
同學您好!