胖皮:重到溢出來的
字體實驗!

胖皮cover

拿著筆隨意塗鴉、寫字的時候,你曾經留意過筆尖線條的韻律嗎?那些都是身體活動的軌跡。無論遲速、直曲、深淺,它們都反映你的身心狀態,也是專屬個人的生命印記。

自幼深愛手繪的玟希(又叫大大),與筆有著千絲萬縷的交流。但說起與字體設計的緣分,讓她決心報名第二屆「造字鼓勵元」、並以胖皮體勇奪首獎的初心,則可追溯到高中。

與曲線的不解之緣-參加「造字鼓勵元」之前的種種

玟希目前就讀國立雲林科技大學視覺傳達設計系碩士班。高中擔任廣告手繪選手時,她就對曲線莫名著迷。大學就讀商業設計系期間,因為深信字體自己會說故事,玟希不但為許多主題設計標準字/美術字,還以此作為海報主視覺。

大學標準字設計

上研究所後,玟希更不顧一切地投入美術字的懷抱中。面對市面上書籍稀缺的困境,她仍努力查找美術字相關知識,將美術字按用途分成兩類,再依據風格分成十種。

對玟希而言,美術字不只是字而已。它們和人一樣有著情緒,而不同年代、行業的人們對字體的偏好也有差異。比方說「粗、厚、大」,就是食品業字體常見的特性。

美術字設計書籍

習字總要有人引領。「文字造型與編排」這門課,便深化了玟希對字體的了解。字體不只是傳遞資訊的載體,它還能反映自我性格以及自我期許。玟希希望自己圓融,便繪出左側的字;喜歡綜藝感,便設計出右上的空體字;期許自己能變穩重,筆下出現的就是右下較古典的造型。

姓名標準字設計

字體有時也承載了情感想像。比方說玟希設計的「兩情朝朝暮暮」,就試圖訴說愛情中藕斷絲連的若即若離感。文字線條在圓圈之間流轉,時粗時細,好像逡巡在家門外,卻遲遲不敢告白的單戀者;也像那些遞不出去的訊息,幾小時下來只有雙手在鍵盤上空盤旋。

愛情標準字設計

玟希一直很享受「隨性書寫、不受拘束」的創作過程。當她因應課程要求,繪製漢字與歐文互搭的字體時,筆下文字也流溢出最真誠的自我,就是那種飽滿、圓潤、彎曲的感覺。

中西混搭字體初稿

在助教-也就是第一屆造字鼓勵元首獎得主冠穎的勉勵下,玟希提出胖皮體的始祖「做好做滿體」,投稿到 justfont 所舉辦的第二屆造字鼓勵元。(題目是做「黑糖珍珠鮮奶」四個字)沒想到,竟然,就獲得首獎了!

造字鼓勵元初稿

驚喜之餘,玟希的內心也夾雜許多疑惑與恐懼。「黑糖珍珠鮮奶」六字手繪特色極強,屬於美術字的範疇。它的設計邏輯與字型有著根本性差異,美術字通常較具個人特色,而字型卻是依據模組化的概念作設計。

造字鼓勵元投稿

一套完整字型會遵循詳實的設計規範,設計師會先定義好基本筆畫造型,再組裝到個別文字裡。然而,玟希的「黑糖珍珠鮮奶」無論在造型設計、筆畫減省等方面,都涉及很高程度的個人判斷。這真的有辦法變成風格一致的字型嗎?

當美術字變成字型:連造字軟體都不幫忙的四大挑戰

想造字的人,大多知道造字軟體「Glyphs」,它能幫你預先設好曲線,也有協助調整筆畫的工具,若能善用 Glyphs 造字,製作效率將會大幅提升。

玟希一開始也躍躍欲試,希望能用 Glyphs 完成胖皮體。但她很快就發現,隨性發想的活潑感,卻成為製作胖皮體的困境。胖皮體很難以 Glyphs 預先設定模組,無法使用筆型。關鍵的交疊效果,也無法以 Glyphs 製出。

在和 justfont 的字體設計師深談過後,玟希只好回頭去找設計人永遠的好朋友—illustrator,也開啟了一場充滿挑戰的字體設計之旅。

造字軟體選擇

挑戰一:每一個字,進了 illustrator 都要重新拉

挑戰一

面對目標的 300 字,玟希必須先逐一用方格紙手繪、拍照,之後再上傳到 illustrator 重新拉出想要的造型。可想而知,這個過程必然耗時耗力…

挑戰二:筆畫差異大。並列每個字,看起來卻像是來自不同字體

手繪的好壞一體兩面,優點是機動性高,缺點則是變異性高。隨著當下身心狀態的改變,筆下的線條曲度、筆畫造型都會有差異。比方說「酬」和「鷹」兩個字,單看一個字不覺得有差,並置卻會發現二字曲度完全不同。「鷹」的轉角比較圓,「酬」則比較方。

圓角-橫筆

玟希因此回頭修正筆畫造型,把橫畫端點改成弧度一致的圓角。過程中她也發現其他差異,像是「劉」與「同」的勾筆曲度也不盡相同,「劉」比「同」更接近圓形。

圓角-勾筆

眼看截止日期越趨迫近,逐日增加的卻不只有字數,還有更多、更難以掌控的筆型差異。這讓玟希回歸製作胖皮的初心,反思美術字與字型的根本區別。

在手繪美術字的世界裡,隨機創作充滿彈性,反映出最自然、真誠、率性而為的自我。但當它變成一套具有規模、供大眾使用的字型時,風格一致性必須躍居為首要考量,創作者得逐步切割,使字型成為客觀存在、並且可以被複製的獨立個體。

考量到這有賴於設計規範的定義,玟希也開始擬定完善的「基礎筆型」。她的設計巧思隨處可見,像左下角的筆畫,看起來很像車輪吧!那是「珍珠」的「珍」第三撇的造型。當然這些只是基本規則而已,面對 justfont 字體設計師嚴厲又心意滿點的紅字批改,玟希知道還有許多地方需要微調才行。

justfont 修正建議

挑戰三:做得字越多,平衡問題越明顯

挑戰三

雖然規範了基礎筆型,但隨著產出字數越多,玟希卻發現這些字看起來不像同一套。它們重心有高低差異、筆畫也寬窄不一。排成詞句時讀起來有高有低,或粗或細,缺乏整齊且美觀的風格一致性。

粗度加大換白線

玟希索性將所有字的粗度統一加大,使得所有筆畫從 bold 晉升到 heavy 等級。另外她也讓字更貼近邊框,並減少筆畫間的白空間(即廣義的「字腔」),讓各字均具備飽滿、圓潤的特性。

玟希甚至讓白線躍居主要地位。她取消字腔,白線遂成為讀者識別文字的關鍵。這樣的設計當然很大膽,也成為胖皮最重要的特色之一。

挑戰四:除了基本準則外,特殊筆畫該如何處理?

字體設計最奧妙、也最令人玩味之處,就是在反覆檢視中精益求精的過程。將字體調粗為 heavy 後,玟希馬上發現到之前規範的基礎筆型又失效了!比方說「參」字的「ㄙ」,加粗以後筆畫堆疊顯然過多,她因而調整手寫筆順與流線。不但兩筆減成一筆,筆畫造型也改成圓形。

粗度加大換筆型

另外像「愛」字,一開始的造型像鴨嘴獸、薑餅人,而且看起來還很像「受」字吧!隨著字腔的逐步縮減,直到變成白線,「愛」字終於有了飽滿、圓潤的樣貌,也是玟希想要呈現的感覺。

粗度加大換筆型-2

如何用 illustrator 造字?

有些人可能會很好奇,沒有造字軟體的幫助,只用 illustrator 究竟要怎麼造字呢?這得善用不同工具。

illustrator 造字工具

「矩形工具」可以拉出方塊,是第一步驟;「直接選取工具」能放大錨點,達到精確調整;「鋼筆工具」是畫出筆畫間白線的功臣;「橡皮擦工具」專門切割塊狀物品:「剪刀工具」則可剪除不必要的錨點,讓曲線保持完美造型!

另外還有「滴管工具」,它能讓筆畫粗度一致;「筆畫工具」則能把筆畫設成圓角,這樣就不用逐一調整;「路徑管理員」的暱稱是「連連看」,它有融合的效果,可以將各筆畫相連;「對齊工具」可以對齊各筆畫;至於「排列順序」也很重要,胖皮筆畫高度疊合,這個工具可以控管各筆畫的前後順序。

造字到後來,距離死線越來越近,玟希乾脆也不手繪了,直接用 mac 觸控板在 illustrator 裡面寫字,然後拉成想要的造型。

illustrator 手繪

如果想清楚了解,可以看看「胖」字的製作影片。畫面中的游標經常移來移去,這是為了要在字海中找到相對應的筆畫造型做為參考!

胖皮-喚起臺灣傳統市場記憶的字體

胖皮cover

玟希設計胖皮時,腦中想的是臺灣傳統市場。那邊總是籠罩在鮮明的色彩中,頭頂上罩著大型亮色帆布,有上百位提著藍、綠、紅三色尼龍袋的婆婆媽媽穿梭其中。她們忙著張望招牌上的粗楷體,就為了替家人張羅餐食。

胖皮風格描述

如果偷偷在市場中放入胖皮,相信大家也不會覺得違和吧?這是因為它飽滿、圓潤的設計,不但帶給人好吃、可愛的感覺,也有親切感滿分的人情味。

只要和其他字體比較就知道了,胖皮比目前臺灣市面上可見的圓體都來得圓,它滿到即便減省了許多筆畫,都還是有超級滿的感覺。比方說「美麗」的「麗」,下方「鹿」的很多筆畫明明都被疊住了,卻還是能辨識出這是「麗」字。

胖皮筆畫減省

這種筆畫的層層重疊,對玟希來說不只是挑戰,更是造字的樂趣所在。筆畫很多的時候怎麼疊呢?就是邊做邊想。像「雜」字中間的「人人」疊在一起,就有種緊緊相依的可愛感(也有點像 mos ?);至於「學」字就參考學習的本質,把筆畫當成資訊,通通消化、全盤吸收!

胖皮手感設計

那「啡」字的「非」呢?不要寫成平的三橫了吧!改成手握住物品的形象。這些判斷看似隨性,卻也讓軟體做成的筆畫充滿生命力,它們因而更貼近玟希的造字初衷 — 充滿手感的手繪字體。

胖皮 80 pt

至於胖皮的理想使用方式,由於它的筆畫堆疊較多,還是大一點好。36 pt 以上的字級才能明顯看到它的特徵,當然可以放大到 80 pt 就更棒了!

食品 mockup

無論是主打鮮嫩多汁感的食品、深受兒童喜愛的可愛文具、強調親切形象的店面等,都非常適合胖皮!比方說「澄」字 logo 用了胖皮,就與店家想要提倡的「友善、有機、自然」等概念相當貼近。

理髮廳 mockup

維持手感溫度的字體

每套字都有不同的優勢與難處。胖皮的活潑源自手繪的自由度,然而一但踏入字型的範疇,伴隨著工具轉換與規格要求,缺乏固定準則的手繪,也成為胖皮的最大桎梏。

胖皮與手繪

這也是為什麼玟希為胖皮立定基準規範的時候,仍努力留下「手感」的原因。她還是當年那個喜歡手繪、深愛曲線的少女,當線條勢必得靠軟體輔助時,她轉而將筆畫交疊幻化成有溫度的堆疊。「鼠」的上半就像比讚的大拇指,下半不僅像緊握的雙手,甚至像緊抱的伴侶,一切不為其他,只求忠於創作初心。