本文詳細剖析11款字體設(shè)計的全過程。設(shè)計+解析+動效，以最簡單易懂的方式，合成一篇字體設(shè)計分享文章，希望你會喜歡，并留言交流。

字體設(shè)計對設(shè)計師來說應(yīng)該是蠻重要的技能，甚至可能說是最基本的技能，因為經(jīng)常用到這項技能，比如標(biāo)志標(biāo)準(zhǔn)字體、海報、主題活動主畫面、線上Banner等等。

做一款字并不難，難在做好一款字。

做字流程

先講講我的做字流程：

• 確定要做的字
• 理解和消化字的含義
• 網(wǎng)上搜尋相關(guān)參考資料
• 邊想邊畫手稿
• 電腦執(zhí)行（軟件AI）
• 潤色包裝

下面案例會重點講解電腦執(zhí)行（軟件AI）這部分，包括初稿、過程稿、亮點詳解、難點剖析等等，還有一些在特點字風(fēng)格下的做字要點。

三大原則

在這次的分享中我更多的從設(shè)計技法的緯度去剖析，在創(chuàng)意層面則會稍微提一下。

我在設(shè)計大部分的常規(guī)商業(yè)字體時，會嚴(yán)格遵守三條原則，分別是：

• 中宮外擴
• 慎用技法
• 重量一致

1. 中宮外擴

中宮收緊這種情況一般只存在在書法字體中，顯得緊湊有力。

中宮外擴一般適用于方方正正的標(biāo)準(zhǔn)美術(shù)字，即常規(guī)商業(yè)字體設(shè)計，使用此形式會讓字體寬松而且更規(guī)整。

因此這兩種形式并沒有好壞之分，視情況而定。

2. 慎用技法

這里的技法是指字體設(shè)計時可以增加字體的設(shè)計感形式感的一些技法，比如：連筆斷筆、筆畫特征點綴。

技法需克制使用，如若泛濫使用，則會使字體降低了美感，甚至丟失了識別度，過猶不及。

比如下圖中設(shè)計的字體，是什么內(nèi)容？你是否還看得出來呢？

「感官」二字能看得出來，后面兩字是否無法識別，只能連蒙帶猜了呢？是的，因為識別性太弱了。字體設(shè)計的識別度嚴(yán)重不夠，恰恰是因為忽視字體結(jié)構(gòu)造成的。

我個人覺得，美觀性和識別度同等重要，好比一雙筷子缺一不可。

切記不可一味追求炫技，需克制，把握好技法使用的度。需要更多考慮字體的識別性和美觀度。

3. 重量一致

重量一致是指在一款字體設(shè)計中，在視覺上每一個字都保持均等的分量，也就是在視覺上感覺每個字都一樣重。

舉個例子，如下圖中的「一二三四國馨」，這些字的筆畫從一筆到二十筆遞進，疏密各不一致，為了達到視覺上一致的分量，在筆畫少的字體中筆畫調(diào)得相對粗一些，而筆畫多的字體則將筆畫調(diào)得相對細一些，從而達到整體協(xié)調(diào)。

下面讓我們進入具體字體案例的分析中吧。

第1款

1. 前期思考

當(dāng)拿到這個主題的時候，我想到的是唯美、古典。定下字體氣質(zhì)，便按這個方向找尋合適的參考。

在搜尋參考的時候我突然想到了古建筑的屋檐，也想到了用海浪的形態(tài)，即把四個字做成海水流動的既視感。

最終考慮到古建筑屋檐的特征更有唯美氣質(zhì)，屋檐特征更為抽象簡約，可以不繁瑣且巧妙鑲嵌在字體筆畫中，與之共生，因此選了這個創(chuàng)意點。

2. 繪制手稿

3. 字庫字體結(jié)構(gòu)參考

接下來進入電腦執(zhí)行，首先我會打「海棠未雨」幾個字庫字體放在一邊，便于隨時參考字體結(jié)構(gòu)，也能避免自己當(dāng)局者迷犯低級錯誤。

4. 雛形

用鋼筆工具勾勒出基本型。

3. 初稿

做字時需不斷檢查「單個的字」和「整體的字」。

單個的字：主要檢查字體內(nèi)部偏旁部首之間的位置距離是否協(xié)調(diào)，再就筆畫與筆畫之間的親疏關(guān)系。

整體的字：主要檢查各字體的重量是否一致。

總而言之就是觀察字體的「識別性」和「美觀度」。

現(xiàn)階段，感覺「棠」字略寬，「未」字略小，「雨」字高了。

4. 調(diào)整

字體細節(jié)調(diào)整之后舒服了很多，好多方角部分做了「倒圓角」處理，更耐看了。

做到這一步，感覺整款字體已經(jīng)沒有什么大毛病了，但依然平平無奇。

5. 增強字體古典氣質(zhì)

加入了古建筑屋檐的抽象形，融入每一個字的某一筆畫之中。添加了字體唯美、古典的氣息。然后在筆畫交匯處都做了「溢墨」處理（一般書法字才會有墨水溢開的效果），更加深了字體的古韻味道。

6. 一些思考

其實還有好多細節(jié)都在設(shè)計過程中做了恰到好處的優(yōu)化。比如：「棠」字上面三筆，中間高兩邊低，為了識別也為了美觀。比如：有古建筑屋檐特征的筆畫的位置安放考慮，相鄰兩字之間的屋檐特征筆畫是堅決不能對齊，按這個標(biāo)準(zhǔn)加上因地制宜的調(diào)整后，呈現(xiàn)出錯落有致富有美感的一幅畫面，仿佛遠處有一座座高低不同的古建筑，還飄著雨。

7. 做字全流程GIF圖

8. 包裝

第2款

1. 繪制手稿

2. 字庫字體結(jié)構(gòu)參考

3. 初稿

快速把基本形執(zhí)行出來。

字體結(jié)構(gòu)：屬于上緊下松。

字體特點：

• 筆畫橫細豎粗。
• 橫筆右端傾斜處理。
• 字體的記憶點在于「來」字的撇和捺，其他字也同樣保持這樣的特征。

4. 添加字母點綴

5. 優(yōu)化

「來日方長」四字緊湊排版。點綴字母使用更小字重，為了弱化點綴字母，固在每兩行之間添加了橫桿，更顯精致。

6. 最終稿

最后調(diào)整一下細節(jié)，比如整體特征筆畫的處理，比如「長」字右下角斷筆的處理。

7. 做字全流程GIF圖

8. 包裝

第3款

1. 版式1

繪制手稿

字庫字體結(jié)構(gòu)參考

初稿

該款字體為繁體字，第一和第四個字筆畫繁多，第二第三個字筆畫略少，因此在設(shè)計時候需要特別考慮到「重量一致」的設(shè)計原則。

字母點綴

現(xiàn)階段每個字體的風(fēng)格還不算非常統(tǒng)一（基本統(tǒng)一，但還不夠）。

修改調(diào)整

「方」字嘗試另一種可能，「方」字為了在風(fēng)格上與「來」字更統(tǒng)一、呼應(yīng)，因此修改成下圖的方案。「長」字的繁體字右下角做了調(diào)整，更加協(xié)調(diào)了。

橫版最終方案

經(jīng)過再三衡量對比，還是覺得「方」字左下角那一畫，一筆下來更有力量感，有具設(shè)計感。「長」字保持上圖最終方案。

之前「長」字右下角那一筆跟「方」字左下角那一筆嚴(yán)格對稱呼應(yīng)傾斜度，從而忽略了長字的整體協(xié)調(diào)性和穩(wěn)重感。做了調(diào)整之后協(xié)調(diào)穩(wěn)重多了。

2. 版式2

繼續(xù)試一試另外的排版，探尋更多可能性。

手稿

新的版式新的味道

在上面加了一些數(shù)字與線條的裝飾，更顯精致。

由于版式的不同，「日」字本身字體的寬度受限，考慮到拉寬會改變字義（寬則為「子曰」的「曰」）。因此，把「日」字左對齊上面的「來」字，將中間的橫筆破型出頭到右邊，正好填補了該處的空白，更與每個字的最長橫筆呼應(yīng)。

做字全流程GIF圖

包裝

第4款

設(shè)計這款字體時，我并沒有繪制手稿。而是找到了優(yōu)秀的字體設(shè)計作品作為參考，這個參考的字體內(nèi)容并沒有出現(xiàn)「放肆喜歡」中任何一個字。只要能把握住字體設(shè)計的核心特征，皆可借鑒。

1. 字庫字體結(jié)構(gòu)參考

老樣子，電腦執(zhí)行打一行字庫字體（一般用常規(guī)黑體）作為字體結(jié)構(gòu)參考。

2. 分析參考設(shè)計筆形特征

分析到位了，看透所找參考的字體設(shè)計作品的主要特點，或者說風(fēng)格，將對接下來的造字執(zhí)行非常有利。

3. 雛形

在整體上，四字之間的視覺重量不一致。在細節(jié)上，很多細節(jié)的處理并不到位，顯粗糙。

4. 初稿

比前面雛形好了很多，但重量依然不一致。理由是兩邊的字筆畫少，中間的字筆畫多。

還有一個問題是「放」字和「歡」字右邊上面那一「撇」屬于這款字的顯著性的特征，中間的「肆」字和「喜」字卻沒有體現(xiàn)。

5. 調(diào)整

「放」「肆」「歡」在風(fēng)格和視覺重量上都達到了標(biāo)準(zhǔn)，唯獨「喜」字差點意思。

6. 集中發(fā)力設(shè)計「喜」字

集中發(fā)力設(shè)計「喜」字，嘗試更多的可能性。

7. 多嘗試總有驚喜在等你

嘗試了好幾款不同的「喜」字，最終找到了滿意的結(jié)果。

坦白說當(dāng)時嘗試到最后這個「喜」字的時候，心里還是挺愉悅的。

8. 最終稿

最終呈現(xiàn)可以說在標(biāo)準(zhǔn)線以上。字體風(fēng)格特征統(tǒng)一，字體視覺重量基本一致。

特別講解一下「喜」字。「喜」字筆畫多，因此在兼顧識別性與美觀度的前提下，如何調(diào)成風(fēng)格一致和重量一致呢？

最上面那一橫筆做斷筆處理，避免筆畫多而造成的「密不透風(fēng)」。中宮也外擴，即「士」部分最下面那橫筆、兩個「口」部分的寬度都處在一個合適的占比，因此在視覺重量上與其他三字是一致的。最難的點來了，這個字橫筆太多，共有7條橫筆，懸殊于其他字。怎么解決呢？把兩個「口」部分的下面一橫去掉（并沒有影響識別性），然后兩口之間那部分（喜）兩點一橫合并成一筆，中間直兩邊翹起，翹起部分剛好有那兩點的特征，因此整體識別性也滿足了。

這個「喜」字，用了斷筆、連筆、共用的手法，但呈現(xiàn)出來的效果是簡潔的，跟其他字舒適共存了。

做字不刻意，不炫技，技法手法都是為了達到合理結(jié)果所用的手段。

9. 傾斜處理版本

水平傾斜10度，垂直傾斜7度，就有下面這種效果了。

10. 做字全流程GIF圖

11. 包裝

第5款

我很喜歡這個主題，竇唯有一首歌就叫《高級動物》。

這是一款純粹且凌厲的字，尤其是大刀闊斧的字胚之上加了一些尖角。帶刺的感覺總能讓我想到動物們的爪子和抓痕。

我做字，很克制，不喜炫技，拒絕多余的素材。就好比陳丹青所言，書的封面干干凈凈最有書的樣子，最像是書。書如此，字亦如此。但我玩心也大，遇見特別的風(fēng)格也喜歡嘗試。克制與放肆同行，一切看心情。

1. 繪制手稿

2. 字庫字體結(jié)構(gòu)參考

3. 初稿

4. 整體優(yōu)化

• 「高」字和「級」字各一處筆畫做斷筆處理。
• 「動」字右下角做減法。
• 「物」字左右部分寬度調(diào)節(jié)，左加寬了一些；三筆斜筆角度趨平調(diào)節(jié)。

整體排版緊湊調(diào)整，整體字體筆畫按視覺重量一致原則做了統(tǒng)一調(diào)節(jié)。增加字母點綴，字體為「Din」。

5. 增強字體個性化特征

在每個字右上角添加尖角細節(jié)，讓字體更顯鋒利。在每個字最右邊豎筆下端左側(cè)添加尖角細節(jié)，宛如動物利爪。

6. 傾斜處理更有動勢

水平傾斜10度，讓字體更具動感。

7. 做字全流程GIF圖

8. 包裝

第6款

1. 繪制手稿

2. 字庫字體結(jié)構(gòu)參考

3. 雛形

在AI中使用鋼筆工具，要么豎要么橫的直線勾勒出字體的大致形態(tài)。

「高」字的橫筆有6筆，與其他字相比過多，因此把兩個「口」字部分各去掉一橫，豎筆雙雙相連。看起來更簡約，也更具備設(shè)計感了，而且視覺重量也與其它三字更一致了。兩「口」部分雖都缺了一筆，但它們共用之間一橫筆，在視覺上它們就像從有距離的兩個方形變成零距離的兩個方形，因此識別性并沒有被削弱。

4. 筆畫圓化軟化+添加字母點綴

5. 優(yōu)化

將字體「線」轉(zhuǎn)為「面」，也就是AI軟件里將字體的線條路徑「輪廓化描邊」成為面狀圖形，然后合并。接著針對筆畫相交處做「溢墨」效果，也就是在軟件里針對交匯處的節(jié)點選中然后做「倒圓角」處理。

修改點綴字母的字體，由「Din」的字庫字體改成了「Rubrik」，風(fēng)格上更加匹配了，理由是，「Rubrik」這款字庫字體的風(fēng)格也是外形屬于圓弧狀，筆端為圓頭，跟我設(shè)計的中文字體風(fēng)格一致。

留心的朋友應(yīng)該察覺到了，「高級動物」這兩款不同風(fēng)格的中文字體，與之匹配的字母字體也是不同的。

6. 最終稿

7. 輕微包裝

8. 做字全流程GIF圖

9. 動效包裝

閃爍抖動的效果讓字體更鮮活更有生命力。你是否也會有這種感覺呢？

第7款

1. 繪制手稿

2. 字庫字體結(jié)構(gòu)參考

3. 限定字體外框區(qū)域+網(wǎng)格參考線+鋼筆工具按手稿勾勒出基礎(chǔ)結(jié)構(gòu)線條

這類風(fēng)格字體調(diào)節(jié)起來會相對比較麻煩，限定字體的外框區(qū)域，有利于節(jié)約不必要的試錯成本。

4. 字體基礎(chǔ)結(jié)構(gòu)線條

5. 設(shè)置字體筆畫樣式

調(diào)節(jié)好字體筆畫線條的粗細。調(diào)節(jié)線條纏繞的走向與前后關(guān)系，只要營造繩索纏繞的感覺即可。

6. 最終稿

在字體筆畫上添加一些小細節(jié)，尤其是轉(zhuǎn)折處，有點像是小高光，多了一些質(zhì)感。添加字母裝飾。字體中英文復(fù)制粘貼在底部，并放大，降低不透明度，效果蠻有意思的，有點像字體裝于透明塑料袋里面。

7. 嘗試不同配色

8. 做字全流程GIF圖

9. 包裝

歡迎添加作者微信：