如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里

 

排版就是要將版面中必要的元素進(jìn)行有序組織、擺放，在空空如也的畫板里把一堆雜亂無章的東西排得好看并不容易，簡(jiǎn)單的對(duì)齊排列？結(jié)果可能是既單調(diào)又呆板，如果全憑感覺加些幾何大色塊，又覺得太大眾，且跟自己的品牌和主題沒有直接的關(guān)聯(lián)，怎么辦？今天蔥爺給大家分享一個(gè)實(shí)用的排版方法：圖形排版法。

什么是圖形排版法？說白了其實(shí)就是用圖形來承載文字或者圖片。

圖形排版好處

1、更易排版：在圖形里排版，可選擇性更少，所以更容易。

2、更有趣：用與內(nèi)容或品牌相關(guān)的圖形排版，本身就是個(gè)有趣的創(chuàng)意。

3、更整體：把設(shè)計(jì)元素聚集于圖形內(nèi)排列，自然顯得更整體。

4、更有助于：信息傳達(dá)圖形本身也可以傳達(dá)出一部分信息。

常用于電商設(shè)計(jì)和海報(bào)設(shè)計(jì)中：

▲用電視機(jī)圖形排列主播頭像和介紹文字

▲用膠片圖形排列圖片和文字

▲用展示架圖形排列游戲裝備和文字

▲用紅包和單據(jù)圖形排列促銷信息

▲用房屋的形式排列信息

▲用購物券的形式排列促銷文字

▲用蒸籠圖形排列圖文

▲用廣告牌的形式排列文字和圖標(biāo)

那么，像上面這種采用圖形排版法的設(shè)計(jì)是怎么操作的呢？可以簡(jiǎn)單分為四步：

一、觀察

觀察版面上需要排列元素的多少與形式。舉個(gè)例子，以下是一本農(nóng)產(chǎn)品小冊(cè)子其中1P的文案，冊(cè)子的成品尺寸為w110x200mm。

客戶只提供了這些文字，從上圖可以看到，字?jǐn)?shù)并不少，且都是關(guān)于企業(yè)介紹的段落文字，顯然這些文字要集中排版，不過如果只是像上圖那樣簡(jiǎn)單的對(duì)齊，未免有點(diǎn)單調(diào)，最好引入圖片或者圖形加以豐富，由于沒有合適的圖片，所以我決定采用圖形排版法。

二、思考

用什么樣的圖形才能把現(xiàn)有的元素組合起來呢？圖形的提取和選擇有三個(gè)方向：

1.根據(jù)文字的屬性來選擇圖形，比如下圖需要排版的內(nèi)文是一些優(yōu)惠信息，所以設(shè)計(jì)師選擇用優(yōu)惠券的圖形來承載文字。

2.根據(jù)圖片來選擇圖形，比如下圖需要排列的元素中有很多產(chǎn)品，所以設(shè)計(jì)師用盒子與展示臺(tái)的圖形來承載它們。

3.根據(jù)設(shè)計(jì)（品牌）調(diào)性來選擇圖形，下圖是一個(gè)春節(jié)期間的電商側(cè)欄，所以設(shè)計(jì)師用燈籠圖形來作為排版的載體。

現(xiàn)在，我們?cè)倩剡^頭來看看前面說的這個(gè)畫冊(cè)設(shè)計(jì)例子，這里需要排版的元素并無圖片，而企業(yè)簡(jiǎn)介類的文字也提取不出合適的圖形，所以依據(jù)品牌調(diào)性來選擇圖形是最靠譜的，哪些圖形可以使用呢？

由于這是一個(gè)主打天然、健康的農(nóng)產(chǎn)品品牌，所以很容易想到太陽、山、白云、樹、葉子、花等圖形，在這些圖形中，哪一個(gè)最合適呢？

我們可以根據(jù)以下幾條標(biāo)準(zhǔn)來選擇：

1.圖形與品牌調(diào)性要相符；

2.圖形的造型要盡量簡(jiǎn)單；

3.圖形要美觀；

4.要適合承載內(nèi)容；

5.圖形的形態(tài)要適合版面尺寸。

由此可見，葉子圖形是最合適的。因?yàn)槠湓煨妥詈?jiǎn)單比較好承載文字信息，不會(huì)影響到閱讀性，并且也更便于在狹長(zhǎng)版面中運(yùn)用。

三、設(shè)計(jì)與排版

即使確定了采用什么圖形來排版也還有很多要注意的地方，比如同樣一個(gè)元素，可以設(shè)計(jì)成很多不同的圖形，它們所產(chǎn)生的效果也會(huì)有很大差別。一般來說，抽象的、幾何化的圖形會(huì)比具像化的圖形更合適，因?yàn)榍罢吒?jiǎn)潔、更適合排版、更有設(shè)計(jì)感，下圖是樹葉圖形的兩個(gè)不同設(shè)計(jì)方向。

顯然右邊簡(jiǎn)化后的效果比左圖效果更合適。圖形設(shè)計(jì)好后當(dāng)然就要把文字排上去了，文字排版的方式有兩種，一種是沿著圖形的內(nèi)輪廓繞排（如左圖），一種是在圖形輪廓內(nèi)自由排版（如右圖）。

使用第一種排版方式能使文字與圖形結(jié)合得更自然，適合字?jǐn)?shù)比較多且呈段式的文字；使用第二種排版方式的優(yōu)點(diǎn)是不需要完全受限于輪廓，更靈活，適合字?jǐn)?shù)比較少的文案，很顯然，在本例中更適合采用輪廓繞排。

提示：在AI中，把文字工具移動(dòng)到圖形的路徑處，當(dāng)出現(xiàn)如下圖標(biāo)時(shí)，單擊鼠標(biāo)左鍵便可以輸入文字了，而且每一行文字的起始都會(huì)沿著圖形的內(nèi)輪廓排列。

在菜單欄文字選項(xiàng)中點(diǎn)擊區(qū)域文字選項(xiàng)，即可調(diào)出參數(shù)框，如下圖：

四、補(bǔ)充與優(yōu)化

當(dāng)然，如過版面中只是光禿禿的一個(gè)圖形加上其中的文字，還是會(huì)有些單調(diào)，所以需要再加以補(bǔ)充、優(yōu)化，首先要在輪廓之外也放一些文字，比如頁碼和標(biāo)題等，然后背景也可以與圖形呼應(yīng)，比如這里用了與葉子呼應(yīng)的森林圖片（背景做了高斯模糊處理）。

現(xiàn)在我們可以看到，版面的右上角明顯有點(diǎn)空，而且整體上還缺少一些對(duì)比關(guān)系，于是我把葉子的圖形復(fù)制出兩片，分別排列在主體右上角和左下角作為點(diǎn)綴，到這里這個(gè)小頁面的設(shè)計(jì)就完成了。

總結(jié)

圖形排版法可以使版面變得更有趣、更有創(chuàng)意，但是用不好也容易造成呆板、生硬的感覺，所以，最好不要把所有文字都限制在圖形范圍內(nèi)，上面的例子雖然簡(jiǎn)單，但基本上回答了運(yùn)用圖形排版會(huì)遇到的主要問題。最后請(qǐng)大家記住，版面中沒有哪一個(gè)元素是獨(dú)立的，要始終站在整體的角度來設(shè)計(jì)每一個(gè)局部。

藍(lán)設(shè)計(jì)( m.dzxscac.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì)