如何正確地使用色塊排版?

作者:蔥爺 來源:蔥爺 時間:2020-01-18 標簽: 排版設計

如果你經常看設計作品,你肯定有發現,很多優秀的設計作品都會用到色塊,比如網頁設計、UI設計、畫冊設計、海報設計和折頁設計等。

色塊在排版中的主要作用是:分割內容、突出信息、增加視覺衝擊力、裝飾等等。
不過運用色塊排版並沒有我們想象的那麼簡單,所以我們也會看到有很多使用了色塊,但效果還是很不好的設計作品。
那麼,在使用色塊排版的時候我們需要注意哪些問題呢?使用色塊排版的正確打開方式是怎樣的呢?來看看蔥爺的解答:
 

◇◆  1.色塊要有張弛 ◆◇

張弛其實就是指要有大小對比,如果版麵中有多個色塊時,那最好要有大小的區分,而不是所有色塊一樣大或差不多大。

上圖三個色塊把版麵均等分成三份,雖然不難看,但感覺缺乏主次和設計感。

拉開明顯的大小對比後,版麵變得更有張弛。

◇◆  2.色塊內的元素排版要有細節  ◆◇

很多設計師以為把信息分類排在色塊裏就萬事大吉了,其實每個色塊都是一個小版麵,裏麵各元素的排版也十分講究,比如不要把色塊填得太滿、文字要有大小對比,還可以用一些小元素進行裝飾。

▲由於色塊內的文字排版沒有花太多心思,所以這個版麵給人感覺不是很精致。

▲於是我給色塊內的手機參數做了一些細節的處理,使其對比更強、更有層次。

 

▲將色塊裏的信息優化排版後,總體感覺也更精致了。

◇◆  3.色塊顏色不要太多  ◆◇

如果一個版麵中的色塊比較多,就要盡量控製顏色的數量,因為顏色一多就容易花,一般情況下把色係數量控製在四種之內為最佳(同一色係的顏色可以有深淺變化。)

▲顏色過多,而且飽和度都很高,所以感覺有點刺眼。

▲把色塊顏色減少到隻有白色和黃色後,畫麵就變得和諧了很多。

◇◆  4.色彩搭配要講究  ◆◇

關於色塊的配色,蔥爺給大家分享幾個小技巧:

1.盡量不要把所有色塊都填充成高飽和度的對比色。下麵這張圖的配色就屬於這一類型,所以感覺不是很協調,看起來不太舒服的亞子。

2.用黑白灰搭配一個單色。黑白灰的包容性很強,既不會使畫麵太花,又能拉開層次、使彩色塊得到凸顯。

3.類比色搭配。無論是色相相連的類似色,還是色相相同隻是在飽和度或明度上不同的顏色,它們搭在一起都會比較和諧。

4.對比色搭配。對比色搭配當然也很常見,不過需要注意搭配技巧,前麵說了盡量別用全是高飽和度的對比色,比較穩妥的做法是用高飽和的顏色搭配低飽和度的對比色,或者是明度差別較大的對比色,如下圖:

◇◆  5.要適當打破色塊  ◆◇

如果把所有元素都放進色塊裏,整體效果會比較規整、統一,但同時也容易顯得刻板去,所以可以讓某些色塊元素適當地衝出色塊,加強動感和靈活性。

▲上圖把色塊進行傾斜扭曲形成了一點透視,形式比較新穎,但所有元素都在色塊內,整體缺乏衝擊感和張力。

▲把中間的人物拉大衝出色塊後,整體感覺是不是好了很多。

◇◆  6.各元素之間要有聯係  ◆◇

首先是各個色塊裏麵的元素,應該互相之間要有聯係而不是完全獨立的,其次是色塊內的信息與色塊外的信息也要有聯係,因為每一個色塊都要為整體的版麵效果負責,還有色塊與色塊也要有聯係。

▲在上圖中,雖然色塊內的文字排的不錯,都有嚴格的對齊關係,但是色塊與色塊之間、不同色塊的信息之間、色塊內的信息與色塊外的信息之間,聯係比較少,所以整體顯得有點亂。

▲而在上圖中,我加強了它們之間的聯係(主要通過對齊的方式),整體效果也得到了改善。

 

◇◆  7.不要太單調  ◆◇

統一是設計中的一大重要原則,但如果隻有統一,那整版麵就會很單調、沒有生氣,所以在用色塊排版時也要注意保持變化。比如不要把所有的內容全部放進色塊中,比如色塊的方向、大小、輪廓、空間要有變化等等。

上圖的色塊並不是矩形,並且幾個大色塊的形狀也是不一樣的。


上圖用背景中的斜色塊打破了主體中矩形色塊的刻板印象。

菱形色塊比矩形更靈活,但是對排版的文字和圖片有比較大的限製。

用一些異形的色塊,或者是把某些簡單的圖形當作色塊可以使版麵變得更活潑。

 

 

沒有哪一個技巧能保證做出高質量的設計,一件優秀的作品需要考量的因素很多,需要掌握的技能很多,我們不僅要知道有哪些設計技巧,還需要掌握使用這些技巧的方法,希望這篇文章對你有用。

 

作者:蔥爺

別把設計隻當成是排版、配色···

相關文章:

推薦設計

最新文章