一份普普通通、規規矩矩的設計

一份讓人印象深刻、新穎有趣的設計

 

差在哪？其實就差在三個字上！

“優秀的設計不是每一個細節都有亮點，而是弱化其他元素，讓某一個亮點最大化。”

 

今天“驫叔的設計心得”就來總結一下關於“字”的心得。

在設計和選擇字型前，我們要先想明白文字的功能是什麼？

 

從原始時期的人類在牆壁上畫下的那幾個抽象的符號，到殷墟發現的甲骨文，再到現在發展到上萬個現代文字。有各種各樣的文字形式，但其實它們的核心功能都是一致的：

 

“作為資訊的載體，記錄和傳播資訊。”

 

這是文字最為基礎，也是最為重要的功能，脫離了這一點，再花哨的設計也都是徒勞無功。

文字除了傳播資訊之外，本身的形態也能夠表現出強烈的情感與力量。就算你不瞭解語言的具體意義，也能通過字型圖形化的設計，瞭解到一部分特定的資訊。

 

所以完全相同的文字資訊，使用不同的字型，會傳遞出完全不同的感覺。

 

驫叔囉嗦這麼多，其實就是要你明白字型設計的目的，如果出發點錯了，步步皆錯。

“做一件事，先搞清楚目的，你才能搞清楚重點；搞清楚重點，你才能學會做事的時候從最重要的地方著手，次要的相對的忽略，從而達到最高的工作效率。”

 

搞清楚為什麼設計字型後，再看東西方文字的構造：

 

西方文字的結構：基線

西方文字是以水平線為標準進行構造的。從下往上，第二條線是標準的“基線”，幾乎所有的西方語系文字都是寫在這條“基線”上。

 

 

“X”高：

x高就是以x字母為準的高度。不同字型的的x高是不同的，所以基線也就會有變化。通常來說，x高比較大時，基線位置會靠上，小寫字母較大，會感覺行間距比較狹窄。x高比較小時，大寫與小寫字母的差距較大，視覺上行間距也會比較寬鬆。

 

 

字腔

像是C或O這種字母，中間的空白稱為“字腔”。字腔較寬的字型給人開放、輕鬆的感覺。字腔較窄的字型給人密集、力量感。

 

 

襯線體

 

襯線體大家肯定都不陌生，特點是字型兩端有襯線來裝飾。最早的襯線體是古羅馬時期石碑上刻畫出來的，別名為“羅馬體”的字型。這種字型兼具傳統感與易讀性，經常用作標題、正文。

襯線體又分為類似手寫的舊體（old style）傳統而有底蘊，和比例工整的現代體（modern style）現代和時尚感強一些。

根據襯線的不同（兩端的裝飾）可分為支架襯線體（弧形的襯線，溫柔親切傳統）、髮絲襯線體（直線構成，平整清晰）、板狀襯線體（粗厚的四角狀襯線）。

 

 

無襯線體

沒有襯線的字型，也就是末端沒有裝飾的字型，稱為“無襯線體”。和中文的“黑體”比較類似。

無襯線體的出現，是為了更加吸引注意，在板狀襯線體的基礎上，演變過來，隨後又發展出纖細的無襯線體。無襯線體的“x高”普遍比襯線體更大一些，字腔也比襯線體大。視覺上能夠給人力量感、現代感。

 

 

其他字型

哥特體“black letter”，是用筆尖扁平的筆書寫的。傳達出莊嚴感、高貴感、敬畏感、緊張感。

手寫體“s cript”，優雅、溫暖、親切感。

裝飾體“display”，用作廣告、海報的標題，有強烈的個性。

 

 

漢字的結構：字面

漢字是在正方形的格子裡設計的，文字所佔尺寸稱為“字面尺寸”。字號大小相同的字型，會因為字面尺寸的差異而大小不同。所以有時候兩種字型搭配在一起，雖然字號設定的一模一樣，但觀感差別明顯是不同的，原因就是這兩種字型的“字面尺寸”不同。

 

 

文字的骨架：

骨架也就是文字的基本結構和重心分佈。文字的骨架如果出問題，比如重心不穩，結構比例上不協調等，字型設計完之後將會變得很奇怪，而且很難修改回來。

 

 

胸線（也稱作字懷）：

胸線指的是字型內部空白處的寬度，胸線小的字型給人更加傳統的感覺。但是在較小字號時，會增加閱讀難度，給人感覺窄小萎縮，視覺上會感覺糊在一起一樣。胸線大的文字現代感更強，而且較小字號也可以輕鬆辨識。

 

 

宋體

橫線細，豎線粗，筆畫尾部加上襯線的稱為宋體。宋體字是最早的印刷字型，悠久的歷史和使用範圍給人傳統、底蘊、易於閱讀的印象。

宋體的襯線帶有銳角的（現代型宋體）給人感覺乾脆利落而強硬，襯線柔和的（傳統型宋體）給人感覺古典親和。要根據你想要表現的感覺來選擇字型，即使同為宋體，其性格也是有些許差異的。

 

 

黑體

 

橫線與豎線寬度一致的稱為黑體。黑體的出現是當時為了強化標題而發展出的字型，所以黑體的基因中就保留著“強而有力、強調、正式感”的基因。

傳統的黑體字，胸線比較小，更加凝聚、內斂，筆畫粗細也並非完全一致。現代黑體胸線較大，給人開放感、機械感、冰冷感。

 

 

其他字型

隸書起源於戰國，給人歷史久遠、神祕的感覺。

楷書也叫正楷、真書、正書。由隸書逐漸演變而來，更趨簡化，橫平豎直給人古典的感覺。

行書是在楷書的基礎上演變而來，給人更加流暢隨意的感覺。

而草書則是在行書上進一步簡化，給人灑脫、不拘一格、有氣度的感覺。但因其可讀性較低，所以不適合做正文。

圓體給人溫柔可愛、天真的感覺。

此外還有綜藝體、卡通體、雪山體，這些字型都有強烈的個性，適合表現鮮明的意向，但不適合做正文使用。

 

字族 

“腰線”指的是文字的粗細，只改變腰線粗細、字型寬度的系列字型稱為字族。標準的粗細為regular，再粗的稱為medium，更粗的稱為bold。按照寬度可以分為寬型的文字、窄型的文字。窄型的文字也叫窄體字或壓縮字，寬型的文字也叫擴張字或寬體字。寬體字更有力量感，壓迫感；窄體字更加挺拔、年輕。多用於標題。

同一家族的字型搭配，表現主次的基礎上，更能讓你的設計效果和諧一致。

 

不同字型的性格

 

文字是為了傳遞資訊而創造的，因為有資訊需要表達，所以我們才會寫下文章和文字。

而字型設計就是在保持傳遞具體資訊的基礎上，利用圖形和顏色等資訊來傳達文字所不具備的朦朧的性格。

文字受制於文化、語言的不同，會有各種隔閡。而圖形則不需要理解，沒有國界、語言、文化這些限制，用更低成本、更加直接的傳遞情感與資訊，成為更加有利的技巧。

 

 

格調感

一般來說有裝飾的襯線體，比無襯線體更加有格調、更顯精緻高雅。造成這種認知的原因則是宋體字的歷史更加悠久，長時間被人使用。所以本身就具有傳統、正統、高格調、底蘊的感覺。

除此之外，有襯線的字型大部分都有一個共同點，就是字型中有曲線，而曲線則能營造優美而華麗的感覺。想呈現出“高階感”，搭配合理的留白，以及文字的明度差別較弱的顏色，則更能強調出高階感與信賴感。

 

 

親和力

尖銳細長的東西會讓人感到緊張，例如日常物品刀子、針、尖銳的石頭等。圓潤的物體則讓人安心、感到親近。

文字也有同樣的心理作用，纖細、尖銳的文字，給人危險、難以靠近的印象；圓潤柔美的文字給人親近、柔和、可愛的印象。但過於渾圓的文字會給人孩子氣、不穩重的印象。另外，想呈現親近的印象時，儘量採用色彩亮度差異較小的顏色。

 

 

未來感

規則且如圖形般的文字，會讓人感受到新穎和科技感。文字的構成要素越簡單，抽象感越強，就更能呈現出一種未來感。所以，將文字改造的更加簡單，呈現“圖形化”就能呈現出科技感，或者用直線和圓相互連線來構造文字，搭配無彩色更能體現未來感。

 

 

復古感

想要表現出復古的感覺，就要先了解過去時代的風貌，復古就是還原出當時那個時代的風貌。比如要表現出上世紀的感覺，就要先了解當時流行什麼樣的字型、什麼樣的展示風格。

 

 

華麗感

18世紀後半葉人們開始在海報上，不斷增強文字的裝飾性，目的是為了吸引目光、拉開與其他商家的差別，並且這種重度裝飾的風格沿用到今天還會看到。文字的裝飾性越高，華麗感也就越強，但可讀性會變弱。所以要用在少數文字上，或者不需要被看懂的文字上。

 

 

文化底蘊

要體現傳統的文化底蘊，書法字型是最合適的選擇，書法分為篆書、隸書、楷書、行書、草書，合成書法五體。

需要注意的是，書法字型的運筆走勢和排列方式要一致，一般採用豎排的方式，橫排會顯得運筆不協調。

 

 

權威性

權威性來自於嚴謹、傳統、樸實。所以文字如果要營造出讓人信賴的氛圍，不適合過分裝飾，常規的字型更為適合，比如宋體、黑體這些常見的字型。排版上要寬鬆、易讀、有秩序感，不能雜亂無章，否則傳遞不出正式、值得信賴的感覺。

 

 

自然感

手寫的文字，會讓人感覺到溫度、自然、有生命力。但一般計算機裡的手寫字型會過於規整，所以要對每個字的大小和角度進行微調，賦予變化，更能凸顯自然的感覺，但不能調整不能過大，要控制在肉眼看不出太大變化的程度。

 

 

精緻感

單純的文字本身無法帶來“精緻”的感受。要體現精緻感必須有充足的留白，縮小字號、減少顏色的數量。此外，無襯線體比襯線體看起來乾淨利落，細體比粗體看起來乾淨利落。適當的新增大小強弱的對比，對於提升畫面精緻感有不小的幫助，具體方法參考驫叔之前的文章《如何讓你的設計脫穎而出》

 

力量感

直線、粗線條、有稜有角的文字，放大處理，能呈現出強硬、力量感。文字線條越粗，給人越強勁的感覺，粗細一致的無襯線體和黑體更具穩定感。搭配強烈的明暗對比和較小的間距，更能凸顯力量感。

 

 

女性化

 

細膩而有生命力的曲線，呈現出纖細和柔韌的美感，而且曲線比直線更柔和、有親和力。所以，柔和襯線的宋體字比黑體字更適合表現女性化、柔韌感。

 

說了這麼多，字型設計本質是在設計什麼？

 

你心裡應該已經有一個大致的方向，簡單的總結一下其實就是一句話：

字型設計的本質，是把文字當做圖形和影象來設計，更加直觀形象的傳達具象與抽象的資訊。

比如圓潤的圖形給人親和力、尖角的圖形給人凌厲感；直線給人乾淨利落的感覺、曲線給人柔美華麗的感覺……

 

​

關於圖形（點線面這些平面設計中的精髓）以及平面構成的形式，驫叔之後會為你單獨總結一份設計心得。

 

編輯：千鋒UI設計