UI提升的小技巧有哪些?
UI提升的小技巧有哪些?UI設計的魅力在于,你不僅需要適當的技巧,更要理解用戶與程序的關系。一個有效的用戶界面關注的是用戶目標的實現,包括視覺元素與功能操作在內的所有東西都需要完整一致。那么,今天和繪學霸小編一起了解下:UI提升的小技巧有哪些?
UI提升的小技巧有哪些?
1.按鈕色彩凸顯重要性
在給用戶提供多個選擇的時候,可以通過色彩所傳遞的情緒是積極還是消極的,來簡單快速地進行設計。
實際上,紅色和綠色按鈕的色彩含義,已經橫跨物理世界和數字設計領域,我們每天在很多實體產品上也能看到類似的設計,包括交通上的紅綠燈,警告標識,以及實體按鈕。
綠色表示通行,紅色表示禁止。如果用戶需要購買一個漏斗,你希望感興趣的用戶趕緊點擊,而不是取消。
另外,如果你的網站或者APP涉及到重要性不同的若干交互,除了按鈕都要標識出相應的文本標簽內容以外,還可以借助色彩填充與否來進一步區分層級結構:
這是一個簡單的示例,有色彩填充的按鈕、幽靈按鈕(無色彩填充、有邊框)以及無邊框無填充按鈕來區分。
而在少數情況下,對于系統有重要影響的、破壞性的或者限制性的按鈕,也應該突出顯示,但是可以使用紅色來進行強調和警告。這個時候,相對的「非負面」的按鈕則被視作為重要性較低的操作:
簡而言之,實際上用戶用來區分按鈕的核心靠的是感知而非復雜邏輯判斷,設計的基本規則在上面,但是更重要的是要基于情緒和感知來進行設計。
2.用字重和明暗來區分層級
尤其是在構建文本內容的視覺層級的時候,可用到的屬性很多,只使用大小差異來構建就顯得過于單一了。
在很多時候,可以借助色彩、字重、明暗來進行區分。我們可以讓更重要的文本更大、字體更粗、色彩更加鮮明,或者使用更深的黑色來呈現。
綜合地使用這些屬性來構建視覺層級。
3.用留白來隔離元素
兩個元素互不相關,如果想將它們分隔開來,使用分割線似乎是一件理所當然的事情?當然可以,但是這種方式真的是非常過時且笨拙的一種呈現方式。你需要的是更好、更優雅、更貼合當下的一種呈現方式。
不是簡單地使用分割線,而是使用留白,或者說負空間來間隔就可以了。分割線在很大程度上是丑陋且難以駕馭的視覺噪音,相對而言留白則好了很多。
多數情況下,刪除分隔線條是比較快速的方法,當然更多的時候需要你適當地調整一下留白的大小。
使用分割線來分隔內容,不僅會讓掃視頁面花費更長的時間,而且增加的信息噪音會影響整體的層次結構。
4.用陰影替代邊框
想要凸顯一些元素,并不一定需要依靠描邊。使用陰影則可以起到同樣的效果,單獨使用則會顯得更加整潔。描邊 陰影則會顯得過于雜亂。
使用相對不那么具有侵略性的小陰影無疑讓效果更加輕松,看起來也不會突兀。
5.用色條提升視覺調性
如果覺得內容區塊過于單調,可以根據你的目的來強化這一區塊的視覺屬性。在內容區的一邊加上色條能夠在提升視覺屬性的同時,賦予這一區塊內容以情緒。
色條可以是單色的,也可以是漸變的,這取決于你想傳達什么樣的視覺體驗。這個色條還可以具備良好的功能性。當然,這很大程度是用在相對比較素的頁面上的,如果頁面本身已經很花哨了,就不太用得上。
比如使用紅色和綠色來標識不同的狀態,也可以用色條來標識出被觸發的Tab或者控件。
6.用背景色區分區塊
其實,同樣是為了進行區分內容區塊和層級,這個方法同樣優雅而快速,幾乎可以算是毫不費力的一種設計技巧。
為了區分兩個不同區塊的元素,簡單地使用不同的背景來進行區分也可以,本質上,它采用的類似卡片式設計的思路——用不同的卡片來歸類內容。
相對而言,使用有差異但是不那么顯著的不同色塊來作為背景,在保證整體整潔的同時,起到了區分的作用。
7.「字」盡其用
誰不喜歡漂亮的字體呢?當然都喜歡,但是字體的功用其實各不相同。從呈現正文的強可讀性文本,到裝飾性極強的視覺化字體,各種不同的字體需要應對不同的功能。
繪學霸除了課程內容全面,還有著豐富的實訓項目內容,讓你能夠接觸到行業前沿的影視素材,在學習中累積一定的工作經驗,讓你就業后就能夠直接參加項目,告別剛入行時的迷茫期,所以如果你有這強烈的就業意愿,繪學霸是個很不錯的選擇。
那本期關于UI提升的小技巧有哪些?的分享就到這里結束了,也歡迎喜歡UI設計的小伙伴,關注我們的官網繪學霸,經常分享各類教程、資源、經驗,助你開啟UI設計提升之門。

全部評論


暫無留言,趕緊搶占沙發
熱門資訊

下拉菜單和選擇器的區別?

視覺設計和交互設計兩者區別是什么?

將視錯覺應用到平面設計創意中會怎么樣?

深圳網頁設計培訓班學費是多少?

UI設計師和ued設計師的區別是什么?

UI設計和cad兩者有什么區別?

設計中關于左右滑動的思考

平面設計的歷史是什么?

沒有原創作品能找到UI設計工作嗎?
