我們剛畢業(yè)沒多久的職場小白，尤其害怕字體設(shè)計(jì)。也許在運(yùn)營畫面中的插畫部分他們從不懼怕，但在運(yùn)營畫面中的字體部分，卻無奈處于被字體設(shè)計(jì)支配的恐懼中。字體設(shè)計(jì)也許會有一定的難度，但只要方法得當(dāng)，將大的難度拆分成若干的小難度，逐個擊破，字體設(shè)計(jì)終將拿下。
我相信，只要我講的足夠詳細(xì)，字體設(shè)計(jì)你也可以手到擒來。
話不多說，馬上開始～
我做運(yùn)營字體字體大約分為三大步驟：
- A 前期：消化與思考（草稿探索）
- B 中期：電腦執(zhí)行（創(chuàng)意落地）
- C 后期：字體包裝（匹配畫面）
舉個栗子，我拿到的一個項(xiàng)目的主題是：全民招聘 助你納賢。
先大致介紹以下這個項(xiàng)目，這是一個關(guān)于招聘平臺面對 HR 和 Team leader 群體所做的一次召回促活的運(yùn)營活動，項(xiàng)目目的很明確。項(xiàng)目要求產(chǎn)出主 K、專場 H5 長圖，以及 Banner、彈窗等等延展設(shè)計(jì)物料。
項(xiàng)目設(shè)計(jì)產(chǎn)出的核心畫面就是主 K，主 K 主要由主題字體設(shè)計(jì)與主題畫面組成。這一次只針對字體設(shè)計(jì)部分展開。
要設(shè)計(jì)的字體為：全民招聘 助你納賢
前期：消化與思考（草稿探索）
標(biāo)題字體為：全民招聘 助你納賢
使用思維導(dǎo)圖的方式去思考標(biāo)題內(nèi)容與其含義，試圖提取可供設(shè)計(jì)創(chuàng)意的靈感關(guān)鍵詞。先放再收，先思維發(fā)散，再聚焦可行關(guān)鍵詞，用于創(chuàng)作。特別提醒：草稿部分我講的有些詳細(xì)，有一定字體設(shè)計(jì)水平的小伙伴可以快速閱讀或跳過。
上面的發(fā)散思維得到的關(guān)鍵詞，給了我對這款字體設(shè)計(jì)的大體感受：穩(wěn)重、力量、有細(xì)節(jié)。
字體設(shè)計(jì)技法：
- 粗線條 粗筆畫 粗字重。
- 通過連筆、斷筆、減少筆畫等達(dá)到簡化字體結(jié)構(gòu)。
- 字體右上角皆有尖角細(xì)節(jié)。
1. 草稿
接下來是草稿部分了。草稿我一般用兩種方式：一種是直接紙筆繪制，（紙最好用網(wǎng)格網(wǎng)點(diǎn)草稿紙，筆的話就無所謂了，能畫即可）；另一種是手繪板，加 ps 繪制，好處是可以隨便修改、調(diào)整。
2. 定好字體位置
這一次，我是用手繪板加 ps 繪制草稿的。在 ps 新建文檔后，于畫面中，首先畫好一個字框，偏矮穩(wěn)重，然后一式八份，排成兩行，這就定好了標(biāo)題八個字的位置了。
然后在字框圖層之上，新建一層新圖層，繪制字體草稿。先快速按照自己當(dāng)前也許并不太成熟的想法快速落筆成圖在紙上，畫不好也沒關(guān)系，再做調(diào)整即可。
到這一步就畫了個大概了。然后就可以好好觀察字體哪里需要修改、調(diào)整、優(yōu)化了。
細(xì)心的朋友一定觀察到了，上面部分我畫了一些小字，還有字體草稿中有幾個字是被我涂黑了的。其實(shí)是有原因的：
- 之所以畫那些小字，是因?yàn)槲以谧鲎值倪^程中，會遇到某字某筆畫畫的不太順，于是我在邊上畫一個小體量少細(xì)節(jié)的字體草稿，可方便并快捷的檢測出我理想中的最佳方案。
- 之所以有幾個字被我涂黑，是因?yàn)閮H靠線條我無法判斷字體結(jié)構(gòu)是否合適，字體筆畫是否粗細(xì) OK，筆畫的曲線弧度是否準(zhǔn)確。（有些字就是這么“神奇”，不好判斷）
賢字的又部分，改的很完美。之前是一橫一折一畫圈一甩尾往右下方去，雖說有創(chuàng)意但是不夠簡練，要么筆畫擁擠在一起影響了美感與識別，要么為了識別把筆畫調(diào)細(xì)從而完成無法顧及整款字體的一致性。
把又部分做了簡化，既保持了一致性，保持整款字體筆畫粗細(xì)的視覺平衡，又兼顧了整款字體的美感，簡潔、可識別、有美感。
逐步把其他字涂滿。不斷觀察，不斷調(diào)整優(yōu)化。
現(xiàn)階段：
- 全字，中規(guī)中矩，不好不壞。
- 民字，右下角的捺，粗細(xì)和曲度都有待優(yōu)化。
- 招字，可以。
- 聘字，左邊寬了，需窄點(diǎn)，右邊窄了，需寬點(diǎn)。
- 助字，湊合。
- 你字，右邊的豎勾的筆畫過細(xì)，包括兩邊的點(diǎn)也過細(xì)。
- 納字，絞絲旁不太舒服，轉(zhuǎn)折比較生硬。
- 賢字，很 OK。
字體草稿已全部涂滿黑色。開始非常有利于整款字體整體觀察，F(xiàn)階段，整款字體中的八個字，它們的視覺重量有著微妙的不一致。全字矮了，招字窄了，納字又感覺過寬了。
草稿就是這樣，需要不斷調(diào)整。且用手繪板+ps，修改起來是非常的便捷，這一點(diǎn)是紙筆無法比擬的。
- 全字高了一些，好了很多。
- 聘字左右兩邊的寬度做了調(diào)整，比例舒服了很多。
- 納字的絞絲旁的折角處選擇性做了圓潤處理，與整款字體搭配更為協(xié)調(diào)。
- 你字右邊的上面部分筆畫做了角度調(diào)整處理，整體協(xié)調(diào)了不少。
- 你字右邊部分的豎勾筆畫，已加粗，有所改善。依然有優(yōu)化空間。
- 民字依然不太舒適，主要是那一捺的筆畫。
咳咳，打起精神了哈！好，繼續(xù)～
民字右下角那一捺有了很大的變動。曲度與收筆的方向，都做了很大的調(diào)整（如上圖）。使得民字整體更為穩(wěn)重，視覺上更舒適。
到了這一階段，基本已經(jīng) OK 了，就是一些查漏補(bǔ)缺與整體比對調(diào)整。
比如：你字右邊豎勾的兩邊兩邊兩點(diǎn)的筆畫做了角度與粗細(xì)調(diào)整，使得你字更為簡約有意思。還有整款字體筆形粗細(xì)與筆畫之間縫隙大小都做了微調(diào)。
八個字體每個字右上角都添加了尖角。為字體增加了一些個性化元素。
在筆畫之間疊加處選擇性做缺角處理，增加了筆畫之間的層次感。比如全字中的王部分，上面兩條橫筆與豎筆的兩個相交處。還有民字、招字等等每個字都會挑選合適的位置做這個缺角處理。
到此，草稿階段已完成。接下來是電腦執(zhí)行階段。
在此，我想說一段話：上述的草稿，只是其中的一種，不同的草稿方式，適合不同的字體風(fēng)格設(shè)計(jì)，適合不同的設(shè)計(jì)師，有些字體風(fēng)格甚至根本不需要草稿。我這里只是提供了其中一種方式，給沒有經(jīng)驗(yàn)的字體設(shè)計(jì)小白一種可能性。它不是唯一，僅此而已。
中期：電腦執(zhí)行（創(chuàng)意落地）
將字體草稿圖置入 AI 中（或 CDR，或你用的其他矢量軟件中），在上面繪制對應(yīng)的字身框，兩行八個。然后用線條或者矩形按照草稿的樣子先繪制出來。
這一步，兩個要點(diǎn)：一是快，二是像。
雛形出來也許在你眼中盡是不完美，沒有關(guān)系，我們慢慢來優(yōu)化它們。
說個“插播內(nèi)容”，絕對是干貨知識點(diǎn)？瓷蠄D，是元素都在框選后的狀態(tài)，便于觀察一個設(shè)計(jì)師做設(shè)計(jì)的套路、技巧、方法。我毫無保留為君奉上。
第一：
上圖的字體部分，你留心觀察會發(fā)現(xiàn)，有線的狀態(tài)，也有面的狀態(tài)，線還是有直有曲，面有矩形也有平行四邊形。我是不太分什么矩形造字鋼筆造字的，無論是風(fēng)格還是技法都不能這么機(jī)械的分，因?yàn)樵谖铱磥硭鼈兪请S時會被用來組合的。
線條一般用在彎曲造型的筆畫，塊面一般用在直來直去造型的筆畫，很多單個文字的筆畫中，會有直有曲，所以線與面一起搭配造字，會更為合理。
第二：
上圖中在文字的周圍有看不見的白色方塊(選中元素的情況下方能看到)，它們是非常有用的。我管使用它們的方法稱之為障眼法。它們主要起到遮擋筆畫的作用，特點(diǎn)是：臨時性、即時性、可逆性。
臨時性是說，它只是暫時的遮擋，當(dāng)字體設(shè)計(jì)最終完成以后，它便會功成身退。字體筆畫原本被遮擋的部分就會被剪切掉。
即時性是說，它的遮擋，起到了我們可以隨時檢查自己所做字體是否 OK 的作用。這會讓我們造字更為高效。
可逆性是說，當(dāng)我做的這個筆畫做的不 OK，我可以在白色遮擋塊面下面隨時調(diào)整字體筆畫。比如上圖中的助字的力部分的撇筆畫，這筆畫下面就是用白色塊遮住的，如果左下角的彎曲程度不夠，我可以在白色塊下面調(diào)整，如果是這筆畫的長度不夠，我可以下移白色遮擋塊面。
這一步，給字體添加縫隙，營造一丟丟時尚感科技感。上圖中的 AI 繪制字體元素底下是有草稿圖的，干凈的效果可看下圖。且上圖是選中元素的效果，方便大家觀察。
上圖文字四周放置好多小色塊，它們是做縫隙的參照物。它們有兩種厚度的版本，一種單位 1 厚度，一種是單位 2 厚度。單位 2 厚度是單位 1 厚度的兩倍，也就是單位 1 厚度：單位 2 厚度=1：2。它們的分工略有不同，根據(jù)編排中的親密性原則，單位 1 厚度的小色塊主要負(fù)責(zé)單獨(dú)筆畫被切斷的效果；單位 2 厚度的小色塊則主要負(fù)責(zé)字體中偏旁部首之間的縫隙。
嗯～做了縫隙效果后的字體整體更透氣了，效果很棒。
按草稿來，右上角需添加尖角。增加了一點(diǎn)點(diǎn)個性化。這部分在草稿階段也講了不少要點(diǎn)，下面講些新的知識點(diǎn)。
「民招聘助納賢」這 6 個字皆為常規(guī)尖角操作，右邊都是垂直切的；全和你字則有所不同。先說全字，處理完常規(guī)尖角操作后，整個筆畫末端會顯得略重且不美觀，因此，在該筆畫末端的尖角效果下方也做了上弧的效果，讓其更為自然、美觀、視覺合理。再說你字，右上角所做尖角效果下方的筆畫是有傾斜角度的，因此尖角效果需順著傾斜角度去切順，即可。
這是增加尖角后的效果。
在藍(lán)圈位置，做了缺角的效果，從而達(dá)到類似字體筆畫之間投影的效果。
這種效果屬于錦上添花，我選取的位置是字體結(jié)構(gòu)合理，筆畫關(guān)系符合層級關(guān)系且有必要做這種投影效果的。在你字這里我就相對克制，只有一個位置用了，在納賢兩字這里甚至一個都沒有，因?yàn)槲艺也坏胶侠硇裕筒蛔隽。（在這些選取的位置做了缺角效果后我會整款字體一起感受、審核的）
設(shè)計(jì)并不是為了做而做，一個特點(diǎn)并不合適所有字體，因?yàn)樽煮w結(jié)構(gòu)不同。不要搞混了“一致性原則”與“為了做而做”，這是克制，這是度的把控。
這是字體字形最終效果的呈現(xiàn)。一款穩(wěn)重、有力量、有些小個性的字體設(shè)計(jì)。
希望你喜歡。
后期：字體包裝（匹配畫面）
字體設(shè)計(jì)，是為在運(yùn)營畫面中的標(biāo)題所服務(wù)的，光是字體字形擺上去還不行。還需要有字效。這是字體字形加了字效的最終效果，加了描邊，加了網(wǎng)格效果投影，且做了簡單的排版包裝。在運(yùn)營視覺中，字效的種類也是多種多樣的，有錯層效果，有立體效果，有粗描邊效果，有漸變效果，有局部色塊效果？粗黝}類型而選合適的效果。
做字體設(shè)計(jì)，是一個需要耐心的過程。這篇教程，我算是耐住性子，用了耐心與勇氣，努力把自己做字過程中的所思所想所做，全部“落筆成文”，為你獻(xiàn)上，算是我們一起交流、學(xué)習(xí)。如若你能從中有所收獲，我會非常開心的。
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任，
本站有權(quán)保留或刪除有爭議評論。
參與本評論即表明您已經(jīng)閱讀并接受
上述條款。