作者：Martin_K，來源：16創(chuàng)藝
原標(biāo)題：怎么做？才能讓文字編排更出彩

在之前視覺設(shè)計(jì)文章中，我把視覺設(shè)計(jì)大致羅列了四個(gè)方向，更多的是希望能夠?yàn)榇蠹規(guī)硪恍┡Ψ较?，在設(shè)計(jì)的路上不那么困惑迷茫，視覺設(shè)計(jì)本身涵蓋的范圍就比較廣，同時(shí)也沒有什么衡量的標(biāo)準(zhǔn)和具體的特征，只有依賴于商業(yè)的服務(wù)中才能更加客觀地體現(xiàn)出最終的視覺價(jià)值。

很多小伙伴留言說太籠統(tǒng)了（也有不少水軍偷偷潛入），在羅列的四個(gè)方向中字體的應(yīng)用在《字言字語》系列文章中已經(jīng)寫的比較多了，大家可以自行翻閱學(xué)習(xí)，本篇文章同樣立足于視覺設(shè)計(jì)的角度，對字體的編排進(jìn)行詳細(xì)的贅述，在視覺設(shè)計(jì)中通過什么樣的方式才能讓文字編排更加出彩？

一、什么是文字編排？

文字編排是一種藝術(shù)創(chuàng)作過程，是通過藝術(shù)的手段將平面中的文字組成要素，在符合閱讀邏輯的前提下加以重新組合調(diào)度，并在結(jié)構(gòu)及色彩上作整合安排的一種視覺傳達(dá)方式，它是一種重要的視覺傳達(dá)語言，是一門相對獨(dú)立的平面設(shè)計(jì)藝術(shù)，也是設(shè)計(jì)師必須要熟練掌握的一項(xiàng)基本技能。

01

圖1：

很多情況下，當(dāng)我們把文字進(jìn)行有序的排列之后就會(huì)誤認(rèn)為是編排，其實(shí)只是把文字正常的輸出來而已，并沒有進(jìn)行任何的修飾和編排，雖然是大家都比較熟悉且容易認(rèn)知的類型，但作為設(shè)計(jì)師則會(huì)失去應(yīng)用的職責(zé)，在不添加任何效果修飾的情況下，正常的文字編排很難出彩營造較好的視覺效果。

圖2：

而當(dāng)我們針對固有的文字信息通過藝術(shù)的手段對其進(jìn)行重新組合，在保證信息有效傳遞的同時(shí)也使文字自身具有一定的視覺藝術(shù)效果，這種處理方式只是針對文字本身的結(jié)構(gòu)特征重組，并非是依賴于整個(gè)版面使其具有較好的視覺效果，這種方式我們則可以稱為文字編排設(shè)計(jì)。

文字也是版式中的重要元素之一，在利用整個(gè)版式對文字進(jìn)行合理的排布時(shí)而不是針對文字自身進(jìn)行編排時(shí)，則可以稱之為版式設(shè)計(jì)，而在設(shè)計(jì)中兩者通常結(jié)合在一起進(jìn)行使用，讓畫面的視覺效果更加出彩。

02

圖1：

實(shí)際應(yīng)用當(dāng)中，文字在經(jīng)過層級和大小對比的基本劃分處理之后，按照正常的閱讀習(xí)慣使文字井然有序的進(jìn)行排列，這種方式也是常規(guī)的編排形式，雖然沒有什么大的問題，但就視覺而言，畫面和文字都還不夠出彩，難以滿足設(shè)計(jì)的基本藝術(shù)表現(xiàn)；對設(shè)計(jì)師而言，不僅僅只是把文字進(jìn)行有序的排列。

圖2：

當(dāng)對所有的文字劃分好層級和調(diào)整好對比之后，并對文字之間的關(guān)系和排列融入一定的藝術(shù)美感表現(xiàn)，在保證信息可以有效準(zhǔn)確傳遞的同時(shí)，使文字更加的出彩耐看，同時(shí)也直接影響到整個(gè)畫面視覺表現(xiàn)，文字自身的編排可以說是最基本的技能之一，好的文字編排可以為視覺效果起到積極的作用。

版文編排則是在文字自身編排的同時(shí)又對版式進(jìn)行適當(dāng)?shù)膭澐郑敳看髽?biāo)題中則是利用了英文的字體結(jié)構(gòu)進(jìn)行編排，使小英文字母與左邊的中文相呼應(yīng)以保證版面和文字編排的平衡，在設(shè)計(jì)中通常會(huì)使用到兩則結(jié)合的情況下進(jìn)行使用，同時(shí)也體現(xiàn)出了文字的自適應(yīng)和它適應(yīng)。

二、文字結(jié)構(gòu)

在對文字編排設(shè)計(jì)時(shí)需要對文字的機(jī)構(gòu)基礎(chǔ)有一定的了解，很多情況下文字的編排即是對結(jié)構(gòu)的編排重組，在調(diào)整字與字之間的結(jié)構(gòu)時(shí)完成較為出彩的，具有藝術(shù)表現(xiàn)的文字編排；文字的結(jié)構(gòu)可以根據(jù)中文和英文兩種不同的字體語言進(jìn)行劃分。

01 中文結(jié)構(gòu)

中文是基于方格的基礎(chǔ)上創(chuàng)作而成，單個(gè)文字的結(jié)構(gòu)只存在于方格內(nèi)，而文字編排則是利用單個(gè)文字和文字與文字之間的結(jié)構(gòu)調(diào)整，打散重組等等藝術(shù)的設(shè)計(jì)手段完成具有一定藝術(shù)性美感的文字編排。

中文字體結(jié)構(gòu)在基于方格的基礎(chǔ)之上進(jìn)行縱向或者橫向延伸，不管如何延伸均是基于田字格把方格劃分曾四等份，給予文字編排更多的可依據(jù)空間，拋開創(chuàng)意文字和特殊文字結(jié)構(gòu)來說，即使不會(huì)字體設(shè)計(jì)，同樣可以利用相對穩(wěn)定的字庫文字結(jié)構(gòu)做一些精致的編排。

在相同的一句文字當(dāng)中，把整句話的首字提取作為主視覺，并把文字之間原有的結(jié)構(gòu)適當(dāng)?shù)拇蛏⒅亟M，大文字和小文字同時(shí)占據(jù)一個(gè)方格，使其以新的結(jié)構(gòu)形式呈現(xiàn)，增強(qiáng)文字編排的視覺效果。

中文字體的結(jié)構(gòu)相對來說比較統(tǒng)一，但缺少節(jié)奏感，在文字編排時(shí)則需要對文字的結(jié)構(gòu)適當(dāng)?shù)恼{(diào)整，以增加文字的節(jié)奏感營造舒適具有創(chuàng)造性的文字編排，同時(shí)滿足文字編排自身的自適應(yīng)提升視覺效果。

02 英文結(jié)構(gòu)

在英文字體中，無襯線體和襯線體的結(jié)構(gòu)區(qū)別不是太大，其主要差別在于大寫與小寫的字母上，而單個(gè)字母的結(jié)構(gòu)應(yīng)用更多的是在于內(nèi)部負(fù)空間和自身的結(jié)構(gòu)上，英文字體相對中文來說，利用結(jié)構(gòu)進(jìn)行編排起來更加的靈活多變，但也是基于小寫字母上拉伸和下拉伸之間的空間內(nèi)加以利用。

1、單個(gè)字母

在英文字體中，針對單個(gè)字母進(jìn)行編排時(shí)皆是以自身結(jié)構(gòu)為出發(fā)點(diǎn)，對其結(jié)構(gòu)和內(nèi)部負(fù)空間加以利用，使其達(dá)到具有藝術(shù)性編排的目的，相較于大寫字母而言，小寫字母則會(huì)比大寫字母多了一個(gè)拉伸的可操控部分。

2、詞句

當(dāng)英文以詞組或者句子出現(xiàn)的時(shí)候，通常會(huì)伴隨著大小寫英文使用法則混用的情況，這樣就會(huì)使得英文的節(jié)奏感更加強(qiáng)烈和多變，同時(shí)也為編排留下很多可操作的空間，無襯線體詞組內(nèi)部結(jié)構(gòu)可操作性相對襯線體而言空間較小，需要注意文字的選擇。

三、自適應(yīng)  它適應(yīng)

文字的自適應(yīng)和它適應(yīng)是相輔相成的，是由小見大，由局部到整體的過程自適應(yīng)如果是細(xì)節(jié)，它適應(yīng)則是骨架方向；文字即是獨(dú)立的個(gè)體存在，也是應(yīng)用的自身功能價(jià)值體現(xiàn)，在設(shè)計(jì)中無處不在的文字，其表現(xiàn)方式多種多樣，除了文字自身適應(yīng)和字與字適應(yīng)以外，還需要考慮其在不同場景和不同表現(xiàn)形式中的它適應(yīng)，以滿足視覺畫面的需求。

01 自適應(yīng)

圖1：

對文字而言，大多數(shù)處理的方式只是把精力花費(fèi)在文字的選擇，調(diào)整文字之間的間距和行間距上面或者調(diào)整一下對比等一些簡單的常規(guī)處理，從而忽略了對文字藝術(shù)性的編排設(shè)計(jì)，最終則是平淡的排列，并沒有讓文字自身具有一定的視覺效果。

圖2：

在現(xiàn)有的文字基礎(chǔ)之上，先考慮所有文字進(jìn)行自身的編排，使其本身具有一定的視覺效果，即使在沒有畫面的置入的情況下也同樣會(huì)出彩，而文字自身的編排就是文字之間的自適應(yīng)能力，在這種情況下會(huì)把文字的選擇，間距，行距等等一系列細(xì)節(jié)問題暴露出來，這是一個(gè)由局部到整體嚴(yán)謹(jǐn)把控。

當(dāng)把文字自身的自適應(yīng)處理好之后，不管如何應(yīng)用只會(huì)讓畫面更加的出彩，但同時(shí)還需要文字編排的它適應(yīng)；

02 它適應(yīng)

圖1：

在實(shí)際案例中更多的是以正常的保守方式進(jìn)行排列，或者是因?yàn)楫嬅娴闹黧w太過于特殊和呆板，導(dǎo)致了我們對畫面的想象局限性，即使做在文字之間做了一些對比和細(xì)小的變化，但卻難以撐起整個(gè)畫面的視覺效果，而讓想要表達(dá)的主題內(nèi)容大打折扣。

圖2：

當(dāng)根據(jù)畫面的構(gòu)圖或者版式對文字進(jìn)行編排時(shí)，更多的會(huì)依賴于版式的排布只重視文字在畫面中的位置，大小，而文字與文字之間的自適應(yīng)則會(huì)忽略，雖然沒有太大的問題，但卻很難讓整個(gè)畫面更加出彩一些，以滿足我們理想中最終視覺效果。

自適應(yīng)與它適應(yīng)則是互為依存的，如果畫面中只重視自適應(yīng)在實(shí)際應(yīng)用中則會(huì)顯得不太協(xié)調(diào)，即使文字編排比較出彩，但對整體來說則卻少把控，而只重視它適應(yīng)則會(huì)讓畫面的出彩空間受到局限。

四、注意事項(xiàng)

五、三種圖形  提升編排

在設(shè)計(jì)中文字編排可以說是最基礎(chǔ)的基本功，同時(shí)也是最難的基本功，是伴隨著設(shè)計(jì)職業(yè)生涯不可或缺的必備技能之一，不管在任何設(shè)計(jì)行業(yè)中設(shè)計(jì)師經(jīng)常都會(huì)與文字打交道，即使單一的文字編排也可以從其中看出設(shè)計(jì)的功力是否深厚；對于文字編排來說，在拋開版式的束縛之后，同樣可以利用幾何圖形的方式使文字編排達(dá)到我們理想中的效果，以提升畫面的視覺。

在設(shè)計(jì)中文字編排矩形化是使用最為普遍的方式，但也是集文字的自適應(yīng)和它適應(yīng)以及文字結(jié)構(gòu)為一身的綜合使用，是通過局部反應(yīng)整體的直接表現(xiàn)，其在畫面中主要可以對視覺產(chǎn)生平衡的作用，不管是橫向和縱向的左對齊還是右對齊都可以以矩形作為衡量的工具，同時(shí)也與中文造字的基礎(chǔ)不謀而合。

案例演示

以文字需求為例，這種情況通常是一些偏向概念的表達(dá)，對于概念的表達(dá)使用幾個(gè)圖形最為合適不過了，對文字信息分析之后我們要根據(jù)文字確定畫面中的主體。

新建一個(gè)畫布，然后針對需求文字信息分析之后，以圓形作為畫面的主體，接著對主體進(jìn)行適當(dāng)?shù)目坍嬏幚?，以滿足文字所要表達(dá)的具體的內(nèi)容，使其以可視化的方式呈現(xiàn)給觀者。

01

圖1：

根據(jù)文字要信息要表達(dá)的意思對設(shè)定的主體圖形進(jìn)行處理，找到一些相應(yīng)的素材直接剪貼蒙板到圓里面，并調(diào)整好合適的展示位置，然后對圓形添加內(nèi)陰影的圖層樣式，調(diào)整相應(yīng)的參數(shù)，以達(dá)到具有質(zhì)感立體的效果，在簡單的處理好單個(gè)圖形之后，與文字信息的“影”字還不太符合，需要進(jìn)一步對主體進(jìn)行修飾處理。

圖2：

把與圓形相關(guān)的所有圖層全部轉(zhuǎn)換為智能對象，然后并復(fù)制一層，執(zhí)行濾鏡中的扭曲－波浪化，這樣做主要是想表現(xiàn)出影和裂體的感覺，然后調(diào)整波浪化的圖層與圓形結(jié)合，使其成為圓形的倒影，波浪化的處理和最終的結(jié)合需要在不斷的調(diào)試中慢慢確認(rèn)下來，以更好的貼切需求想要表達(dá)的主旨意思，對圖形處理完之后接下來就是對文字信息的處理。

02

圖1:

在處理好畫面的主體之后，把所有的中文信息再翻譯成英文同時(shí)對所有的文字信息根據(jù)版面進(jìn)行集中性的編排，并對文字的選擇，間距，大小等等做相應(yīng)的調(diào)整，以矩形的編排形態(tài)形態(tài)呈現(xiàn)，這時(shí)則時(shí)以信息準(zhǔn)確傳達(dá)為基礎(chǔ)，反應(yīng)文字編排的自適應(yīng)。

圖2：

把文字編排好之后置入到畫面，而這時(shí)主要時(shí)考慮文字編排的它適應(yīng)是否可以與畫面融化一體，在保證信息可以準(zhǔn)確傳達(dá)的情況下具有一定的視覺效果為了讓文字編排的它適應(yīng)和畫面的平衡更加和諧統(tǒng)一，把不重要的英文調(diào)整到最底部，使其與整體形成一個(gè)統(tǒng)一的整體。

在設(shè)計(jì)中很多人認(rèn)為居中的對齊方式最不好把控，不知道該如何對文字段落，大小進(jìn)行合適的編排才能讓視覺效果更加舒適，尤其時(shí)在矩形的畫面中很難找到相應(yīng)的對齊參考依據(jù)，而三角形則可以很好的解決這一問題，讓文字居中對齊的方式有一個(gè)很好的藝術(shù)表達(dá)。

案例演示

新建一個(gè)畫布，然后把主體置入到畫面當(dāng)中，其主題是要表達(dá)一個(gè)視覺整合的意思，在進(jìn)行分析之后我們需要改變主體的形式以滿足需求。

圖1：

根據(jù)對主題的分析，以現(xiàn)有男性的主體作為輪廓，然后添加一個(gè)女性，使其代表整合的主題，然后在主題后面添加一個(gè)圓，并對圓添加一個(gè)紋理，使其具有質(zhì)感，圓在畫面中居中對齊，調(diào)整主題的位置以便為后續(xù)的文字留下編排的空間。

圖2：

以分欄法把整個(gè)版面劃分成四等份，主體部分和文字信息重點(diǎn)則是以對稱形式占據(jù)視覺中心，值得注意的就是文字重點(diǎn)則是以矩形的編排形式作為輪廓載體，而其他文字則是以對稱三角輪廓載體，在局部松散的情況下以外輪廓三角平衡畫面視覺。

圓形在文字編排中相對應(yīng)用的較少一些，由于自身的特點(diǎn)通常會(huì)在一些特殊的表達(dá)中應(yīng)用，不易大面積的使用或者作為文字編排的參考，相對難度較大不以掌控，對于正常的閱讀來說容易給人們造成靈活，閱讀不便的感覺，在版面中恰當(dāng)?shù)募右允褂脠A形時(shí)則可以很好的體現(xiàn)出創(chuàng)意性。

案例演示

新建一個(gè)畫布，把主體置入到畫面當(dāng)中，以帶毛邊的圓形作為主體，同時(shí)也是大家經(jīng)常會(huì)遇到的圓形主體，然后打破常規(guī)形式編排以讓畫面更加出彩。

圖1：

先針對基礎(chǔ)圓形主體適當(dāng)?shù)倪M(jìn)行處理，對其添加相應(yīng)的質(zhì)感以增強(qiáng)其視覺的表現(xiàn)力，處理方式則是尋找相應(yīng)的紋理素材直接剪切蒙板到圓形當(dāng)中，并適當(dāng)?shù)恼{(diào)整位置以及所要表現(xiàn)出的質(zhì)感，根據(jù)想要的效果執(zhí)行相應(yīng)的處理方式即可。

圖2：

在處理完主體之后，對于文字的編排來說，以正常的矩形或三角形式正常編排則會(huì)顯得太過于形式的平淡，而利用圓形的編排則可以很好的于主體相呼應(yīng)，但針對整體而言，版面則會(huì)顯得過于靈活，在這種情況下則需要對文字編排的它適應(yīng)加以調(diào)整。

六、最后總結(jié)

在視覺設(shè)計(jì)中，文字編排也是基于網(wǎng)格系統(tǒng)而進(jìn)行的，不同的是編排重點(diǎn)出來版面之外，也更加重視文字自身的編排，文字的編排好壞可以直接影響到畫面的最終效果，圖形化的文字編排只是簡單的一部分，也是一種很好的表現(xiàn)方式，更多的是需要設(shè)計(jì)師不斷的研究積累以突破現(xiàn)有的自身瓶頸，換一種設(shè)計(jì)思維方式會(huì)有意想不到的收獲。

經(jīng)授權(quán)轉(zhuǎn)載至數(shù)英，轉(zhuǎn)載請聯(lián)系原作者
來源：16創(chuàng)藝（ID：yelloart）