Times New Romanで組んだ文章なのに、数文字おきにArialが紛れ込んでいる。そんな微妙に落ち着かないフォントを、ブラウザだけで作れる無料ツール「Bastardica」が公開されています。
複数のフォントからグリフを取り込み、一定の間隔で入れ替えながら一つのフォントにまとめられるツールで、完成したものは画像ではなくTTF、OTF、WOFF2として書き出せます。フォントを選ぶだけでは物足りなくなった人が、文字そのものを実験材料にして遊べるツールです。
「7文字ごとに別のフォント」が作れる
Bastardicaでは、最初にベースとなるフォントを選び、そこへ別のフォントを追加します。
特徴的なのが、混ぜる割合をパーセントではなく「何文字ごとに入れ替えるか」で指定するところです。
たとえばTimes New Romanをベースにして、7文字ごとにArial由来のグリフへ置き換える設定にすると、大部分はTimes New Romanのままなのに、文章の途中へ定期的にArialが現れます。
まったく異なる書体を組み合わせれば変化はすぐにわかりますが、形の近い書体を混ぜると話が変わります。普通に読めるのに、文字の幅や曲線、セリフの有無などが途中で微妙に変わり、「何かがおかしい」という違和感だけが残ります。
Bastardicaは、この違和感を意図的に作るためのツールです。
3種類以上のフォントを混ぜることもできる
混ぜられるフォントは一種類だけではありません。
ベースフォントに対して、5文字ごとにフォントA、7文字ごとにフォントBを入れるような設定もできます。
この場合は35文字目で条件が重なりますが、Bastardicaでは先に設定されたフォントが優先されます。
公式の案内では、3種類以上を混ぜる場合に素数を使う方法も紹介されています。5、7、11のような数字を指定すれば条件が重なる間隔が長くなり、複数の書体を散らしやすくなるためです。
フォントを混ぜるだけの遊びに、急に算数が入ってくるのも面白いところです
混ぜた文字だけ、大きさや位置を調整できる
異なるフォントの文字をそのまま並べると、サイズが揃うとは限りません。
同じ12ptで指定しても、フォントによって小文字の高さや文字幅、ベースラインからの見え方は異なります。そのためBastardicaでは、混ぜる側のグリフにスケール、位置調整、傾きなどを加えられるようになっています。
あえて大きさを崩して異物感を強くすることもできますし、逆に元のフォントへ馴染むよう細かく調整することもできます。
この機能があることで、「違うフォントを混ぜました」と一目でわかるデザインだけでなく、よく見なければ気づかない程度の違和感も作れます。
「Sneaky Bastard」は、よく見ると何かがおかしい

Bastardicaには、設定をすぐ試せるプリセットも用意されています。
その一つ「Sneaky Bastard」は、Times New RomanをベースにArialを混ぜたものです。Arial側のサイズなども調整されているため、文章をぱっと見ただけでは変化に気づきにくくなっています。
ところが一文字ずつ見ると、途中でセリフが消えたり、文字幅が変わったりします。
ほかにもImpactやPapyrusを使ったもの、複数の書体を混ぜて切り貼りしたような見た目を作るものなど、かなり遊びに振ったプリセットがあります。
綺麗な書体を効率よく探すサービスではなく、「フォントを意図的に壊したらどう見えるか」を試す場所だと思ったほうが近いでしょう。
作ったものはTTF・OTF・WOFF2で書き出せる
Bastardicaが単なる文字エフェクト系のWebツールと違うのは、生成結果をフォントファイルとして書き出せることです。
対応しているのはTTF、OTF、WOFF2。画像として書き出して終わるのではなく、生成後も文字を入力できるフォントとして扱えます。
TTFとOTFはデザインツールや印刷物などで広く利用されているフォント形式で、WOFF2は主にWebフォントで使われる形式です。
そのため、Bastardicaで作ったフォントをインストールして文字を入力したり、Webフォントとして読み込んだりできます。
ただし、後述する通り、技術的に使えることとライセンス上使っていいことは別です。
なぜ入力するたびに別のフォントへ切り替わるのか
Bastardicaの仕組みには、OpenTypeのliga機能が利用されています。
ligaはリガチャ、つまり合字などに使われるOpenTypeの機能です。「fi」のように複数の文字が並んだとき、専用のグリフへ置き換える処理などに使われています。
Bastardicaはこの仕組みを利用し、文字列の中で条件に合った位置に来たグリフを別のものへ置き換えています。
そのため、フォントを使う側で一文字ずつ書体を変更しているわけではありません。生成されたフォント自体が、入力された文字の位置を見ながら表示するグリフを切り替えます。
通常なら文字を美しく組むために使われるOpenTypeの機能を、文字を妙にするために使っているわけです。
アプリによって普通のフォントに見える場合もある
Bastardicaで生成したフォントは、OpenTypeの文字組みに対応したブラウザ、デザインツール、印刷環境などで利用できます。
ただし、使用するアプリ側でリガチャが無効になっていると、設定したグリフ置換が動かず、普通のフォントのように表示される場合があります。
生成したのに何も変わらない場合は、フォントそのものを疑う前に、アプリのOpenType機能やリガチャ設定を確認したほうがよさそうです。
読み込ませたフォントはサーバーへアップロードされない
手持ちのフォントファイルをWebサービスへ読み込ませるときは、そのデータがどこへ送信されるのかも気になります。
BastardicaではPyodideとfontToolsを使い、フォント生成に必要な処理をブラウザ内で行っています。読み込ませたフォントファイルをサーバーへアップロードして加工する仕組みではありません。
PyodideはPythonをブラウザ上で動作させるための仕組みで、fontToolsはフォントデータの解析や編集、生成などに使われているPythonライブラリです。
Webツールでありながら、フォントを読み込み、加工して、新しいフォントファイルを書き出すところまで端末側で処理しています。
自分のフォントを読み込めても、自由に改変できるとは限らない
Bastardicaを使ううえで最も注意したいのがライセンスです。
PCにインストールされているフォントや購入した市販フォントをデザインへ使用する権利と、そのフォントファイル自体を加工して派生フォントを作る権利は同じではありません。
Bastardica自身も、複数のフォントを混ぜる行為によって派生物が作られるため、商用利用する場合には元となるフォント双方のライセンスを確認するよう案内しています。
Bastardica側から生成フォントへ追加の利用条件が課されるわけではありません
つまり、「Bastardicaが無料だから、ここで作ったフォントも自由に商用利用できる」とは考えないほうがいいでしょう。
無料フォントを使う場合もライセンスは確認したい
無料で配布されているフォントなら何をしてもいい、というわけでもありません。
フォントによって、商用利用、改変、再配布、派生フォントの公開などに対する条件は異なります。改変を認めるオープンなライセンスでも、派生版の名称などについて条件が設けられていることがあります。
Bastardicaの公式案内では、試せる無料フォントの入手先としてGoogle Fonts、UNCUT、Velvetyne、Font Squirrel、FontSpace、DaFontなども挙げられていますが、配布元が同じでも各フォントの条件がすべて同一とは限りません。
遊ぶ段階では気軽なツールですが、生成したフォントを作品や仕事へ持ち出す段階では、元フォントの利用条件まで戻って確認する必要があります。
ZINEやフライヤーなら「微妙に壊れた文字」を作れる
用途を考えると、Bastardicaは整然とした本文書体を作るツールというより、文字そのものをグラフィックとして扱う場面と相性が良さそうです。
ZINEのタイトルやイベントフライヤー、架空ブランドのロゴ、ホラー作品の見出し、パンクやグランジ系のグラフィックなど、均一に整った文字より違和感が欲しい場面なら使い道があります。
一文字ずつ手作業でフォントを変更しても似た表現はできますが、Bastardicaでは「7文字ごと」のような規則を持たせられます。
完全なランダムではなく、一定のルールで崩れている。この妙な規則性が、手作業で適当に書体を混ぜる場合とは違う表情を作ります。
似たフォントを混ぜると、書体の違いがよく見える
派手な組み合わせだけでなく、よく似たフォント同士を混ぜる使い方も面白そうです。
普段は別々の文章で見ている書体を一つの文章へ混ぜると、文字幅、xハイト、曲線、セリフ、ウェイトなどの違いが急に目につくようになります。
特に、見た目が近いと思っていた二つのフォントを混ぜると、どこが違うのかを観察しやすくなります。
「この書体はなんとなく柔らかい」「こちらは少し硬く見える」と感覚的に捉えていた差を、一文字ずつ比較するきっかけにもなります。
フォントを作った経験がなくても、普段使っている書体がどんな形で成り立っているのかを見るには面白い方法です。
フォントを「選ぶもの」から「材料」へ変える
デザインをするとき、フォントは完成されたものの中から選ぶことがほとんどです。
ゴシック体にするか、明朝体にするか。太さはどうするか。別の書体へ変えるか。
Bastardicaでは、その選択肢の間に「二つを混ぜる」が入ります。
もちろん、専門的なタイプデザインを代替するツールではありません。グリフを一から設計して書体全体を完成させるフォントエディターとは目的が違います。
それでも、既存フォントを完成品として眺めるだけではなく、グリフを取り出して別の書体と組み合わせ、位置や大きさを変えてみると、文字を見る感覚は少し変わります。
綺麗なフォントを作ることより、文字のどこを変えたら違和感が生まれるのかを試すことに向いたツールです。
Bastardicaという名前の通り、最初から行儀のいいタイポグラフィを作るつもりはなさそうですが、その遊び方を通してフォントの違いまで見えてくるのが、このツールの面白いところです。
関連リンク
Bastardica|公式ツール
Boing Boing|Bastardica is a "foundry for bastard web fonts"
Linxi News|Bastardica browser tool creates mixed OpenType fonts