初めてのフォントづくり

ohori
ohori

今日は夏かな?お久しぶりです、大堀です。

最近はラジオを聞きながら仕事していますが、
夕方に流れるビール指数が気になって仕方がない今日このごろです。

ご存知の方もいらっしゃると思いますが、
自分は大学時代からフォント好きを自称しております。

卒業研究は雑誌のタイトルに使われる書体と購買層との相関についての研究でしたし、
優れたタイポグラフィやセクシーな書体を見ると、にやけ顔を隠せません。
最近の興味は印刷技術の発展とタイポグラフィとの関係についてだったりします。

しかしこれだけ文字についての愛を明らかにしていたにも関わらず、
自分でフォントを作ったことがないという後ろめたさをずっと感じていました。

「え、大堀さんフォント作ったことないんですか?」と聞かれれば、
「いや、書体デザイナーの偉大さがわかるからこそ、簡単にフォントなんて作れないんだよね」
なんていう逃げの言葉を吐いて生きてきました。

本当に文字の世界は深いので一朝一夕で作れるわけがない。
山に籠って3年とかかかる。。そう思って一歩を踏み出せないでいたのです。

しかし今週は仕事が暇になったのもありますが今回一念発起して、フォントを作ってみようと思い立ちました。
一度はやってみないと一生フォントを作れない人間で終わる。そんなのは嫌だ、と。

長くなりましたが、今週一週間仕事の合間を塗って
オリジナルの欧文書体を作ってみたよ、というお話です。

せっかくなのでその変遷を備忘録としてブログに書いてみることにした限りです。

長くなりそうなので、先に大まかな流れを書きます、

1.コンセプトを決める
(2.ラフを描く)
3.パスデータにする
4.視覚調整する
5.OTF化する
6.単語を打って検証・修正

ここまでを火曜日から本業の合間を使って4日目、
金曜の本日公開という無茶なスケジュールで作ってみました。
もちろんこの短期間ですので、クオリティは伸びしろたっぷりな出来となっております。

−−−−−−−−−−−−−−−−−−−−−

1.コンセプトを決める

まずは制作する書体のコンセプトから決めていきます。

001

ラフスケッチをいくつか書いてみました。

ただこの時点で気づいたのは、
・スクリプト体など曲線を多用するものは調整に時間がかかる
・正当派本文用書体なんて今の自分では無理。(技術と時間が圧倒的に足りない)

よって直線が多く且つ、見出し用に用いるディスプレイ書体に絞って考えることにしました。
水平、垂直、45度。8×8のマスを基本グリッドとして設計してみることにしました。

2.ラフを描く

本来なら一度手書きで一文字ずつ書くのですが、
時間がないグリッドという制約が強いため、いきなりイラストレーターで制作していきます。

002

欧文で必須となる基準線はたくさんありますが、ベースライン、キャップスハイト、アセンダ、ディセンダ、エックスヘイトを決めておきます。
今回は8×8マスにをベースに、ベースから6マス目をエックスヘイト、さらに2マス上をキャップスハイト、下2マスをディセンダラインと定義します。

003

コンセプトが良かったのか、制約がある分ちゃっちゃと作業を進めました。

3.パスにする

004
もうパスになってますね。
ただ、今回は線の塗りで制作したので、「オブジェクトを分割」して線から面の塗りに変更します。

ここまででだいたい4時間くらい。
だいぶフォントの雰囲気がわかってきました、楽しみです。

4.視覚調整する

グリッドに基づいて、だいぶ文字が出来上がってきました。
ただこのままで終わりにしてしまうと、コンセプト先行自己満足の使いづらくて醜いフォントです。

「人間は同じ太さの縦棒と横棒では横棒が太く見えてしまう」
「座標的に天地中央にあっても、少し下がって見えてしまう。」
といったような錯視と呼ばれる感覚的な誤差を考慮しなければなりません。

ここからはグリッドは外し、そういった視覚調整を簡単ですが進めていきます。

005

もしこれが曲線を多く含むフォントだとしたら、ものすごい時間がかかる作業です。
コンセプトの単純さが活きています。

5.フォント作成ソフトにつっこむ

だいぶ調整が進みました。もう早くフォント化(otf化)したくてたまりません。
木曜日はこれをフォント化していく作業です。

フォント作成ソフトは有名なFontLabさんのTypeToolを利用します。

006

円安でちょっと高くなっていますが、50ドルくらいで購入しました。

本当は水曜にダウンロードして始める予定が、
購入後のダウンロード方法が見つからず、お問い合わせしてなんとかダウンロードにこぎつけました。
今でも自分が悪かったのか、リンクを見つける難易度が高かったのかはわかりません。

なにはともあれ,これでフォントを作れます。

TypeToolsを選んだのは、Adobe Illustratorからのコピー&ペーストが容易と聞いていたからです。
実際、この編集画面にペーストするだけであれよあれよとマスがうまっていきます。

007

ちなみにこのときベースラインからキャップスハイトまでは700pxです。
このソフトを使うときは以後ディセンダからアセンダまで1000pxくらいでパスを用意しておくとよさそうです。

6.単語を打って検証

ファイルメニューから書き出して、otfファイルが出てきました。
試しに色々と単語を入力してみます。

008

すると大文字はまだ統一感があるけど、e,sが苦しい。
小さいサイズではフトコロ(線の間の空間)がつぶれる。
nの起筆部のでっぱりが目立ちすぎてhと間違う。

など、見えてくることが多々ありました。

実際のフォントデザイナーの方々はまず単語を組んでみるんだそうです。
言葉になったときにきれいかどうか、並びで見てどうなるかを確認します。

気になった部分を修正して、いよいよ。。

完成です!!!!

009

名前は8×8のグリッドをもとに、88.otfと名付けました。

そんなわけで一応こちらに公開もしてございます。

ダウンロードはこちら

どれ無料なら試してみるか〜なんて方はぜひDLして使ってやってください。

【感想】

今回はまずリリースということを念頭に置いてスピーディに制作しましたが、
今後は時間をかけて、もっとクオリティの高いものを作っていければなと思いました。

使われている書体は、いわばメッセージを届けるナレーターです。

そういう大事なフォントは、きちんとプロが作った質の高いものを使いましょう。

それではまた。

ohori
ohori
大堀祐一 株式会社DENDESIGN 代表取締役/UXデザイナー 千葉大学工学部デザイン工学科意匠系卒/桑沢デザイン研究所 中退。WEBサービスの設計・デザインを専門とし、新規事業立ち上げやデザイン改修に数多く携わる。千葉大学工学部非常勤講師。 https://twitter.com/holly_u1