2019-3-12 用心設(shè)計(jì)
如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請(qǐng)點(diǎn)這里
排版就是要將版面中必要的元素進(jìn)行有序組織、擺放，在空空如也的畫(huà)板里把一堆雜亂無(wú)章的東西排得好看并不容易，簡(jiǎn)單的對(duì)齊排列？結(jié)果可能是既單調(diào)又呆板，如果全憑感覺(jué)加些幾何大色塊，又覺(jué)得太大眾，且跟自己的品牌和主題沒(méi)有直接的關(guān)聯(lián)，怎么辦？今天蔥爺給大家分享一個(gè)實(shí)用的排版方法：圖形排版法。
什么是圖形排版法？說(shuō)白了其實(shí)就是用圖形來(lái)承載文字或者圖片。
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ù)圖形排列促銷(xiāo)信息
▲用房屋的形式排列信息
▲用購(gòu)物券的形式排列促銷(xiāo)文字
▲用蒸籠圖形排列圖文
▲用廣告牌的形式排列文字和圖標(biāo)
那么，像上面這種采用圖形排版法的設(shè)計(jì)是怎么操作的呢？可以簡(jiǎn)單分為四步：
觀察版面上需要排列元素的多少與形式。舉個(gè)例子，以下是一本農(nóng)產(chǎn)品小冊(cè)子其中1P的文案，冊(cè)子的成品尺寸為w110x200mm。
客戶(hù)只提供了這些文字，從上圖可以看到，字?jǐn)?shù)并不少，且都是關(guān)于企業(yè)介紹的段落文字，顯然這些文字要集中排版，不過(guò)如果只是像上圖那樣簡(jiǎn)單的對(duì)齊，未免有點(diǎn)單調(diào)，最好引入圖片或者圖形加以豐富，由于沒(méi)有合適的圖片，所以我決定采用圖形排版法。
用什么樣的圖形才能把現(xiàn)有的元素組合起來(lái)呢？圖形的提取和選擇有三個(gè)方向：
1.根據(jù)文字的屬性來(lái)選擇圖形，比如下圖需要排版的內(nèi)文是一些優(yōu)惠信息，所以設(shè)計(jì)師選擇用優(yōu)惠券的圖形來(lái)承載文字。
2.根據(jù)圖片來(lái)選擇圖形，比如下圖需要排列的元素中有很多產(chǎn)品，所以設(shè)計(jì)師用盒子與展示臺(tái)的圖形來(lái)承載它們。
3.根據(jù)設(shè)計(jì)（品牌）調(diào)性來(lái)選擇圖形，下圖是一個(gè)春節(jié)期間的電商側(cè)欄，所以設(shè)計(jì)師用燈籠圖形來(lái)作為排版的載體。
現(xiàn)在，我們?cè)倩剡^(guò)頭來(lái)看看前面說(shuō)的這個(gè)畫(huà)冊(cè)設(shè)計(jì)例子，這里需要排版的元素并無(wú)圖片，而企業(yè)簡(jiǎn)介類(lèi)的文字也提取不出合適的圖形，所以依據(jù)品牌調(diào)性來(lái)選擇圖形是最靠譜的，哪些圖形可以使用呢？
由于這是一個(gè)主打天然、健康的農(nóng)產(chǎn)品品牌，所以很容易想到太陽(yáng)、山、白云、樹(shù)、葉子、花等圖形，在這些圖形中，哪一個(gè)最合適呢？
我們可以根據(jù)以下幾條標(biāo)準(zhǔn)來(lái)選擇：
1.圖形與品牌調(diào)性要相符；
2.圖形的造型要盡量簡(jiǎn)單；
3.圖形要美觀；
4.要適合承載內(nèi)容；
5.圖形的形態(tài)要適合版面尺寸。
由此可見(jiàn)，葉子圖形是最合適的。因?yàn)槠湓煨妥詈?jiǎn)單比較好承載文字信息，不會(huì)影響到閱讀性，并且也更便于在狹長(zhǎng)版面中運(yùn)用。
即使確定了采用什么圖形來(lái)排版也還有很多要注意的地方，比如同樣一個(gè)元素，可以設(shè)計(jì)成很多不同的圖形，它們所產(chǎn)生的效果也會(huì)有很大差別。一般來(lái)說(shuō)，抽象的、幾何化的圖形會(huì)比具像化的圖形更合適，因?yàn)榍罢吒?jiǎn)潔、更適合排版、更有設(shè)計(jì)感，下圖是樹(shù)葉圖形的兩個(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ù)框，如下圖：
當(dāng)然，如過(guò)版面中只是光禿禿的一個(gè)圖形加上其中的文字，還是會(huì)有些單調(diào)，所以需要再加以補(bǔ)充、優(yōu)化，首先要在輪廓之外也放一些文字，比如頁(yè)碼和標(biāo)題等，然后背景也可以與圖形呼應(yīng)，比如這里用了與葉子呼應(yīng)的森林圖片（背景做了高斯模糊處理）。
現(xiàn)在我們可以看到，版面的右上角明顯有點(diǎn)空，而且整體上還缺少一些對(duì)比關(guān)系，于是我把葉子的圖形復(fù)制出兩片，分別排列在主體右上角和左下角作為點(diǎn)綴，到這里這個(gè)小頁(yè)面的設(shè)計(jì)就完成了。
圖形排版法可以使版面變得更有趣、更有創(chuàng)意，但是用不好也容易造成呆板、生硬的感覺(jué)，所以，最好不要把所有文字都限制在圖形范圍內(nèi)，上面的例子雖然簡(jiǎn)單，但基本上回答了運(yùn)用圖形排版會(huì)遇到的主要問(wèn)題。最后請(qǐng)大家記住，版面中沒(méi)有哪一個(gè)元素是獨(dú)立的，要始終站在整體的角度來(lái)設(shè)計(jì)每一個(gè)局部。
藍(lán)設(shè)計(jì)( www.jghy.net )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.jghy.net