今回の記事は、一般的なドットフォントの作り方の話にもなります。
私が作成したのは、FF14という限定された世界で使われている文字のフォント制作ですが、作業自体はひらがなや英字などにも使えます。
本記事では、ドットフォントを作るきっかけから、実際に作成する方法、どれくらいの期間がかかったかなどについてお話したいと思います。
ドットフォントを作るきっかけ
2021年のエイプリルフールネタに
先日こちらの記事を書きました。
blog.gelehrte.com
同時期に、ドットフォントの作り方の記事を見つけました
こちらのツイートです。
ドットフォントを作ろう
— note (@note_PR) 2021年2月19日
ブロックを組み立てる感覚で、楽しんで作成できる「ドットフォント」。フロップデザインのフォントキャンプさん@flopdesignが、理想のドットフォントの作成過程を公開しながら、その魅力を存分につづっています。
https://t.co/JORZmm8RpI
こちらの記事では、ドットフォントという世界の話や、その作り方の概要が書かれてありました。
とても興味深かったです。
そして
思い立ったのが2021年02月の後半
GitHubのコミット(作業ログ)を見る限り、最初のコミットが2月21日
エイプリルフールギリギリまで作業したことになると、1ヶ月ちょっと作業したことになります。
今回の #文字入れジェネレータ の #エイプリルフール ネタは2月21日ごろから企画スタートしていたようです
— ゲレ☆FF14とフクロモモンガを愛するアカウント (@gelehrte_crest) 2021年4月1日
我ながら、何やっているんだって話ですねノ`・ω・)ノ pic.twitter.com/hiuWjny89H
ひらがなのドットフォント1つと英数字のドットフォントを2つにかかった期間が1ヶ月ちょっと
ということになります。
フォントのダウンロードはこちら
クガネ文字ドットフォント
ノルヴラント文字ドットフォント
どうやってドットフォントを作ったか
使った道具とアプリ
アプリ
Affinity Designer for iPad
affinity.serif.com
Glyphs
glyphsapp.com
Glyphs は30日の試用も可能です。
フォントを1つ作りたいだけなら、試用でも十分かと思います。
タブレットはあったほうがいいかどうか
個人的にはあったほうがいいと思います。
私が作業をコツコツ進められた理由としてはスキマ時間で作業を進められたというのが大きいです。
フォント作成はスキマ時間にできる一つの作業!
私は仕事に行く時や買い物などに行く時、公共の機関を利用します。電車とかバスとか。
あと、どうしても手持ち無沙汰になる時間も生じて喫茶店に入ったりします。
その短い時間、10分かそこらの時間でも1文字分のデザインができるのがフォント作成作業のメリットだと思います。
どのようにドットフォント作成作業をしたか
これは前述のnote記事に書いてある内容と重複するのですが、私なりのやりかたを
10x10のマス目を用意します
画像はAffinity Designer for iPadのアプリ画面です。
このアプリである必要はなく、ベクター画像を書き出せるレイヤー機能が搭載したアプリなら何でもいいです。
最近のお絵かきアプリなら、そのあたりをサポートしていると思います。
元画像を用意
これはFF14のクガネ文字の「つ」です。
なんのことかわからない人も多いかと思いますが、FF14は1文字1文字がひらがなと対応していて、この画像が「つ」に該当します。
私は元々、クガネ文字をフォント化していて、その元画像がiPadの中にありました。
gelehrtecrest.booth.pm
普通の英数字やひらがななどをフォント化する場合は、PNGやJPG画像が元画像でもいいと思います。
画像を重ねて、マス目を塗りつぶす
マス目を上のレイヤーにして不透明度を60%ぐらいに。色は白で。
元画像は下のレイヤーにして不透明度を100%
マス目を1つずつ色を塗っていきます。
できあがり
これで1文字できあがりです!
どうですか?これなら1文字を10分以内にできそうだと思いませんか!
スキマ時間にちょうど良いかと思います。
Glyphsでの作業
主に、出来上がった画像ファイルを収集し、上下左右の空白部分をどうするかの調節を行います。
あとフォント化ですね。
これはまた別の文字(ノルヴラント文字:FF14で英数字に該当する)の例なのですが、こう並べていきます。
#ゲレフォント のこぼれ話
— ゲレ☆FF14とフクロモモンガを愛するアカウント (@gelehrte_crest) 2021年4月1日
ドットフォント作成中のノルヴラント文字のスクショですが、なんだろうこのアンダーテイル感ノ`・ω・)ノ#FF14 pic.twitter.com/9cBvtegPfb
フォント化は少しずつ進めていける作業ですが、どうしてもMac bookのお世話になるので、家での作業がメインですね。
もちろん喫茶店でMac book開いて作業してもいいのですけど!
フォント公開について
現在フォントを公開している場所として
- 本ブログ
- GitHub
- BOOTH
の3箇所用意しています。
やはりBOOTHから興味を持っていただける方が多いようですね。
ありがたいことです。