閱讀706 字體下載    go 字體新聞


一篇絕對能改變你對字體認知的干貨

更新時間:2017-06-20 11:07:18

  今天這篇文章對一部分人來說可能比較基礎,介紹的內容也非常多,篇幅也非常長。因為我怕大家對字體不是很感興趣,所以我就把各種知識點做了整理,然后以這樣的方式來輸出,好讓大家先對字體有個簡單的了解。

  這絕對是改變你對字體認知的一篇文章,所以收藏絕對沒壞處。如果,你看完這篇文章突然就對字體感興趣了,請你也告訴我,我知道之后會對字體的某個知識點做深入解析,帶大家更好的學習字體。

  沒看這篇文章之前,也許你覺得自己對字體已經很了解了,但是請相信我,這僅僅是你以為的而已。(為什么我讀這句話的時候,感覺自己很牛逼,啥都懂似的…)

  在平面設計中,字體的重要性毋庸置疑了,從海報到雜志,基本都要以字體做根基。然而,真正懂字體的人其實不多。

  在最近兩年里,字體慢慢又被大家重視起來,因為在 UI 設計中,字體的運用也慢慢多了起來,雖然大家看到的 App 更多的是系統自帶的字體,但是『為什么iOS 會更換新字體』、『這類產品為什么要這樣對字體進行排版』等等都是 UI 設計師應該需要懂的。

  那么這期我們就先從以下五個方面來講講字體:

  怎么開始入門字體

  文字的構成

  你所理解的字體分類也許是錯的

  中英文字間距的講究

  案例展示

  怎么開始入門字體

  看過我文章的人都知道,我是上個月開始學習文字(字體設計),我大概買了 14 本書(本來是 12 ,后面又買了 2 本關于文字進化史的書籍)進行閱讀及學習。

  


  我比較喜歡以「塊狀時間」學習知識,然后建立自己的知識體系,再從理論到實踐(理論是閱讀書籍,實踐是字體設計練習)。不過我為了寫這篇文章,也看了目前市面上已有的一些字體相關文章,而且被各平臺轉發,且閱讀量很高,但其實很多知識點在認知上是有錯誤的,也許已經誤導了不少人。所以我一直推薦通過書籍來學習知識,文章只是了解概況,是別人總結的結果,所有學習動作都要帶有質疑的心態進行判斷。(廢話有點多了)

  首先,你要簡單了解字體的歷史,從「哥特體」到「黑體」,最早的「羅馬體」到「宋體」,以及日文的「明朝體」。了解它們之間的關系,好比對待朋友一樣。

  對理論知識有了一定了解之后,你就會知道:「宋體」是入門字體設計首要掌握的,你需要了解它的結構、體飾,然后去 AI 里進行臨摹,把字當成一張圖來對待。

  這樣進行大概一周時間(我是一周,每天臨摹 5 個宋體字,要非常仔細),開始繼續去理解字體的其他知識(在這期間,臨摹字體是不能中斷的)。如字體排版、字重、字間距和行間距等等,然后再繼續練習,理論結合實踐,進步就會非常快。

  


  文字的構成

  學習文字的相關知識,必須先從文字的構成開始。構成文字的元素會因為文字的起源不同而相差很大,這里尤其要把中文和英文拆開來說,因為本身它們就是不同的體系,只是現在很多并不專業的人,把它們混為一談了。

  英文的字體結構是由四條平行線組成。這四條(其實是五條,但是大寫字母線這里要忽略)平行線中,由下往上數的第二條是用來當做標準的『基線』,西文中,單個字母的所有立腳點都是在這條線上(除了 g、j、p、y)。而根據不同的字體,平行線的位置也會發生改變,這也是為什么文字結構會多種多樣的原因。

  這里就要說到大家經常聽到但是并不非常理解的一句話了:小寫字母的高度要以 「x 高」為重要標準。(給你們重點說說)

  因為平行線是可以根據你想要設計的字體結構做出改變的,所以 「x 高」就代表了中間兩根線的位置。當「x 高」大的時候,就會感覺小寫字母比較大,因為「x 高」決定了幾乎所有小寫字母的高度(除了 b、h、y 等有頭有腳的字母)。所以在設計英文字體時,要非常注意每個小寫字母的高度,這也是為什么大部分優秀的字體設計師,設計其他作品時,會更注重細節的原因,因為他們設計字體就純講究細節。(不是說其他設計職業不注重細節,只是沒字體這么講究)

  


  舉個例子:字母 「C」和「O」

  C 和 O 這種字母中間的空間被稱為「字腔」,「字腔」較寬就會給人輕松、自由的感覺;「字腔」窄,就會顯得很密集、具有力量的感覺。

  


  之前看到有人說英文字母,放的越大,間距就必須越小,否則識別性就很低,這絕對是錯誤的觀點。

  下面再看中文字體的套路。

  做 UI 的都設計過 Icon 吧?設計中文字體就跟設計 Icon 是一個道理。同樣有一個虛擬框,在框里的字體大小,被稱為「字面尺寸」,它也是根據不同的字體結構而改變的。

  中文的字體結構被稱之為「骨架」,它決定了這個字體的整體形象。圖片中標明的一處被稱之為「胸線」的位置,它也很重要,「胸線」小的字體更具復古風,更能表達傳統的韻味;相反,「胸線」大的字體會更具現代感。這也是為什么有些中國風的作品中,字體看起來會特別不一樣的原因,我們會選擇字體「胸線」小的文字,去表達傳統風。

  


  你所理解的字體分類也許是錯的

  我們經常會聽到別人說:襯線體、無襯線體。沒錯,英文字體確實有分襯線體(如 Atheias)和無襯線體(如 Helvetica),以及其他字體(如 哥特體)。

  有人問:宋體和黑體呢?

  前幾天我還正好在一個群里看到有人給另一個人解答什么是襯線體,什么是無襯線體,他說:像宋體,勾勒明顯的就是襯線體;黑體,筆畫比較平的就是無襯線體。這是一個認知上的錯誤。

  中西方的字體是不能一概而論的,宋體跟襯線體相似,不代表宋體等于襯線體,這個認知要糾正一下。(看完這段是不是要爆炸?原來一直都理解錯了?)

  先說英文:歷史上最早的襯線體叫「羅馬體」,在紙質印刷中,襯線體經常被使用在正文以及標題,它被分為兩類:舊體、現代體。

  舊體的特點是類似手寫體,比較沒有規則,給人傳統的感覺;現代體比例較工整。襯線現代體適用于標題,襯線舊體適用于文章內容。

  如果要繼續細分,襯線體還可以被分為三種類型:支架型襯線體、發絲型襯線體、板狀襯線體;而我們今天看到的大部分襯線體都是板狀襯線體,同時也是舊體的一種。

  無襯線體稍簡單一點,主要分為:古典體、現代體、溫暖體(這個溫暖體我一直沒找到合適的字眼來表示)。與襯線體不同的是,我們現在看到更多的是現代無襯線體。

  


  具體怎么分類我就不展開說了,展開說的話篇幅會更長,沒興趣的人可能就不往下看了,有興趣的人自己自然會去查資料。

  再說中文:中文主要也分三類:宋體、黑體、其他(包括楷書、行書)。

  其實上面有一段我說中文字體的時候已經說了很多了,所以這里就不展開繼續了,只說兩個點:印刷方面我們更多的會用到宋體做正文內容的字體,而 UI 設計中,黑體或無襯線體會更讓眼睛舒適(這是最近翻閱國外文章時看到的最新研究)。

  中英文字間距的簡單說明

  舉個例子:「我在馬路邊,撿到 one 塊錢」;「我在馬路邊,撿到one塊錢」

  這句話大家應該注意到,第一句,我把「到」和「塊」中間的「one」做了個空格處理。所以看起來會更舒服,相比于第二句,顯得更輕松,自由的感覺。這也是為什么我寫文一直以來都做這樣處理的原因。

  我覺得很多人寫文章或文檔,都沒做到這點,只能說做事情不是很仔細,沒有認真考量這些細節,同時也說明做事情的態度…(好了,我就不裝*了)

  比如我公眾號的文章,我會在兩邊留一個間距,讓讀者更好的集中視覺焦點,不會逃離手機屏幕的邊緣。我大概去年中旬開始這樣做之后就一直被模仿,也正說明了它確實是有效果的。

  


  希望大家平時做排版的時候,一定要注意中英文字間距的問題,以及段落邊緣的處理。這些細節,能讓你的作品看起來更加精致。

  案例分析

  學習字體設計大概三周時間,我有幸接到一個小項目:給一家日式料理店設計一個字體 Logo。

  一刀日式料理,杭州一家剛開的日式料理店,店鋪風格走得是新日式風,帶一些傳統元素。在與委托人聊完后,得到幾個關鍵詞:日式、素雅、簡約。 以此設計店鋪字體 Logo:一刀。

  一開始毫無頭緒,于是找了日式料理的歷史翻閱了下,發現有很多人對日式料理的店鋪字體 Logo 有一個錯誤的了解,即:用「勘亭流」做基礎來設計。而這類字體大部分是用在日本相撲與歌舞伎町專門的宣傳上的。

  在了解了一個大概情況后,我有了一點點的思路。就先動手找了找感覺,可惜并沒找到新的形式。

  


  但是讓我想到了字體組合的形式,之后就在思考兩個字的組合是否可以有比較簡單的方式,且能夠清晰明了的看出品牌名稱。于是找了古文的宋刻本找案例,看看古文體是否有值得借鑒的。

  


  在翻閱資料的過程中,看到一本小冢明朝的字體,于是以它與古文體的「宋 · 米芾 · 離騷經」做了一個簡單結合,畫出了下面這個「刀」。

  


  開始看著這個刀字,覺得風格太過老式,不符合新日式的調子,所以還是想做一個更改。

  在做了多次更改之后,還是覺得差點感覺,正好翻看到左佐設計的“百年映像”,覺得這個橫筆的細體可以沿用,所以也試了一下。這里的「刀」字都是初設,細節都沒有調整。

  其實到這里,對這塊還不是很滿意,左邊的刀有雅,但是不夠素。而右邊的刀太韌,從食品角度而言少了些許引誘性。

  


  根據得到的這兩個字,再次上手稿去找感覺,無意中畫出一稿接近我理想中的樣子。正好我將刀的橫筆做了個簡化,利用格式塔原理讓觀者產生共鳴。也正好結合了「一」和「刀」這兩個字。最后加上委托人給我的印花,搭配字體。

  


  然后我結合了日本料理的店鋪招牌設計,找了一張這種花式肌理的圖片作為背景,完成了這次委托任務。

  下面是定稿圖。

  


  上一個:go 關于字體適用性詳解
  下一個:go 論文創產品設計中的逆向思維



战争游戏 p3试机号 福彩开奖 上海时时彩 麻将棋牌神辅助器 稳赚挂机方案 吉林时时彩计划 中国体育彩票大乐透 上海时时彩最快开奖结果 安卓美女麻将游戏下载 上海时时乐 大西洋娱乐城 安徽25选5开奖结果 棋牌手游辅助制作教程 天津11选5选号方法 体球网spbo 中国竞彩比分比分直播