分享|如何讓你做的字體看起來更有美感

資訊頻道 - 設(shè)計技 來源:中國設(shè)計在線 作者:cdo 2020-09-15

不知道大家有沒有遇到過這樣一種情況,我們在做字的時候,發(fā)現(xiàn)做好的兩個字死活搭不到一塊,明明字分開看都沒有問題,可是放在一起就感覺不太對。如果我們做的字出現(xiàn)了這種不搭的情況,肯定是因為字與字之間存在著不同。今天的這節(jié)課,我們給大家講解一下,如何讓你做的字體看起來更和諧。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

想要解決這種不搭的問題,我們可以從兩方面下手。第一個就是減少字與字之間的不同之處,第二個則是增加文字之間的相同之處,去掩蓋字的不同。我們先從治標(biāo)又治本的減少不同開始講。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們先來看下這四個字,可能乍一看會覺得沒啥問題,可是我們仔細盯著會發(fā)現(xiàn)其實這四個字根本不搭。歡字比樂字大了許多,今字的重心又要比宵字低許多。為什么會出現(xiàn)這種情況呢?我們把這四個字分開看,他們也并沒有什么太大的問題。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

其實這四個字是我分別用了四個字庫字體修改的,刨除了他們的體飾之后,我們會發(fā)現(xiàn)他們的骨骼區(qū)別是很大的,也正是因為他們骨骼上的不同,導(dǎo)致了這四個字看起來不搭。所以我們要減少不同,首先就從骨骼開始講。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們依舊分別從中宮、重心、字面和灰度四方面來講解,先來看看中宮。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

從視覺上來說,中宮大的字會更多的占據(jù)字面框,看上去也會顯得比較大一些,而中宮小的則顯小,這也是為什么中宮不同的字放在一起會顯得不搭。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

來看個實際的例子,現(xiàn)在畫面中重塑的這兩個字是不是感覺不太搭?這里我們可以通過字面框內(nèi)字體外側(cè)的負空間去判斷中宮的大小,我們在底下疊一個字面框,就可以發(fā)現(xiàn)重字的四周還是有一些負空間,而塑字則幾乎占滿了字面框,所以他們的中宮的差距是比較大的,導(dǎo)致了視覺上的大小不一致。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們分別調(diào)整一下這兩個字,調(diào)整中宮之后的他們就舒適多了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

接著來講一下重心,重心不一致除了會讓文字看起來不搭之外,重心的頻繁上下跳動也會讓閱讀更加的疲勞。屏幕上馬賽克這三個字重心就非常的不一致,馬字重心在中間,賽字重心偏低,而克字偏高。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

經(jīng)過調(diào)整之后,這三個字也就更和諧了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

然后是字面,我們在字體設(shè)計第一課中用過這四種圖形去類比成四種外輪廓不一致的文字。如果將他們上下端物理對齊的話,他們在視覺上其實是不平衡的。所以得對他們進行一些視覺上的修正,適當(dāng)?shù)卣{(diào)節(jié)他們的字面。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

除此之外,這里再補充一個新的知識點,就是筆畫多的字需要放大一些,筆畫少的字需要縮小一些。例如畫面中椅子這兩個字,子字看著要比椅字大了許多,可是他們的字面大小是完全相同的。將子字縮小一些之后才顯得大小比較一致。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

舉一個更加直觀的例子,畫面中繁體字的國字看上去要比囚字小一些,可是其實這兩個字的外輪廓無論是大小還是形狀都是完全一致的。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后回顧一下灰度,灰度主要指的是對于筆畫少的字,筆畫應(yīng)該相對應(yīng)的粗一點,筆畫多的字,筆畫則應(yīng)該細一些。現(xiàn)在畫面中的士字就是與另外兩個字差不多粗細的,可是在視覺上士字明顯是要偏細的,看上去顯得特別弱。所以要將士字加粗一些,讓字體之間的灰度差距別太大。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

除此之外,日本字體設(shè)計師成澤正信提出過一個理論,他說對于首尾兩字都是筆畫特別少的詞組,那么首尾的這兩個字需要在已經(jīng)視覺加粗過后的基礎(chǔ)上,再加粗一些,不然詞組會顯得有些無力。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

關(guān)于骨骼的內(nèi)容我們就講到這里,也許你們會覺得這么多需要微調(diào)的地方很難記。那么這里我再給大家介紹一條總結(jié)前面內(nèi)容的定律。古希臘的智者普羅泰戈拉說過一句話叫「人是萬物的尺度。」這句話或許是錯誤的哲學(xué)觀點,可是在設(shè)計中卻是一句真理。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

用通俗點的話就是眼睛才是最準(zhǔn)確的衡量標(biāo)準(zhǔn)。因為我們很難總結(jié)出筆畫少的字要比筆畫多的字小多少,筆畫得粗多少。視覺上的調(diào)整是難以量化的。所以最簡單的方式就是用眼睛去判斷,看著細了就加粗,看著小了就放大。

不過我們也需要尊重每一個漢字的不同,沒有必要把不同的文字強行調(diào)成一模一樣,所有字都一模一樣,那么字也就不再是字了。漢字不同于西文,可以均勻地分布。漢字天生就是有筆畫多少的區(qū)分,有重心的高低,有外輪廓的不同,所以漢字在閱讀的時候也能產(chǎn)生西文不具備的節(jié)奏感,這或許也是漢字的魅力所在。所以我們在做字的時候,追求的是文字之間的和諧,而非絕對一致。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

前面我們講的主要是骨骼上視覺的不搭,接下來我們來分析一下骨骼上氣質(zhì)的不搭。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

文字的氣質(zhì)最常見的是傳統(tǒng)氣質(zhì)和現(xiàn)代氣質(zhì)。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

對于傳統(tǒng)和現(xiàn)代這兩種氣質(zhì)來講,影響最大的是中宮。剛剛我們展示的這兩個東字除了視覺上大小不一之外,他們氣質(zhì)也是相悖的?墒菫槭裁粗袑m大的會具有現(xiàn)代感,而中宮小的會具有傳統(tǒng)感呢?

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

那是因為在西文的字體設(shè)計中,他們更注重文字內(nèi)部的負空間均勻分布,外部的負空間則可以通過字間距進行調(diào)節(jié)。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

而中文中由于有字面框的存在,在設(shè)計字體時需要考慮內(nèi)白和外白的均衡。所以受到西方設(shè)計影響的現(xiàn)代型漢字也會更注重內(nèi)白的分布,而忽略外白,從而導(dǎo)致了中宮偏大。傳統(tǒng)型的字體關(guān)注了文字的外白,所以中宮就會偏小一些了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

另一方面,由于最初的印刷技術(shù)和電子顯示技術(shù)不佳,而中宮比較大的字體具有更良好的識別度,所以電腦、書籍、報刊等普遍用的都是中宮比較大的字體。而電腦、書報等正是當(dāng)時具備現(xiàn)代感的代表物品,所以中宮大的字體也獲得了現(xiàn)代感的這種印象。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

除了中宮之外,還有筆畫的分布。傳統(tǒng)型字體保留書法中的左收右放、上緊下松的特點,而現(xiàn)代字體則講究的是視覺上的均衡分布。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

來看看這兩個林字,左邊的是傳統(tǒng)的,我們可以很明顯地看到左邊的木字要小于右邊的。而右邊現(xiàn)代一些的林字,為了讓視覺上比較平衡,左邊的木字微微地比右邊的小一點點;另外右邊的林字重心是在視覺中心上的,而左邊的則要更偏上一些。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

骨骼分析完了,接下來我們來分析一下筆畫。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

首先要統(tǒng)一好筆畫的線條,我們來看這兩個撇筆畫,他們的曲線就是兩種不同的風(fēng)格。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

來看左邊的這個,這個筆畫其實是我從顏真卿寫的木字中提取出來的,所以他的線條是具備有手寫感的。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

然后要注意筆畫的起筆收筆是否統(tǒng)一,例如畫面中的這三個字,分別是圓頭的、平頭的,以及對筆畫末端進行切筆的。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

筆畫的體飾相信大家都知道需要統(tǒng)一,體飾不同的文字看上去就完全是兩個字體了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

然后是筆畫的粗細比例。例如畫面中的這兩個字雖然中宮、重心、字面和灰度都是一樣的,可是橫豎筆畫的粗細比例不同,所以他們也明顯搭不到一塊去。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后是筆畫轉(zhuǎn)折處需要統(tǒng)一,拐角處是用尖角還是圓角,又或者是規(guī)定某一個方向的拐角做特殊處理。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

筆畫上的細節(jié)可遠不止我提出來的這五點,比如還有裝飾角出現(xiàn)的位置、拐角的大小、曲線等等。雖然這些都是非常非常小的細節(jié),可是小細節(jié)累積起來就成了大問題了,只有將這些隱藏在筆畫里的小細節(jié)都統(tǒng)一了,我們做的字看起來才能夠比較和諧美觀。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

當(dāng)我們盡可能地將文字中的不同之處消滅之后,那么我們就可以進入下一步,增加文字之間的共性了。那么增加共性到底是個怎么樣的東西呢?

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

日本著名字體設(shè)計師高橋善丸總結(jié)過一個理論——做字之前需要找到文字之間的視覺關(guān)聯(lián)性,然后強調(diào)其中的特征。這里說的視覺關(guān)聯(lián)性也就是我們所說的共性,強調(diào)共性不但可以讓文字之間看起來更和諧,同時也能讓字體產(chǎn)生表現(xiàn)力。接著來看一下我們可以從哪些方面去尋找共性。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

這里我總結(jié)了尋找共性的三個方面,分別是筆畫、偏旁或結(jié)構(gòu)和骨骼。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

先來看看筆畫,筆畫里我又細分出了四個點。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

首先是統(tǒng)一筆畫的彎曲程度,一般最常見的是將曲線筆畫改成直線筆畫。因為在中文中存在著橫、豎等直線筆畫和撇、捺等曲線筆畫,而不同字的直線筆畫和曲線筆畫的數(shù)量不同,如果我們將所有的筆畫都轉(zhuǎn)變?yōu)橹本的話,那么文字的共性也能得到增加。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

來看一些實際的例子,崩壞這兩個字,崩字的曲線筆畫是比較少的,而壞的繁體字則存在著比較多的曲線。而這位作者將筆畫盡可能直線化之后,這兩個字也產(chǎn)生了強烈的共性。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

這個是高橋善丸的字體作品,野放途這三個字也是全部用直線構(gòu)成的,所以他們看起來是非常和諧的,另外高橋善丸為了體現(xiàn)野放途的那種自由奔放的感覺,還隨意地將部分筆畫進行了延長。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

當(dāng)然我們也可以將筆畫盡量的曲線化,但是這樣的難度是要比直線化大許多。這依然是高橋善丸的作品,水都這兩個字都盡量地曲線化去展現(xiàn)水的特質(zhì),高橋善丸還將這兩個字處理成圓形去增加他們之間的共性。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

這個字體作品就曲線化的更徹底了,包含橫、豎在內(nèi)的所有的筆畫都是由曲線構(gòu)成的。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

剛剛講到將曲線變?yōu)橹本,其實我們還可以進一步將筆畫的傾斜角度給統(tǒng)一了,這樣文字的統(tǒng)一程度就更高了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

來看看這個字體作品。這四個字的筆畫只用了四個傾斜角度。分別是垂直的豎畫、傾斜14°的橫畫、傾斜63°和-63°的撇、捺、點等傾斜筆畫。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

第三點是設(shè)計特征筆畫,也就是我們可以選擇詞組中大多數(shù)字都共同擁有的筆畫,然后對他進行比較有個性的設(shè)計。最常見的就是將點筆畫設(shè)計成圓。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

河童這兩個字就是將筆畫中的點都處理成了小圓圈。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

有時候我們也能根據(jù)詞義將小圓圈變成別的點形狀,例如井上悠的這個作品,為了突出雨的概念,將筆畫點都替換成了藍色的小水滴。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

除了點之外,別的筆畫也可以用這樣的手法。例如這組字,撇和捺筆畫的設(shè)計都是比較醒目和夸張的。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后一點是在字體中加入書寫筆畫,這個手法適用范圍是比較廣的。例如畫面中這個a piece of 工作室的作品,他在書法的宋體字中加入了日文的平假名,而日文的平假名來源于草書,我們也可以看做是加入書法筆畫。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

說了這么多,是時候來個案例的演示了。我們來做離騷這兩個字。因為離騷是歷史上的文學(xué)著作,具有強烈的文化屬性,所以希望把他做成宋體字。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

宋體字應(yīng)該從橫畫開始做起,這個便是設(shè)計好的橫畫,從他體飾的曲線可以看出來,這是一款傳統(tǒng)型的宋體字。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

接著我們可以從橫畫推導(dǎo)出其他的筆畫,具體怎么推導(dǎo)我們在《設(shè)計宋體字很難,這次我來教會你》的那節(jié)課中有詳細的講解,不懂的同學(xué)可以去翻看一下。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

接著我們來選擇一個參考字形,因為我們的定位是傳統(tǒng)型的宋體,中宮必須也得相應(yīng)小一些,所以我選擇了筑紫明朝的老字形。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們在參考字體的骨骼上把設(shè)計好的筆畫填上去,由于筑紫A老明朝是偏手寫風(fēng)格的宋體,所以不同字的字面并不一定完全一致,離騷這兩個字就明顯的大小不同,而我們這節(jié)課追求的是文字之間的和諧,所以我們還是盡可能地讓這兩個字差不多大小。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

所以我們將離字給改大一些。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

然后我們就要在這個字里尋找替代成書法筆畫的地方。我們替換書法筆畫可不是隨便找一個筆畫就替換的,一方面,他必須要在字里占據(jù)比較明顯的位置,如果在邊邊角角不顯眼的位置進行替換的話,那幾乎就等于沒有替換;另一方面是這個筆畫要符合書寫的走勢,要能夠展示書寫筆畫的美感。所以我們這里選擇了將這兩處替換成書法筆畫。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們將設(shè)計好的書寫筆畫替換上去,那么這個字就做好啦。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

接著是偏旁或者結(jié)構(gòu)的部分,這個部分我分成了筆畫、偏旁和結(jié)構(gòu)。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

也許你們會覺得奇怪,為什么剛剛有專門講筆畫的部分,而在偏旁結(jié)構(gòu)這個部分也有筆畫呢?我們用反叛這兩個字來做例子解釋一下。這兩個字一共有五個撇筆畫。而在字的最左端各有一個撇筆畫,我們可以針對這兩撇做特殊處理。所以我們這里強調(diào)的筆畫是有位置上的關(guān)系的,而不是指相同的筆畫。我們開始處理這兩個字。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

同樣選擇一個參考字形,剛剛我們做的是具有傳統(tǒng)氣質(zhì)的宋體,那么我們這個字就做具有現(xiàn)代感的大中宮字體,所以我選擇了用中宮比較大的微軟雅黑作為參考。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

因為反叛這個詞帶有不走尋常路的意味,而一般的字體設(shè)計都是橫細豎粗的,所以我們對反叛這個詞設(shè)置成橫粗豎細,具體粗細比例暫定為1:2.5。然后將文字搭建起來。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

由于兩個字的筆畫數(shù)量不同,使用一樣的粗細比例的話會導(dǎo)致灰度上的不均勻。所以這里我們可以適當(dāng)?shù)卣{(diào)整一下筆畫的粗細,讓兩個字的灰度別相差太遠。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

接著我們要強調(diào)一下這兩個筆畫。我們可以將他們加粗,并且往外延伸一些。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

可是往外延伸之后,這個反字會顯得有些不穩(wěn),感覺左下角重了。為了讓反字平衡一些,所以我們可以將上面的一橫往外伸出一些。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

現(xiàn)在的這兩個字顯得有一些些瘦高,氣質(zhì)有點不太對,所以我們可以稍微往下壓一些。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后調(diào)整一些細節(jié),我們這個字就做好了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們再來看一個例子,破壞這兩個字最明顯的筆畫分別是撇和捺,他們在這兩個字中是屬于對稱的位置關(guān)系,所以我們選擇強調(diào)的筆畫并不一定是要在相同的位置,也可以是對稱的位置。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

接著是強調(diào)偏旁。強調(diào)偏旁很好理解,就是如果我們設(shè)計的字里有相同的偏旁的話,那么我們就可以將設(shè)計的重心放在偏旁上,這樣可以保證詞組之間的相似性。這里我們用海浪這次詞作為例子,參考字形用的是opposans的常規(guī)字重。然后在參考骨骼的基礎(chǔ)上把筆畫搭建好。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

首先看海字的這個地方,筆畫分布得不夠均勻,顯得結(jié)構(gòu)有些不穩(wěn),所以我們要把海字的筆畫調(diào)整一下。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

接著來看浪字,浪字頭上的這個點非常奇怪,像獨角獸的角似的。我們將點與底下的筆畫分開會顯得比較舒服一些。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

然后我們就要思考一下三點水應(yīng)該怎么設(shè)計。在找三點水的經(jīng)典碑帖時,我看到了柳公權(quán)對三點水是這么處理的,我覺得可以借鑒到我的這個字中。

那么我就可以將下方的點拉長,做一個轉(zhuǎn)折的處理,這樣三點水就成了這兩個字里比較突出的設(shè)計了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

接著我們可以將這里進行出頭處理。讓這兩個字多一些細節(jié)。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后調(diào)整一些細節(jié),那么這兩個字就做好了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

同樣再來看個例子,檸檬這兩個字都是木字旁的,所以作者便對這個木字旁做了往外延長的處理,另外值得注意的是,由于他做的木字旁比較夸張,所以對文字右邊的部分也進行了相應(yīng)的處理,不然左右兩邊就會被割裂開了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后是結(jié)構(gòu),結(jié)構(gòu)指的是強化文字中具有相同結(jié)構(gòu)的部分。例如味道這兩字,他們都有口字的結(jié)構(gòu),所以我們可以嘗試在這上面下些功夫。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

味道這兩個字我第一反應(yīng)是聯(lián)想到熱騰騰的美食,是溫暖有溫度的,所以我在筆畫的設(shè)計上模仿了宋體橫畫的體飾,讓這個字體有一些人文的感覺。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

參考字形選擇了中宮偏小的筑紫明朝,筑紫明朝相比我們前面用的筑紫A老明朝氣質(zhì)上會稍微沒那么傳統(tǒng)。根據(jù)筑紫明朝的骨骼將筆畫放上去。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

這時候會發(fā)現(xiàn)這一塊的負空間有一點大,而我們希望這個字筆畫的分布能夠更勻稱一些。所以將這一點往下挪一些。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

然后這個位置筆畫似連非連是字體設(shè)計中不應(yīng)該出現(xiàn)的,將這一點往上收一收。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

味字的這一筆也可以往上提一些,讓他更符合這一撇的走勢。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后調(diào)整一些細節(jié)。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

然后我們要開始想辦法修飾一下這個口字結(jié)構(gòu),我們在書寫的時候經(jīng)常會有這樣的連筆,例如這是王羲之寫的口字。所以我們也可以將這個書寫結(jié)構(gòu)用在我們的字里,讓我們這個字有些書寫味道。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們的這兩個字就做好了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

睡眠欲的這三個字同樣是對口字結(jié)構(gòu)做了特殊設(shè)計,所有的口字結(jié)構(gòu)都處理成開口或者是封閉的圓形。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

而今生的這兩個字所選取的部分就更加刁鉆了,我們可以看到這兩個字的上方都有一條繞了一個小圈的曲線。而今生原本的寫法并不會產(chǎn)生這樣的曲線,所以這位設(shè)計師的處理手法也是頗為巧妙。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

不過在我們做字功底還不夠深厚的時候,最好不要將一些不一樣的筆畫結(jié)構(gòu)強行處理成一樣,這樣很可能會破壞掉原本的骨骼,損失了漢字原本的美感不說,還很可能讓文字丟失了識別性,那樣的字體設(shè)計可就得不償失了。畢竟我們要尋找的是文字之間的共性,而不是將文字的不同強行扭轉(zhuǎn)成共性。那么我們接著來往下看。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后一個方面就是骨骼的共性了,骨骼我細分成了四點——橫畫對齊、中宮、重心、字面。其中,除了橫畫對齊之外,中宮、重心、字面這三個處理方法幾乎可以應(yīng)用于所有的漢字中。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們先來看看橫畫對齊。我們在看日本的字體設(shè)計時,經(jīng)常能看到東京這兩個字被做成這樣的處理。因為東京兩個字在結(jié)構(gòu)上是有高度的相似性,所以可以將文字的橫畫對齊,這樣文字就能有比較高的統(tǒng)一性了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

千差萬別這幾個字雖然被設(shè)計得十分的夸張,但是通過將所有的橫畫進行對齊,讓字與字之間產(chǎn)生了共性,所以這樣一組個性強烈的字放在一起卻不會違和。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

再來看看住宅作家這四個字,通過畫橫線我們可以看到,大多數(shù)的橫線都對齊了,可是住字中間的一條橫線卻沒有對齊。所以其實我們在用這種手法的時候,也不是一定要所有的橫畫都對齊才行,只要盡可能將能對齊的都對齊,那也能夠產(chǎn)生共性。如果強行對齊會破壞文字的美感或者識別度,那我們就放棄那個難以對齊的橫畫就好了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

第二點中宮,就是我們可以給需要設(shè)計的字體設(shè)置一個比較夸張的中宮,讓讀者一看就被夸張的中宮所吸引。我們用一直往南做個小示范。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們將一直往南這四個字的中宮盡量地撐大,他們之間就能產(chǎn)生共性,如果我們在底下墊個字面框的話,就可以發(fā)現(xiàn)除了一之外的三個字都幾乎將字面框占滿了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

這個是高橋善丸挺著名的一個作品, 他就將白南風(fēng)和青雨這五個字的中宮擴得非常大,而中間的筆畫都縮得很小,從而形成了圖形感。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

重心與中宮相同,就是給文字設(shè)置一個比較夸張的重心。這組字就是將重心都提得非常的高,讓文字在體現(xiàn)張力的同時,又能保持和諧統(tǒng)一。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后就是設(shè)置字面,也就是我們常見的寬體、窄體等。我們用驗傷這兩個字來示范一下,由于驗傷是一首抒情歌曲,具有一定的文藝屬性,比較適合秀麗一些的氣質(zhì),筆畫也應(yīng)該比較細一些,所以這里選用opposans Light字重作為參考字形。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

另外窄體相比寬體更具有秀麗、文藝的氣質(zhì),所以這里我直接將字體壓扁作為參考。然后將筆畫填上參考字形中。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

這時候我們可以發(fā)現(xiàn)這兩個字視覺上的大小不一致,底部與頂部并不對齊,需要進行一定的視覺修正。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

還有驗字比傷字看著要寬一些。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

將驗字縮窄了一些,這樣這兩個字在視覺上就是平衡的了。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

我們在之前的課程里介紹過,重心偏高的字體會更秀麗一些,所以我們也可以嘗試將重心往上提一提。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

可是重心提高之后,這里的點筆畫顯得有些太長了,不太美觀。所以我們可以將點上下交錯著排列,這樣可以讓點稍微短一些。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

接著來處理這個地方,這里負空間大了一些。我們可以將提筆畫傾斜一些,多占據(jù)一些負空間。

字體<a href=http://seniorhumorist.com/ target=_blank class=infotextkey>設(shè)計</a>在變化之前,你得先做這一步

最后調(diào)整一些筆畫細節(jié),我們這組字就做好了。

總結(jié)

這節(jié)課的內(nèi)容到這里就講完了,我們來回顧一下今天的內(nèi)容。這節(jié)課我們講的是如何設(shè)計出和諧統(tǒng)一的文字,為此我們將這節(jié)課分成了兩部分,一部分是減少文字之間的不同,另一部分是增加文字之間的共性。減少不同部分。我們可以從骨骼、氣質(zhì)和筆畫風(fēng)格三個方面去尋找文字之間不和諧的地方,并把他們修正。而增加文字共性則可以從筆畫、偏旁部首或者骨骼三個方面去強調(diào)他們的視覺關(guān)聯(lián)性,從而使文字在和諧統(tǒng)一的基礎(chǔ)上產(chǎn)生視覺張力。希望這節(jié)課的內(nèi)容能對你們有所幫助,我是千樹,我們下期再見。

參考資料:

《字誌 01》、《字誌 02》、《字體設(shè)計 100+1》 靳埭強 著、《感覺舒服的文字》 高橋善丸 著


歡迎關(guān)注研習(xí)設(shè)的微信公眾號:「Yanxishe2017」

聲明:站內(nèi)網(wǎng)友所發(fā)表的所有內(nèi)容及言論僅代表其本人,并不反映任何網(wǎng)站意見及觀點。

全部評論

暫無相關(guān)推薦