關注功夫體驗設計與十萬讀者見證成長的力量

大家有沒有這種感覺,每次做設計的時候,總是沒感覺,好不容易出一張稿子,竟然被總監說沒設計感,沒細節,太平淡等三連擊,直接打掉了自信心。加大對比
加大對比,一個簡單的設計原則,依然可以做出有設計感的頁面,我們來看看具體方法。
加大對比原則一定要做到充足的大小對比,比如我們應用到文字版式上。
上圖中,可以看到 IMAX 最大,上下兩個文字最小,形成鮮明的對比,視覺張力感強。上圖海報設計,1878幾個大字疊加在商品鞋子後面,文字在這裡背景與前景鞋子前後呼應,形成強烈的對比,也增強畫面細節和質感。
那麼在界面中如何應用這個大小對比原則?來看看案例。

NFTFLIX(奈非)APP設計,電影海報BANNER中大字體,同時在電影封面上和排名上均加大文字對比,形式感十足。
更大的字體,這個設計同樣使用大字對比。
圖片調性一致
經常使用圖片,但是最容易忽略是圖片的風格調性是否統一。
上面兩張圖,大家看看風格一致麼?兩張圖效果都還行,但是他們調性不一致,左邊透明玻璃,右側高品質產品圖,質感色彩都有差異,所以如果把這兩張圖放在一個界面中,很顯然會有些突兀的。圖片調性一致主要體現:明暗、光感、質感、圖片複雜度、角度等等。
上圖中,我們看到上圖中圖片一致性很強。所以將這種思路應用在界面中,我們找圖也是需要這種思路。
同一個界面,圖片一定要避免複雜度,儘量乾淨簡潔為主,留白多一些。
所以一張好的圖,調性一致的圖,可以讓整個界面增色不少。
虛實集合
黑色和白色形成強烈對比,虛和實也可以形成強烈對比,當在設計排版中應用虛實組合設計時,可以增強畫面感染力,或者是可以吸引用戶關注重要的信息。
黑色實心圓屬實體物體,右側鏤空圓屬於虛,兩者在一起形成一實一虛。這種思路其實在文字排版,界面排版中也同樣可以使用。虛實對比就簡單疊加了一個黃色背景,瞬間就提升一些細節感,這種思路我們是完全可以應用到界面版式中的。這個海報就是採用虛實文字組合設計,大家想想,如果純是實體文字版式,那麼細節又會少了很多。

好了,到這裡就差不多了。
最後總結下,今天說了3個提升設計細節、設計亮點的技法,這些是可以互相組合使用的,比如虛實集合與大小對比組合使用,一樣可以產生驚人的威力,不過還是得大家多去嘗試。
挑戰日更100天,目前已完成4篇
推薦閱讀
>>第四期UIUX設計營報名中,隨到隨學>>

