編者按:這篇文章來自 UI 設計師 Victor Adeyemo,他將自己走過無數彎路之后總結出來的圖片使用技巧梳理成為一篇干貨滿滿的文章,這些技巧可以應用到UI和平面排版當中,往下看看吧:
如果你仔細查看如今高質量的 UI 設計,會發現那些優秀的設計背后有很多共通的技術和方法,你可以將它們無縫地運用到自己的 UI 和視覺設計當中,這些方法和技巧能夠讓你看起來足夠專業。
這篇文章當中的很多內容來源于我早期設計階段的挫折和失敗。和大家一樣,當我看著這些優秀的作品的時候,會像面對著萬花筒一樣,看到精彩絢麗的效果,可是真等我自己做的時候,才會發現萬花筒的外殼拿走之后,剩下的只是一塊簡單的碎片。這就是我們絕大多數人所面臨的問題——我們沒有從這些優秀的設計當中找到規則和共性,而不僅僅是漫無目的地欣賞。
在一次次的失敗和嘗試當中,我開始記錄和梳理這些成功的設計的優點,開始將經驗反饋到自己的設計項目當中。這篇文章我就主要來分享我這方面的經驗和總結,希望這些技巧最后也能讓你的設計同樣優秀。
在一部分UI界面中,使用貼合場景和氛圍的圖片作為背景,能帶來更加沉浸的體驗。只是需要注意的是,需要調整明暗,確保前后景的對比度要足夠強。
Login Screen Redesign — Victor Adeyemo
同樣是一種制造沉浸式視覺體驗的設計技巧,通過摳圖之類的技巧,讓某些圖片元素和整個背景融為一體,圖片和背景的無縫銜接能夠給人以一種奇妙的視覺體驗。
Lippear Website — Victor Adeyemo
讓高素質的圖片緊密無縫地拼接、并排排版,能夠制造出一種無縫切高級的視覺效果,高清的圖片通常包含著豐富的視覺信息量,并排拼接起來之后,能夠制造出致密的信息量,讓整個版面呈現出信息的疏密節奏變化。
同樣是一種增加信息層級,消減單調的方法,這種方式百搭而易用,在絕大多數的風格現代的平面排版和UI界面當中,這種小技巧都可以使用,快速提升界面的視覺效果。
圖案和形狀看起來很簡單,單獨使用的時候確實也很容易顯得單調,但是當它作為裝飾元素和圖片組合在一起的時候,能夠快速地構建出頗為不錯的裝飾效果和視覺張力。
在圖片的前景或者背景疊加文本、圖案和不規則圖形,也同樣可以快速增加信息的層級,添加的時候可以不用嚴格意義上在圖片的范疇內,可以錯位,可以部分疊加,這樣的布局設計更加有趣。
Confidence. Vladimir Biondic
Emilia Brewster Website — Halo Lab
這也是最近這些年比較流行且非常使用的一種技巧,使用剪貼蒙版來將圖片約束在文本或者圖形的外輪廓當中,這上一種增加形式感、有趣的傳遞信息的方式。
控制圖片之間的間距足夠窄,能夠讓整個布局顯得緊湊而富有凝聚感,圖片的聚合能夠讓整片圖片區域顯得豐富又集中。
Unsplash Retro — Sebastian Jungbluth
在圖片上疊加色彩,或者說將圖片制作為單色調的配色,能夠產生類似黑白照片一般更強的形體感,增加視覺主體的視覺效果,同時借用不同的色彩來營造統一的氛圍和情緒。
Colour Me timbers -Johan Adam Horn
同時,還可以選擇為部分的圖片疊加色彩,這樣的處理方法更加有趣,增加了信息層級。
Website Design — Brian Rodenburg
Search Art Direction — John Adam
雖然絕大多數的圖片都是矩形的,但是將圖片裁切為其他的圖形會讓整個設計顯得非常新穎。
復制本文鏈接 文章為作者獨立觀點不代表優設網立場,未經允許不得轉載。
發評論!每天贏獎品
點擊 登錄 后,在評論區留言,系統會隨機派送獎品
2012年成立至今,是國內備受歡迎的設計師平臺,提供獎品贊助 聯系我們
AI輔助海報設計101例
已累計誕生 737 位幸運星
發表評論 為下方 8 條評論點贊,解鎖好運彩蛋
↓ 下方為您推薦了一些精彩有趣的文章熱評 ↓